내가 궁금해서

api연결 강의 들으면서 할 때나 누가 해논거 보고 따라 할 때는 어렵다고 안 느꼈는데 첨부터 혼자 할라니까 넘나 어렵다.... 그래서 공공데이터포털에서 한번 연결해 보려고 한다 일단 공공데이터포털에 들어가 로그인을 한닷! https://www.data.go.kr/tcs/eds/selectCoreDataListView.do 공공데이터 포털 국가에서 보유하고 있는 다양한 데이터를『공공데이터의 제공 및 이용 활성화에 관한 법률(제11956호)』에 따라 개방하여 국민들이 보다 쉽고 용이하게 공유•활용할 수 있도록 공공데이터(Datase www.data.go.kr 공공데이터를 활용한 예제도 볼 수 있다 https://www.data.go.kr/tcs/puc/selectPublicUseCaseListView.do..

API어렵따,,,! fetch해서 데이터가져와서 뿌리기!!! 가 프론트엔드의 기초 이지만 설명해보시오 하면 오잉ㅇㅣ다 REST API를 알아보기전에 API의 대해서먼저 알아봐야할 필요가 있다.. 🏔️API란 Application Programming interface(애플리케이션 프로그램 인터페이스)의 줄임말이다 비유해보자면 식당에서 점원이 준 메뉴를보고 주문을 하면, 점원이 주문을 받아 요리사에게 전달한다 요리사는 요리를만들고 점원에게 주고 점원은 손님에게 요리를서빙한다 이처럼 API는 식당의 점원과 같은 역할을 한다. 여기서 손님과 요리사는 프로그램! API는 프로그램들이 서로 상호작용하는 것을 도와주는 매개체이다. 🏔️REST란 REST(Representational State Transfer)의 ..

코드를 짜다보면 e.preventDefault()를 사용할때가 많다 하지만 이유는 모름 다들 사용하니까 그냥 사용하는 느낌....그래서 갑자기 왜 사용하는지 궁금해져서 알아봤다 a 태그나 submit 태그 같은 경우 클릭하면 href를 통해 이동하거나 새로고침하여 페이지가 열리게 되는데 preventDefault를 사용하면 위와같은 경우를 막아줄수가 있다...! 1. a태그를 눌렀을때에도 링크로 이동하지 않게 하고싶은 경우 2. form 안에 submit 역활을 하는 버튼을 눌러도 새로고침을 하고싶지 않은 경우 2의 경우 예시 constructor(props){ super(props); this.state = { first: Math.ceil(Math.random() * 9), second: Math.c..

🖍️router란 경로에 맞는 페이지를 보여준다 ~~더알아보기~~ ✔️react-router를 사용하는 이유 주요로직과 라우팅처리 분리 '동적라우팅', '중첩라우팅' 등을 쉽게 관리 ✔️react-router를 사용할때 기억해야할 3가지 , , BrowserRouter: 브라우저에 내장되어있는 히스토리스택을 사용해 라우팅을 구현하게 해주는 컴포넌트 Routes: Route: Routes에 감싸지 않으면 에러가 난다 App.js에 사용하는 고정된 사용 방법이다 function App() { retrun ( ) } Route 안에는 path 와 element가 있는데 path는 주소창에 들어갈 주소를 적으면 되고 element는 해당 주소에서 보여줄 컴포넌트를 넣어주면 된다. ✔️useParams() key..

아직 개념이 확실하지않아서 매우매우 헷깔리는중.. 그냥아무거나 갖다붙이는거같아서 제대로알아보려고한다 (문과식으로 이해하도록하는걸로..! 주절주절 넘어려운말이 많음..) 📍프레임워크란? frame은 "틀", work은 "일하다"라는 뜻이다. 두가지의 의미를 합치면 틀을 가지고 일하다 가 된다. 예를들면 Vue에서 우리는 v-bind, v-for 등의 틀을 가지고 작업을한다. 프로그램 개발을 하기위해 사용되는 틀을 제공하는 프로그램! 이라고 보면된다 ⭕️프레임워크의장점 효율적이다 기본적인 틀이 존재하기에 시간도 절약이 되며 훨씬 더 빨리 만들수있다. 유지보수가 쉽다. 하나하나 개개인이 짜놓았던 코드라면 다른사람이 볼 경우 알기 어렵지만 프레임워크를 사용한 코드라면 체계적이기 때문에 다른사람이 만든것이라도 알..

방글라아조씨가 리액트 못써서 자기는 solidjs 쓴다고 알려줘따 아저씨 개발신인데 왜 리액트 안 쓰는거야,,, 아조씨가 리액트만썼었어도,,내가 안그만둬써,,(우소데스) solid js란React 에서 사용하는 JSX 문법을 사용하며, 가장 빠른 성능과 가장 정확한 반응성을 강점으로 내세우고 있다. 나온지 얼마 안 됐음에도 벌써 Cloudflare, Netify 등 주요 클라우드 업체에서 주목받고 사용하는 웹 프레임워크이다. 21년도에 출시된 아주 땃끈한 프레임워크이다 리액트랑 엄청나게 비슷하게 나와서 첨에 코드보고 리액트? 했음 React 앱의 스크립트 읽기 속도 475ms, 렌더링 속도 129ms, 배포 번들 크기는 핵심과 앱 순으로 각 161KB, 5KB SolidJS 앱의 스크립트 읽기 속도 17..

나는 계속 npm을 써왔었는데 어느순간 보니까 다들 npx를 쓰고있었다. npm install OOO -g 그냥 다들 글로벌로 설치하길래 나듕,,하고썻는데 생각해보면 나 왜 글로벌 씀 이거였,,,,,,,,,왜죠,, 글로벌로 설치하면 안 좋은 점이 1. 모듈이 업데이트되었는지 확인불가 2. 업데이트했을 때 변동사항이 생겨 다른 프로젝트에 영향을 끼침 3. create-react-app에 치명적,, 3에 치명적인 이유는 create-react-app는 변경사항이 잦기 때문에 매번 npm을 재설치하지 않으면 이전버전 그대로 사용할 수도 있다는,, 그러므로 매번 npm을 다시 설치하지 않으면 안 된다 그래서 나온 것이 npx!!! 글로벌이 아니고 매번매번 새로운 버전을 가지고 와준다 결론은 npx가 조타,, 입..