afnotek51-create/Afnotek-frontend

Empowering Africa With Technology - The Future is Digital. Afnotek is a movement driving digital literacy, innovation, and empowerment across the continent. # Afnotek - Digital Empowerment Platform Afnotek is a modern, responsive web application designed to empower African youth with digital skills. This platform features a comprehensive Learning Management System (LMS) interface, course discovery, community engagement tools, and a blog for tech insights. ## 🚀 Features ### Public Pages - **Home Page:** immersive hero section, mission/vision statements, and team showcase. - **About Us:** Detailed company background, "Meet the Visionary" section, and core values. - **Courses Explore:** Public catalog of available courses with filtering by category and search functionality. - **Programs:** Timeline of upcoming bootcamps, hackathons, and events. - **Community:** Information on forums, peer learning groups, and mentorship. - **Blog:** A grid layout for tech articles and news with category filtering. - **Contact:** Split-screen contact form with interactive inputs. ### User Dashboard (LMS) - **Dashboard Home:** Overview of learning stats (Hours learned, courses completed), welcome banner, and recommended courses. - **My Courses:** Track progress of enrolled courses with visual progress bars and status indicators. - **Sidebar Navigation:** specific, responsive navigation for the authenticated area. ### Authentication - **Login & Signup:** Professional authentication forms with input validation, loading states, and responsive layouts. ## 🛠️ Tech Stack - **Frontend Framework:** React.js - **Styling:** Tailwind CSS (Custom color palette: #183E2F Dark Green & #00FF99 Neon Green) - **Animations:** Framer Motion (Page transitions, hover effects, modal animations) - **Icons:** Lucide React - **Routing:** React Router DOM ## 📂 Project Structure ``` src/ ├── assets/ # Images and static files ├── components/ # Reusable components │ ├── Header/ # Public navigation │ ├── Sidebar/ # Dashboard navigation │ └── Footer/ # Site footer ├── pages/ # Main page views │ ├── Home.jsx │ ├── About …