A modern course management web application built with Next.js, Firebase, TailwindCSS, and Chart.js. Users can sign up, log in, create courses, add lessons, drag & drop reorder, unlock badges, and track their progress — with live updates and celebrations! 🎉
🔐 Authentication (Login / Signup / Update / Logout) with Firebase
📖 Add, complete, undo, delete lessons inside each course
📦 Drag and Drop lesson reordering (@hello-pangea/dnd)
🏆 Gamified Progress
Unlock badges every 5 completed lessons
Level up every 10 lessons completed
🎉 Confetti and Celebration Sound on unlock
📈 Progress Charts
Doughnut Progress Chart (Courses)
Animated Progress Bars (Lessons)
🎖️ Achievement Gallery
Live badge and level updates (no page refresh)
Toggle between "Show All" and "Unlocked Only"
🖼️ Profile Management
Update Name, Email, Password, Add Phone
Secure Delete Account
🌐 Protected Routes (dashboard, gallery, profile require login)
🎨 Responsive UI with beautiful TailwindCSS design
🎯 Real-time updates using Firebase onSnapshot
🛠️ Tech Stack
Frontend Backend Database Other
React.js Next.js Firebase Firestore TailwindCSS
NextAuth Node.js (built-in) Firebase Authentication Chart.js…A modern course management web application built with Next.js, Firebase, TailwindCSS, and Chart.js. Users can sign up, log in, create courses, add lessons, drag & drop reorder, unlock badges, and track their progress — with live updates and celebrations! 🎉
🔐 Authentication (Login / Signup / Update / Logout) with Firebase
📖 Add, complete, undo, delete lessons inside each course
📦 Drag and Drop lesson reordering (@hello-pangea/dnd)
🏆 Gamified Progress
Unlock badges every 5 completed lessons
Level up every 10 lessons completed
🎉 Confetti and Celebration Sound on unlock
📈 Progress Charts
Doughnut Progress Chart (Courses)
Animated Progress Bars (Lessons)
🎖️ Achievement Gallery
Live badge and level updates (no page refresh)
Toggle between "Show All" and "Unlocked Only"
🖼️ Profile Management
Update Name, Email, Password, Add Phone
Secure Delete Account
🌐 Protected Routes (dashboard, gallery, profile require login)
🎨 Responsive UI with beautiful TailwindCSS design
🎯 Real-time updates using Firebase onSnapshot
🛠️ Tech Stack
Frontend Backend Database Other
React.js Next.js Firebase Firestore TailwindCSS
NextAuth Node.js (built-in) Firebase Authentication Chart.jsWW…