<aside> 💡

이제 본격적인 Next.js 프로젝트 시작! 두근두근 💗 기초 셋팅은 정말 중요하다. 말해 뭐해..!

</aside>

Next.js 프로젝트 생성 및 기본 설정

**공식문서를 잘 활용하자! h**ttps://nextjs.org/

시작해보기

  1. Next.js 애플리케이션을 생성할때, 자동으로 모든걸 셋업해주는 가장 빠른 방법인 명령어 입력

    // 가장 최신버젼 설치
npx create-next-app@latest 

// 원하는 버젼으로
npx create-next-app@15.2.7 

// 현재 디렉토리에서 바로 생성 -> 뒤에 ./를 붙여준다
npx create-next-app@latest ./

    스크린샷 2025-05-30 오후 10.39.59.png

  2. 그럼 이렇게 아래와 같이 yes/no 질문이 나오고, 내가 원하는 환경에 맞게 셋팅해주면 된다

    * 타입스크립트 사용할거니?
* ESLint는?
* Tailwind CSS는?
* 'src/' directory 사용할거야?
* App router 사용할거야? (추천할게)
* (next dev를 위한) 터보팩은?
  * Next.js에 새롭게 도입된 초고속 번들러. 코드를 수정했을때 변경사항을 빠르게 반영해준다.
    기존 웹팩보다 더 빠른 환경을 제공.
    웹팩은 소스의 크기가 커지면 엄청 느린데, 터보팩을 사용하면 소스가 커져도 빠르게 확인 가능!
* import alias 커스터마이징하는건? 아님 요거 @/* 디폴트 사용할거임?

  3. package.json을 참고하여 개발 서버가 잘 동작하는지 확인해준다

    npm run dev

TypeScript 통합 방법