[next.js] 간단한 사이트 셋팅하기

JEONG SUJIN·2025년 9월 16일
0

next(리액트)

목록 보기
1/2
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

옵션추천 선택이유
TypeScriptYes나중에 확장성, 타입 안정성
LinterESLint코드 정리, 오류 예방
Tailwind CSSYes빠른 디자인 구현
src/ 폴더No작은 프로젝트라 루트로 충분
App RouterYes최신 Next.js 기능 활용
TurbopackYes최신 번들러 경험, 속도 빠름
Import AliasNo단순 구조라 필요 없음

http://localhost:3000 여기로 접속하면,

이렇게 나오면 Next.js 개발서버가 정상적으로 켜졌고, 셋팅은 잘된거같다!!!!

profile
기록하기

0개의 댓글