MohaElbadry/darija-code-spark

# Darija Code Spark 🌟 **Learn to code, b darija!** Darija Code Spark is a beginner-friendly platform designed to teach programming concepts in **Darija** (Moroccan Arabic). Our mission is to make coding more accessible to Moroccan learners by explaining technical concepts in a simple, familiar language. ## 🌐 Live Demo 👉 Visit Darija Code Spark ## 📱 Responsive Design Fully responsive design with light and dark mode support for comfortable learning day and night. ## 📚 Key Features - 🧠 **Interactive Learning Paths**: Personalized roadmaps based on your goals and experience level - 🗣️ **Multi-language Support**: Learn in English, Arabic, French, or Moroccan Darija - 🤖 **AI-Powered Assistant**: Get help and explanations in your preferred language - 👨‍💻 **Project-Based Learning**: Apply your skills with practical coding projects - 👥 **Community Features**: Join study groups and connect with other learners - ☕ **Coffee & Code Sessions**: Scheduled virtual meetups for collaborative learning - 🔍 **Personalized Experience**: Learning tailored to your preferences ## 🛠️ System Design ### Tech Stack - **Frontend**: React with TypeScript, Vite, Tailwind CSS - **UI Components**: Shadcn UI components with Radix UI primitives - **Backend & Auth**: Supabase (PostgreSQL, Auth, Storage) - **AI Integration**: OpenAI/GROQ API for learning content generation - **State Management**: React Query, Context API - **Routing**: React Router - **Styling**: Tailwind CSS with dark mode support via next-themes ### Core Components - **Learning Paths**: Customizable learning journeys based on user **preferences** - **Roadmap Generator**: AI-powered custom learning plan creation - **Interactive Tutorial System**: Step-by-step learning with code examples - **Multi-language Support**: Full i18n implementation for 4 languages - **AI Assistant**: Contextual help in the user's preferred language ## 🔌 Third-Party Integrati …