🔧 개발환경 세팅
npx create-next-app@14
새 터미널에 위 명령어를 치고 project name 과 설정들을 선택해주면 새로운 폴더와 파일이 생성된다.
그 파일을 열어서 진행하면 된다.
보통 다른 선택사항들을 No 로 했고, App router 선택만 Yes 로 했다.
npm run dev
를 쳐서 나오는 주소로 들어가서 미리보기 가능.
🔧 파일 구조
page.js
메인 파일
layout.js
page.js 를 감싸는 파일
<head> 태그, 상단bar 등을 보통 넣는다.
globals.css
모든 페이지에 적용될 css 파일
page.module.css
특정 파일에만 적용시키고 싶은 css 파일
작명.module.css 로 파일을 만들어서 사용한다.
api 폴더
서버 기능을 만드는 곳
node_modules
설치한 라이브러리를 보관해준다.
public
이미지 등을 저장
package.json
설치한 라이브러리를 자동으로 기록해준다.
🔧 파일 세팅
export default function Home() {
return (
<div>
</div>
);
}
page.js 에 위 코드만 남겨두고 다 정리를 했고,
globals.css 와 page.module.css 파일 모두 다 지워서 정리를 했다.
'컴퓨터 프로그래밍 > Next.js' 카테고리의 다른 글
| [Next.js] EventHandler, useState 선언 및 수정, Array,Object state 변경 (0) | 2025.02.10 |
|---|---|
| [Next.js] server/client component, import export, props (0) | 2025.02.10 |
| [Next.js] map, img 삽입하는 2가지 방법 (0) | 2025.02.09 |