Loading...
잠시만 기다려 주세요.
BrowserRouter, Routes, Route 컴포넌트를 활용하여 라우팅 구조를 설정하고, element와 component 속성 사용법을 설명합니다. 🛣️useParams 훅을 통해 /project/:id와 같은 동적 라우트의 URL 파라미터를 가져오는 방법을 시연합니다. 🆔* 경로를 사용하여 404 페이지를 구현하고, 중첩 라우트에서의 * 동작 방식을 간략히 설명합니다. 🚫Outlet 컴포넌트를 활용하여 헤더, 푸터와 같은 공통 레이아웃을 정의하고, 자식 라우트들이 해당 레이아웃 내에 렌더링되도록 합니다. 🧱useNavigate 훅을 사용하여 프로그래밍 방식으로 페이지를 이동시키는 방법을 보여줍니다. 🚀Link와 NavLink의 차이를 설명하며, 활성 상태에 따른 스타일 변경을 위해 NavLink 사용을 권장합니다. 🔗NavLink의 isActive 속성을 활용하여 현재 활성화된 메뉴 항목의 CSS(예: font-weight, padding)를 동적으로 변경합니다. ✨NavMenu 컴포넌트를 생성하여 isNavLink 프롭스에 따라 Link와 NavLink 기능을 조건부로 렌더링하는 방법을 시연합니다. ♻️display: flex, , , , , 등 기본적인 CSS 속성으로 레이아웃과 간격을 조정합니다. 📐flex-directionjustify-contentalign-itemsgappaddingvh 단위와 flex: 1 속성을 사용하여 레이아웃을 조정합니다. 📏Recommanded Videos