생활코딩: next.js

1. 설치 및 환경설정

PS D:\react-workspace\nextjs-test> npx create-next-app@latest .
√ Would you like to use TypeScript with this project? ... No / Yes
√ Would you like to use ESLint with this project? ... No / Yes
√ Would you like to use Tailwind CSS with this project? ... No / Yes
√ Would you like to use `src/` directory with this project? ... No / Yes
√ Use App Router (recommended)? ... No / Yes
√ Would you like to customize the default import alias? ... No / Yes
Creating a new Next.js app in D:\react-workspace\nextjs-test.

Using npm.

Initializing project with template: app-tw


Installing dependencies:
- react
- react-dom
- next
- tailwindcss
- postcss
- autoprefixer
- eslint
- eslint-config-next


added 345 packages, and audited 346 packages in 33s

136 packages are looking for funding
  run `npm fund` for details

found 0 vulnerabilities
Initialized a git repository.

Success! Created nextjs-test at D:\react-workspace\nextjs-test

PS D:\react-workspace\nextjs-test>

 

2. 실행

PS D:\react-workspace\nextjs-test> npm run dev 

> nextjs-test@0.1.0 dev
> next dev

- ready started server on 0.0.0.0:3000, url: http://localhost:3000
Attention: Next.js now collects completely anonymous telemetry regarding usage.
This information is used to shape Next.js' roadmap and prioritize features.
You can learn more, including how to opt-out if you'd not like to participate in this anonymous program, by visiting the following URL:
https://nextjs.org/telemetry

- event compiled client and server successfully in 2.2s (311 modules)
- wait compiling...
- event compiled client and server successfully in 487 ms (311 modules)
- wait compiling /page (client and server)...
- event compiled client and server successfully in 3.2s (586 modules)
- wait compiling...
- event compiled successfully in 134 ms (334 modules)

 

 

 

버전업 되면서 책과 상이한 부분이 있어 실습을 나중으로 미룬다.