[Next.js] 개발 환경 및 실행

Next.js는 웹 애플리케이션을 구축하기 위한 프레임워크

Next.js를 사용하면 React 구성 요소를 사용하여 사용자 인터페이스를 구축할 수 있다. 그런 다음 Next.js는 애플리케이션에 대한 추가 구조, 기능 및 최적화를 제공

또한 내부적으로 Next.js는 번들링, 컴파일 등과 같은 도구를 추상화하고 자동으로 구성한다. 이를 통해 도구 설정에 시간을 소비하는 대신 애플리케이션 구축에 집중할 수 있다.

개인 개발자이든 대규모 팀의 일원이든 관계없이 Next.js는 대화식의 동적이며 빠른 웹 애플리케이션을 구축하는 데 도움이 될 수 있다.
 
https://nextjs.org/docs/getting-started/installation

Getting Started: Installation | Next.js

자동 설치 명령어

npx create-next-app@latest

 
수동 설치 명령어

npm install next@latest react@latest react-dom@latest

 
다음으로 앱 폴더를 만들고 layout.tsx 및 page.tsx 파일을 추가. 사용자가 애플리케이션의 루트를 방문할 때 렌더링된다. 

 
실행

npm run dev

http://localhost:3000 접속
app/layout.tsx 또는 app/page.tsx를 편집하고 저장하면 브라우저에서 업데이트된 결과를 볼 수 있다.