인프런 커뮤니티 질문&답변
작성한 질문수
[강의 오류 리포트] React Router Outlet 사용 오류
해결된 질문
작성
·
20
0
문제 발생 섹션: 4-1. Footer 제작
문제 내용:
강의 자료에서 제공된 App.jsx 코드에 구조적 오류가 있습니다.
문제점:
1. RootLayout 컴포넌트 내부에서 <Outlet /> 컴포넌트를 사용하고 있으나, 라우터 설정에 자식 라우트(children routes)가 정의되어 있지 않습니다.
2.현재 라우터 구조:
```
const router = createBrowserRouter([
{
path: "/",
element: <LootLayout />,
// children이 없음 - Outlet이 렌더링할 내용이 없음
},
]);
```
발생한 에러:
Outlet컴포넌트 관련 에러 발생해당 코드 제거 시 정상 동작
제안 사항:
아래 두 가지 중 하나로 수정이 필요합니다:
방법 1)
자식 라우트가 없다면 Outlet 제거
```
<main className="flex-grow container mx-auto px-4 py-8">
{/* <Outlet /> 제거 */}
</main>
추가 의견:
해당 강의를 수강하면서 이번 건 외에도 여러 오류를 발견했습니다. 학습에 상당한 지장이 있는 상황이므로, 강의 전체에 대한 코드 검수 및 업데이트를 요청드립니다.
특히 React Router v6의 최신 문법과 개념(Outlet, createBrowserRouter 등)이 정확히 반영되었는지 재확인이 필요해 보입니다.
수강생들이 불필요한 디버깅 시간을 소비하지 않도록 조속한 개선 부탁드립니다.
답변 1
0
안녕하세요, 소중한 오류 리포트 남겨주셔서 진심으로 감사드립니다.
말씀해주신 React Router Outlet 관련 오류는 확인 후, 문제된 부분을 수정하였습니다. 강의 영상이 업로드 과정에서 임의로 분할되는 과정에서 코드 구조 일부가 누락되어 발생한 문제로 확인되었습니다. 이러한 실수로 인해 학습에 불편을 드린 점 진심으로 사과드립니다.
현재 챕터 4의 코드 및 강의 내용을 다시 꼼꼼히 검수하였고, 1~3챕터 또한 검수를 진행하였으며, 이후 챕터들 또한 순차적으로 검수 및 수정 작업을 진행 중입니다. 질 낮은 강의로 실망을 드린 점 매우 죄송하게 생각하며, 더 나은 완성도로 보답드리겠습니다.
귀중한 시간 내어 상세히 제보해주셔서 다시 한 번 감사드립니다. 꾸준히 개선하며 신뢰할 수 있는 강의로 만들어가겠습니다. 감사합니다.