Next.js | 개발환경 세팅, 실행

 

 

 

 

기초지식 

 

SSR(Server Side Rendering) 

페이지 전체(html파일)을 서버로부터 받아와서 렌더링한다. (정적 웹사이트)

 

CSR(Client Side Rendering) 

리액트, 뷰와 같이 클라이언트 쪽에서 서버에게 데이터만 받아와서 입맛에 맞게 변형(동적 웹사이트)

 

 

 

 

Next.js 란

 

 

 

 

 

 

풀스텍 웹 앱을 만들기 위한 도구이다. 

서버사이드 렌더링에 최적인 도구이다. 

 

 

 

개발환경 세팅

 

next.js 프로젝트 생성하기

npx create-next-app@latest .

 

 

 

 

 

위와 같은 파일이 생성되면 개발환경 세팅 끝

 

 

 

 

실행

 

npm run dev

 

 

샘플앱이 성공적으로 보이면 된다. 

 

 

 

 

 

 

 

https://nextjs.org/

Next.js by Vercel - The React Framework

 

https://www.youtube.com/watch?v=9KOaR6QMb9A&list=PLuHgQVnccGMCwxXsQuEoG-JJ7RlwtNdwJ