npx create-next-app@latest my-portfolio 입력하면
Need to install the following packages:
create-next-app@15.5.3
Ok to proceed? (y) y 입력해주면
아래에
✅ Would you like to use TypeScript?
Yes 선택하면 TypeScript 기반의 Next.js 프로젝트
✅ Which linter would you like to use? › - Use arrow-keys. Return to submit.
❯ ESLint << 선택
More comprehensive lint rules
Biome
None
그럼
Next.js + TypeScript + ESLint 환경이 세팅
✅ Would you like to use Tailwind CSS? … No / Yes
✅ Would you like your code inside a src/ directory? › No / Yes
✅ Would you like to use App Router? (recommended) › No / Yes
App Router → Next.js 13 이후 기본 라우팅 방식
✅ Would you like to use Turbopack? (recommended) › No / Yes
Turbopack → Next.js 13에서 새롭게 도입된 빠른 번들러
✅ Would you like to customize the import alias (@/* by default)? › No / Yes
옵션 | 추천 선택 | 이유 |
---|---|---|
TypeScript | Yes | 나중에 확장성, 타입 안정성 |
Linter | ESLint | 코드 정리, 오류 예방 |
Tailwind CSS | Yes | 빠른 디자인 구현 |
src/ 폴더 | No | 작은 프로젝트라 루트로 충분 |
App Router | Yes | 최신 Next.js 기능 활용 |
Turbopack | Yes | 최신 번들러 경험, 속도 빠름 |
Import Alias | No | 단순 구조라 필요 없음 |
http://localhost:3000 여기로 접속하면,
이렇게 나오면 Next.js 개발서버가 정상적으로 켜졌고, 셋팅은 잘된거같다!!!!