TIL

TIL : 오늘은 무엇을 배웠나?

오버브레이크 2024. 3. 11. 14:15

next.js 는  무엇인가?  ( 참고 )

 

Reactjs기반  폴스택   프레임워크 입니다.

     프레임워크 

          00 이렇게 작성하라는  작성법을  공식 메뉴얼로 제시  

          예시)  스프링 프레임워크  ,  Vue.js

 
      라이브러리 

         기능을 하는  덩어릴 뿐입니다. 

         예시)   리액트에서 리액트 라우터를  설치 받습니다.  

 

 

next.js 프레임워크가 가지고 있는  기능 

 

  -  API Route를 지원하여  폴스택(프론트 + 백엔드) 개발이 가능해집니다.

  -  웹 페이지 로딩시간을 줄이는 코드스프리팅이  기본이다. 

  -  vercel이 개발하여  vercel 에 배포가능합니다.

  -  fetch를 이용한  요청이 확대되었습니다.

 

next.js 설치하고  샘플 앱  실행하기  ( 참고 

next.js 설치 관련해서는  next.js 공식 설치 매뉴얼을 이용했습니다.

 

 

그리고 다음과 같이  Next.js 를  설치하겠습니다.  설치 명령어는 공식 설치 메뉴얼에 따름니다. 

다음과 같이  설정하시면 되겠습니다.  참고로  Tab키를 눌러서  project 이름을 수정할 수 있습니다. 

 

 

저는  npm install 이 실패로 들어갔군요.....   네트워크 관련 에러를  뺃는군요  ( 해결 )

 

ECONNRESET 오류에 대해  구글링을 하여 다음과 같이 찾았습니다.  ( 참고 )

 

해결방법 

           0. nextjs프로젝트 만든 폴더로 이동하기 

          1.  위에서 알려준 명령어를 다음과 같이 입력

          2.  npm install로   npm 재 설치

 

 

 

npm run dev 하니 또 에러가 나왔군요 ( 해결 , 참고링크는  여기 )

 

다음과 같이  nextjs 앱 폴더에서  node_modules  와 package-lock.json  모두 제거해주세요

 

그리고 npm install 해주세요. 그리고  npm run dev 를 다시 해주세요 이제 다시  되었습니다.

 

 

 

NEXT.js  의미 , 설치 , 실행법에 대해서 알아보았습니다.