Next.js

Next.js는 웹을 위한 React 프레임워크입니다. 세계 최대 기업들이 사용하는 Next.js는 React 컴포넌트의 강력함으로 고품질 웹 애플리케이션을 만들 수 있게 해줍니다.

빠른 시작

Turborepo에서 Next.js를 빠르게 시작하려면 빠른 시작을 따라 두 개의 Next.js 애플리케이션이 있는 저장소를 생성하세요:

Terminal
pnpm dlx create-turbo@latest

기존 저장소에 Next.js 애플리케이션 추가하기

create-next-app을 사용하여 패키지에 새 Next.js 애플리케이션을 설정합니다. 저장소의 루트에서 다음을 실행하세요:

Terminal
pnpm dlx create-next-app@latest apps/my-app

저장소와 통합하기

새 애플리케이션에 내부 패키지를 추가하려면 패키지 매니저를 사용하여 앱에 설치하세요:

./apps/my-app/package.json
{
  "name": "my-app",
  "dependencies": {
+   "@repo/ui": "workspace:*"
  }
}

패키지 매니저의 install 명령을 실행해야 합니다. 또한 저장소의 사용 사례에 맞게 package.jsonscripts를 업데이트해야 할 수도 있습니다.

작업 사용자 정의

기본적으로 새 애플리케이션은 루트 turbo.json에 정의된 작업을 사용합니다. 새 애플리케이션에 대해 작업을 다르게 구성하려면 패키지 구성을 사용하세요.

마이크로프론트엔드

Turborepo의 마이크로프론트엔드와 함께 Next.js를 사용할 때는 하위 애플리케이션에 대해 basePath 속성을 설정해야 합니다. 이렇게 하면 이미지 및 CSS와 같은 자산이 올바른 애플리케이션으로 라우팅됩니다.

./apps/my-app/next.config.ts
import type { NextConfig } from 'next';
 
const nextConfig: NextConfig = {
  basePath: '/docs',
};
 
export default nextConfig;