1
준비 단계: 경로 우선순위 정리
준비 단계에서는 입력 분포 기준으로 우선순위를 잡습니다.
기본 라우팅React Router의 핵심 컴포넌트와 훅을 사용해 정적/동적 라우팅을 설정하고, URL 파라미터와 쿼리 문자열로 데이터를 전달하며, 복잡한 UI를 위한 중첩 라우팅까지 이해하셨습니다. 이번 실습에서는 이 지식을 통합해 간단한 블로그 애플리케이션(Simple Blog Application)을 직접 구축해봅니다.
HomePage.js (기본 라우팅)와 PostListPage.js를 중심으로 간단한 다중 페이지 앱 만들기의 판단 흐름을 읽습니다.
준비 단계에서는 입력 분포 기준으로 우선순위를 잡습니다.
기본 라우팅블로그의 기본적인 레이아웃 및 폰트 스타일을 정의합니다.
동적 라우팅 (useParams)NavLink를 사용하여 블로그의 주요 페이지로 이동하는 링크를 만듭니다.
쿼리 문자열 (useSearchParams)