You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: src/content/docs/kr/docs/guides/tech/with-nextjs.mdx
+7-3Lines changed: 7 additions & 3 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -13,11 +13,15 @@ FSD는 Next.js의 App Router와 Pages Router 양쪽에 적용할 수 있습니
13
13
14
14
### `app` layer에서 FSD와 Next.js의 충돌 \{#conflict-between-fsd-and-nextjs-in-the-app-layer\}
15
15
16
-
App Router에서는 `app` 폴더 구조가 곧 라우트 구조가 됩니다. 반면 FSD에서 `app`은 라우트 폴더가 아니라 애플리케이션 전역 구성을 위한 layer입니다. 두 구조가 같은 `app` 폴더를 서로 다른 용도로 사용하기 때문에 충돌이 발생합니다.
16
+
App Router에서는 `app` 폴더 구조가 그대로 라우트 구조로 사용됩니다. 반면 FSD에서 `app`은 애플리케이션 전역 구성을 담당하는 layer입니다.
17
+
두 구조에서 `app` 폴더가 담당하는 역할이 다르기 때문에 같은 위치에서 함께 사용할 수 없으며, 구조 충돌이 발생합니다.
17
18
18
-
이 충돌을 피하려면 Next.js의 `app` 폴더는 프로젝트 루트에 두고, 여기에는 라우트 파일만 둡니다. 실제 페이지 파일은 `src` 하위의 FSD 구조에 유지합니다. 루트 `app`의 각 라우트 파일은 `src/pages`의 페이지 파일을 가져와 연결합니다.
19
+
이 충돌을 피하려면 Next.js의 `app` 폴더는 프로젝트 루트에 두고, 라우팅에 필요한 파일만 배치합니다.
20
+
페이지 파일은 `src` 하위의 FSD 구조에 유지하며, 루트 `app`의 각 라우트 파일이 `src/pages`의 페이지 파일을 가져와 연결합니다.
21
+
22
+
프로젝트 루트에는 빈 `pages` 폴더도 함께 두어야 합니다. 그렇지 않으면 App Router를 사용하더라도 Next.js가 `src/pages`를 Pages Router로 인식하므로 빌드가 실패합니다.
23
+
또한 이 루트 `pages` 폴더가 왜 필요한지 설명하는 `README.md`를 함께 두는 것이 좋습니다.
19
24
20
-
프로젝트 루트에는 빈 `pages` 폴더도 함께 두어야 합니다. App Router를 쓰더라도 Next.js는 `src/pages`를 Pages Router로 사용하려 하므로 빌드가 실패합니다. 루트의 빈 `pages` 폴더가 이 동작을 막습니다. 폴더 안에는 왜 비어 있어야 하는지 설명하는 `README.md`를 두는 것이 좋습니다.
0 commit comments