Back to Projects
CodeMap

📌 CodeMap Academy — Full-Stack MERN E-Learning Platform

CodeMap Academy is a full e-learning platform I built using Next.js + Node.js/Express + MongoDB, offering a complete learning experience with courses, podcasts, roadmaps, payments, dashboards, and real-time features.

🎯 What I Built

  • Full course system (videos, progress, reviews, Q&A)
  • Interactive learning roadmaps
  • Podcast platform with categories & audio player
  • Real-time notifications (Socket.IO)
  • Stripe payment integration
  • Admin dashboard with analytics (users, orders, revenue)
  • Authentication: email verification, login, JWT, reset password
  • RTL/LTR internationalization (Arabic + English)
  • Dynamic layout management (CMS-like)

🧩 Frontend (Next.js 15 + TypeScript)

  • Next.js 15 (App Router, SSR, caching)
  • Redux Toolkit + RTK Query
  • Tailwind CSS, MUI, NextUI
  • Framer Motion, GSAP animations
  • NextAuth for secure authentication
  • Multi-language with i18next
  • Fully responsive + smooth UX

⚙️ Backend (Node + Express + MongoDB)

  • REST API with serverless Netlify functions
  • MongoDB + Mongoose
  • JWT auth (access + refresh tokens)
  • Cloudinary media storage
  • Stripe checkout
  • Nodemailer (EJS templates)
  • Real-time notifications with Socket.IO
  • Advanced analytics via MongoDB aggregation

🔐 Security

  • JWT authentication
  • Rate limiting
  • Input sanitization (XSS, HTML sanitize)
  • CORS control
  • Secure cookies
  • Role-based authorization

🚀 Deployment

  • Frontend: Vercel
  • Backend: Netlify Serverless
  • Fully optimized and scalable architecture

📈 Impact

  • Complete SaaS-level e-learning platform
  • Designed for performance, security, and real production use
  • Shows deep MERN expertise, scalable architecture, and full-stack mastery

Tech Stack

Nextjs
Nextjs
Nodejs
Nodejs
Tailwind Css
Tailwind Css
Open Graph
Open Graph
Typescript
Typescript
Redux
Redux
Material-UI
Material-UI
Shadcn
Shadcn
Radix UI
Radix UI
Framer Motion
Framer Motion
GSAP
GSAP
Lenis
Lenis
i18next
i18next
Next Auth
Next Auth
Express.js
Express.js
MongoDB
MongoDB
Cloudinary
Cloudinary
Nodemailer
Nodemailer
Socket.io
Socket.io
Vercel
Vercel
Netlify
Netlify

Project Gallery

CodeMap screenshot 1
CodeMap screenshot 2
CodeMap screenshot 3
CodeMap screenshot 4
CodeMap screenshot 5
CodeMap screenshot 6
CodeMap screenshot 7
CodeMap screenshot 8
CodeMap screenshot 9
CodeMap screenshot 10
CodeMap screenshot 11
CodeMap screenshot 12
CodeMap screenshot 13
CodeMap screenshot 14
CodeMap screenshot 15
CodeMap screenshot 16
CodeMap screenshot 17
CodeMap screenshot 18
CodeMap screenshot 19
CodeMap screenshot 20
CodeMap screenshot 21
CodeMap screenshot 22
CodeMap screenshot 23

Ready to explore?

Check out the live project or dive into the source code on GitHub