🎓 Learn with AI - Tutorly

AI-Powered Learning Companion Platform - Transform your learning experience with personalized AI tutors for various subjects.

🌟 Features

🤖 AI-Powered Learning

• Voice Interactions: Real-time conversations with AI tutors using VAPI
• Multiple Subjects: Mathematics, Economics, Coding, Science, History, Language
• Personalized Learning: Adaptive AI responses based on your learning style
• Session History: Track your learning progress over time

📚 Learning Management

• Custom Companions: Create personalized AI tutors for specific topics
• Session Tracking: Monitor learning time and progress
• Transcript Downloads: Export learning sessions as professional PDFs
• Bookmarking: Save favorite learning companions

🎯 User Experience

• Responsive Design: Optimized for desktop, tablet, and mobile
• Real-time Feedback: Live transcription during voice sessions
• Progress Analytics: Detailed learning journey tracking
• Plan-based Features: Tiered access to premium functionalities

🚀 Tech Stack

Frontend

• Next.js 15.3.4 - React framework with App Router
• TypeScript - Type-safe development
• Tailwind CSS - Utility-first styling
• React Hooks - Modern state management
• Lottie React - Animated interactions

Backend & Services

• Supabase - Database and authentication backend
• Clerk - User authentication and management
• VAPI - AI-powered voice interactions
• Sentry - Error monitoring and performance tracking

Development Tools

• ESLint - Code linting
• PostCSS - CSS processing
• Zod - Schema validation
• React Hook Form - Form management

🛠️ Installation

Prerequisites

• Node.js 18+
• npm or yarn
• Git

1. Clone the Repository

git clone https://github.com/Sebastian-Rothe/learn-with-ai.git
cd learn-with-ai

2. Install Dependencies

npm install

3. Environment Setup

Create a .env.local file in the root directory:

# Clerk Authentication
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=your_clerk_publishable_key
CLERK_SECRET_KEY=your_clerk_secret_key

# Clerk Custom Routes
NEXT_PUBLIC_CLERK_SIGN_IN_URL=/sign-in
NEXT_PUBLIC_CLERK_AFTER_SIGN_IN_FALLBACK_REDIRECT_URL=/
NEXT_PUBLIC_CLERK_AFTER_SIGN_UP_FALLBACK_REDIRECT_URL=/

# Supabase Database
NEXT_PUBLIC_SUPABASE_URL=your_supabase_url
NEXT_PUBLIC_SUPABASE_ANON_KEY=your_supabase_anon_key

# VAPI Voice AI
NEXT_PUBLIC_VAPI_WEB_TOKEN=your_vapi_token

# Sentry (Optional)
SENTRY_AUTH_TOKEN=your_sentry_token

4. Run Development Server

npm run dev

Open http://localhost:3000 to view the application.

📁 Project Structure

learn-with-ai/
├── app/                    # Next.js App Router pages
│   ├── companions/         # AI companion management
│   ├── my-journey/         # Learning progress tracking
│   ├── datenschutz/        # Privacy policy (German)
│   ├── impressum/          # Legal notice (German)
│   └── api/               # API routes
├── components/             # Reusable React components
│   ├── ui/                # UI component library
│   └── ...                # Feature components
├── lib/                   # Utility libraries
│   ├── actions/           # Server actions
│   └── utils/             # Helper functions
├── types/                 # TypeScript type definitions
├── constants/             # Application constants
└── public/                # Static assets

🔧 Available Scripts

# Development
npm run dev          # Start development server
npm run build        # Build for production
npm run start        # Start production server
npm run lint         # Run ESLint

# Deployment
vercel deploy        # Deploy to Vercel

🌐 Deployment

Vercel (Recommended)

1. Connect your GitHub repository to Vercel
2. Configure environment variables in Vercel dashboard
3. Deploy automatically on every push

Environment Variables for Production

Ensure all environment variables from .env.local are set in your deployment platform.

🔐 Authentication & Security

• Clerk Integration: Secure user authentication with social logins
• Protected Routes: Middleware-based route protection
• Data Encryption: Secure API communication
• Privacy Compliance: GDPR-compliant data handling

📱 Features by Plan

Free Plan

• ✅ Basic AI companions
• ✅ Limited voice sessions
• ✅ Basic progress tracking

Core Plan

• ✅ Extended voice sessions
• ✅ Transcript downloads
• ✅ Advanced progress analytics

Pro Plan

• ✅ Unlimited voice sessions
• ✅ Premium transcript features
• ✅ Priority support
• ✅ Advanced customization

🤝 Contributing

1. Fork the repository
2. Create a feature branch (git checkout -b feature/amazing-feature)
3. Commit changes (git commit -m 'Add amazing feature')
4. Push to branch (git push origin feature/amazing-feature)
5. Open a Pull Request

📄 License

This project is licensed under the MIT License - see the LICENSE file for details.

🛡️ Privacy & Legal

• Privacy Policy: /datenschutz (German)
• Legal Notice: /impressum (German)
• GDPR Compliant: Full data protection compliance

📞 Support

• Email: mail@sebastian-rothe.com
• GitHub Issues: Report bugs or request features

🙏 Acknowledgments

• Next.js Team - Amazing React framework
• Vercel - Deployment platform
• Clerk - Authentication service
• Supabase - Backend infrastructure
• VAPI - Voice AI technology

---

Made with ❤️ by Sebastian Rothe