프로그래밍
-
[드림코딩엘리] Next.js 주요개념 (2강)프로그래밍/Next.js 2023. 8. 1. 10:01
개념정리 Next.js와 React 의 차이점 라이브러리와 프레임워크의 차이라고 볼 수있다 프레임워크는 큰 단위의 솔루션을 제공해준다. 골격이 정해져있다 반면에 라이브러리는 큰 골격이 정해져 있지는 않지만 여러기능에 따라서 사용자가 원하는대로 사용하면 된다는 느낌 프레임워크인 Next.js는 리액트로 웹앱을 개발하는데 리액트 만으로는 힘든 정말 많은 것들을 가능하게 해주기 때문에 필요성이 강조된다. 프레임 워크의 이점 : 서버사이드 랜더링(+하이브리드 랜더링), 풀스택 파일을 베이스로 한 라우팅, seo솔루션 제공 Next.js의 철학과 잡고가야 할 포인트 버셀에서 2016년 최초공개 pass(cloud flatform as at service) : 클라우드에서 서비스를 배포하려면 알아야 할 갖은 기능들..
-
[은버지 Study] React-query에 대하여프로그래밍/React 2023. 7. 31. 01:34
react-query를 사용해야 하는 이유는 뭘까? 없다면 어떻게 비동기 state를 관리를 할까? useEffect로 비동기처리를 할려 생각하고 API를 가져와서 useState로 선언한 곳에 넣어주고 오류를 처리하는 작업도 따로 해주어야하는 번거롭고 boiler plate가 많이 일어나는 일을 거쳐야 한다. 이렇게 복잡한 것 말고 데이터 가져오고 관리하고 캐싱하고 하는 React-query한번 써보자 1. 기본 설정, Devtools, Options React Query의 설치 및 초기 설정 v3 npm install react-query yarn add react-query v4 (latest) $ npm i @tanstack/react-query $ pnpm add @tanstack/react-q..
-
[React] useRef 의 개념프로그래밍/React 2023. 7. 25. 02:31
useRef를 올바르게 쓰는 방법은 무엇일까? 먼저 useRef가 어떻게 작동하는지부터 알아보자 useRef란 current 객체를 반환하는 Hooks으로써 이렇게 한번 만들어진 current 객체는 랜더링이 발생해도 바뀌지 않고 고유한 값을 유지한다. 무수한 리랜더링 사이에서도 값을 유지해야하는경우 ex) infinite scroll의 식별객체 랜더링에 영향을 받지고 끼치지도 않는 특이한 녀석 ref의 변경은 감지되지도 않고 useEffect의 deps로도 사용할 수 없다 useRef의 초기값으로 null을 넣오도 되는 이유는? 이자식은 뭐하길래 null을 대부분의 초깃값으로 넣는 걸까? 객체가 선언되고 컴포넌트가 실행되고 평가가 진행되는 시점에서의 current객체는 null로 평가가 되기때문에 초기..
-
[유투브 어딘가] 통신에 관련된 영상을 잠깐보았다.프로그래밍/React 2023. 7. 18. 00:14
처음에는 JWT 토큰에 대한 내용을 찾아보다가 잘못들어 갔었다. 서버에 대해서 node.js들은 어떤식으로 구성하는지 보았는데 기억은 잘 안나지만 재밌어보였다. 클라이언트에서 서버로 요청을 할 때에 정보는 body 안에 넣어서 준다는 것을 알게되었다 fetch의 형식에 대해서 다시 한번 복습하는 기회가 되었다. fetch('서버주소').then((response)=>response.json()).then((data)=> console.log(data)); fetch를 사용할때에는 바디에 담아서 직렬화를 해준 다음에 보내준다. cors정책에 대해서 조금 더 알게되는 시간이 되었다 cross origin resorce sharing 에러가 난다면 어떻게 해결해야할까? client : 3000 개발서버 ser..