Practice Section
This section is part of a practice project demonstrating different types of navigation in Next.js.
- Navigation using Link: for linking between pages.
- Dynamic navigation: using dynamic routes.
- Programmatic navigation: using
useRouter to navigate via events.
Layout and Styling Notes
flex flex-col lg:flex-row: makes the layout vertical on mobile and horizontal on desktop.lg:ml-64: adds space for the sidebar on the left in desktop view.fixed on mobile: keeps the sidebar at the top of the screen.lg:static on desktop: places the sidebar on the side (not fixed).flex-1 for main: lets the content area fill the remaining space.h-screen with fixed: makes the sidebar full-height and sticky while scrolling.Search with Lucide Library: for search icon Magnifying Glass Icon.
