> For the complete documentation index, see [llms.txt](https://book.hajoeun.dev/friendly-next-js/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://book.hajoeun.dev/friendly-next-js/part-2/next.js-2/undefined.md).

# 프로젝트 소개

### 예제 소개

마이그레이션을 위해 총 세가지 예제를 사용합니다.&#x20;

1. [Vite](https://ko.vitejs.dev/)를 이용해 만든 React 앱 입니다. 기본 템플릿만 마이그레이션 합니다.
2. [create-react-app](https://create-react-app.dev/)을 이용해 만든 React 앱 입니다. 기본 템플릿만 마이그레이션 합니다.
3. Vite를 이용하고 [React Router](https://reactrouter.com/en/main)를 사용한 앱 입니다. 상품 목록, 상품 상세 페이지를 이동하는 앱을 마이그레이션 합니다. [Fake Store API](https://fakestoreapi.com/)를 이용하고 [TailwindCSS](https://tailwindcss.com/) 기반의 [daisyUI](https://daisyui.com/)를 함께 사용합니다.

이미지 최적화, 배포 환경 변경은 3번 예제를 이용해서 진행합니다.

### 공통 환경 설정

1. Node 20.10.0 버전을 사용합니다. (23년 12월 기준 LTS)
2. TypeScript 5 이상의 버전을 사용합니다.
3. VSCode를 사용합니다.
