[NextJS14] 시작하기

foresec·2024년 1월 21일

NextJS

목록 보기
1/6
  1. npm init -y로 패키지를 생성

  2. npm i next@latest react@latest react-dom@latest eslint-config-next@latest로 전부 최근 버전으로 설치
    이 때, node 버전도 최소 18.17.0으로는 업그레이드 해야함

  3. app/page를 tsx혹은 jsx형태로 생성. 여기서 빌드한 웹사이트의 최초페이지를 찾음
    즉, app폴더 안의 page를 nextjs가 감지함

    또한, export default 필수. 파일이름이 중요할 뿐 여기서 function 자체의 이름은 자유롭게 설정가능

    export default function Page () {
        return <h1>Hello Next</h1>
    }
  4. scripts에 작성한대로 npm run dev를 실행하면 app/layout.tsx와 tsconfig파일(ts사용시)이 자동으로 생성됨
    app/layout.tsx는 실수로 지워져도 자동으로 생성해줌


완성된 폴더구조

profile
왼쪽 태그보다 시리즈 위주로 구분

0개의 댓글