Next.js 13 - 1. 설치와 실행
2023. 8. 29. 12:37ㆍNext.js/생활코딩
Next.js 설치 및 실행 순서
- IDE 준비
- Node.js 설치
- Next.js 프로젝트 설치
아래 4개 중 자신의 상황에 맞는 코드 입력하여 실행한다. 나는 pnpm을 기존에 설치해둬서 pnpm으로 처리했다.
npx create-next-app@latestyarn create next-apppnpm create next-appbunx create-next-app프로젝트 세팅
여기서 중요한 것은 Next.js 13 버전에서 새로 나온 App Router를 Yes로 해주는 것이다. 나머지는 사용 유무에 따라 선택해주면 된다. 나는 마지막 것을 제외하고 모두 Yes 선택.
What is your project named? my-app
Would you like to use TypeScript? No / Yes
Would you like to use ESLint? No / Yes
Would you like to use Tailwind CSS? No / Yes
Would you like to use `src/` directory? No / Yes
Would you like to use App Router? (recommended) No / Yes
Would you like to customize the default import alias? No / Yes프로젝트 실행
설치를 어떤 것으로 했냐에 따라 실행 명령어가 달라진다.
npm run devpnpm run dev참고자료
생활코딩 - Next.js 13
https://opentutorials.org/course/5098
Next.js 13 - 생활코딩
수업 개요 Next.js는 웹 애플리케이션을 빌드하고 배포하는 데 강력한 도구입니다. 이 도구를 활용하면 모던한 웹 앱을 빠르고 효율적으로 구축할 수 있습니다. 그럼 함께 미래의 웹 개발 패러다
opentutorials.org
'Next.js > 생활코딩' 카테고리의 다른 글
| Next.js 13 - 5. 라우팅 (0) | 2023.08.30 |
|---|---|
| Next.js 13 - 4. 뼈대 만들기 (0) | 2023.08.30 |
| Next.js 13 - 3. 배포 (0) | 2023.08.30 |
| Next.js 13 - 2. 샘플앱 세탁 (0) | 2023.08.29 |
| Next.js 13 - 0. Next.js 란 무엇인가? (0) | 2023.08.29 |