[Next.js] Next.js + TypeScript 프로젝트 시작하기

시작하기 전에

오랜만에 새로운 프로젝트 시작하려다 마주친 삽질...

Next.js를 시작하는 사람이라면 Node.js를 예전부터 사용하던 사람일 가능성일 클 것 같아 작성해둔다.

 

기존 Node.js 버전과 Next.js lastest 버전이 맞지 않아 버전 업데이트를 해줘야했다.

Node.js는 홈페이지에서 LTS로 다시 다운로드. (14.?.? -> 18.4.0)

npm은 아래 명령어로 최신버전으로 업데이트 가능하다 (9.3.1? -> 9.4.1)

npm install -g npm@latest

 

create-next-app 으로 프로젝트 생성

npx create-next-app@latest --typescript

proceed에 따라서 enter 연타하다보면 프로젝트가 생성된다.

• ESLint 사용여부 > 당연히 Yes
• src/ 디렉토리 사용여부 > src에 모여있으면 좋을것같아 Yes
• 실험적인 app 디렉토리 사용여부 > 예제코드 포함여부일듯한데 어자피 나중에 지울것같아 No
• import alias 설정 > 나중에 수정가능하니 우선 그대로

 

npm start 로 실행하기

Could not find a production build in the ~~ 라는 에러가 발생한다면 build를 한번 해주면 된다.

npm run build

https://stackoverflow.com/questions/50947389/nextjs-cannot-find-a-valid-build-in-the-next-directory

NextJS cannot find a valid build in the '.next' directory

 

실행화면