A Duolingo-style mobile-first web app that guides new Muslim converts through their first 40 days after taking shahada.

• 🎯 Daily Lessons - Bite-sized 5-10 minute lessons
• 🔥 Streak Tracking - Build consistency with daily streaks
• ✨ XP System - Gamified learning with experience points
• 🎓 Badges - Unlock achievements as you progress
• 💬 AI Companion - Supportive chat companion for questions and guidance
• 🎉 Graduation - Celebrate completing your 40-day journey

• Framework: Next.js 14 (App Router)
• Styling: Tailwind CSS
• Animations: Framer Motion
• State: Zustand
• AI: Gemini API (Google)
• Database: LocalStorage (Supabase integration ready)

1. Install dependencies:

   npm install

2. Set up environment variables:

   cp .env.example .env.local

   Add your Gemini API key to .env.local

3. Run the development server:

   npm run dev

4. Open http://localhost:3000 in your browser

/app
  /page.tsx              # Welcome screen
  /home/page.tsx         # Home screen with journey path
  /lesson/[day]/page.tsx # Lesson screen for each day
  /badges/page.tsx       # Badges screen
  /chat/page.tsx         # AI companion chat
  /graduation/page.tsx   # Graduation ceremony
  /api/chat/route.ts     # Gemini API endpoint
/lib
  /store.ts              # Zustand state management
  /content.ts            # All 40 days of content
  /types.ts              # TypeScript types
/components
  /Confetti.tsx          # Confetti animation
  /XPGain.tsx            # XP gain animation

The app includes 40 days of structured content across 6 units:

1. The Beginning (Days 1-6) - Shahada, prayer basics, wudu
2. Prayer Foundations (Days 7-12) - 5 daily prayers
3. Living Islam (Days 13-18) - Halal/haram, Quran, dhikr, dua
4. Community (Days 19-24) - Mosque, Jummah, family, doubts
5. Deeper Knowledge (Days 25-30) - Prophet, pillars, zakat, fasting, Hajj
6. Ready to Fly (Days 31-40) - Routine, learning, mentorship, graduation

Deploy to Vercel:

https://ummahhacks-five.vercel.app/home