[Next] Next.js 13 시작하기

공식 문서

 

시작하기 전 node.js를 설치해줘야한다!

1. 설치하기

폴더를 생성 후 터미널에 아래 명령어를 입력

npx create-next-app@latest .

명령어 입력 후 몇가지 옵션에 대해서 사용할건지 묻는데 필자는 TypeScript를 사용할 것이기 때문에 Yes로 하고 나머지는 필요한 것만 설정하면 된다.

 

2. 실행하기

npm run dev

 

 

npm run dev 명령어 입력하면 localhost 3000번으로 실행이 된다.

 

3. 폴더 구조

 

app폴더 안에 있는 page.tsx 또는 js가 메인 페이지이기 때문에 안에 내용은 위 처럼 다 지워서 필요한 내용만 작성하면 되고,

위에 layout.tsx가 page.tsx를 감싸는 파일. layout.tsx안에 page.tsx가 있다고 생각하면 된다.

globals.css는 전역으로 스타일을 적용할 수 있다.

public 폴더엔 보통 이미지 파일을 넣으며

마지막으로 package.json은 설치된 패키지 정보들이 자동으로 들어가있다.