AI-Powered Learning — Transforming prompts into personalized learning experiences with AI.
Learn AI Studio is a full-stack web application that generates complete, structured courses from a single text prompt. A user types a topic — say, "Intro to AI" or "Mastering ASP.NET Core" — and the platform uses Google's Gemini LLM to produce a multi-day course with daily modules, rich content, assessments, reference books, and downloadable PowerPoint presentations. The entire learning journey is tracked per-user with progress indicators and a credit-based usage system.
The project demonstrates end-to-end product thinking: from prompt engineering and AI orchestration on the backend, to authentication, database design, caching, vector search, and a responsive dashboard on the frontend.
| Feature | Description |
|---|---|
| AI Course Generation | Enter any topic and receive a full course outline (3–18 days, 3 modules/day) generated by Gemini. Content is created on-demand when a module is opened. |
| Content Safety Filtering | Every prompt is validated through a safety checker that screens for prohibited or non-educational content before course generation begins. |
| Semantic Course Search | Courses are embedded into Pinecone vector storage using Gemini Embeddings, enabling semantic search — find relevant courses even when exact keywords don't match. |
| Module Caching with Redis | Generated module content is cached in Upstash Redis (10-min TTL) to provide instant page loads on revisits and reduce API calls. |
| Progress Tracking | Each module visit is recorded; a percentage progress bar is displayed on every course card so learners can pick up exactly where they left off. |
| Credit System | Users receive 5 free credits on signup and an additional 5 credits every 7 days. Each course generation costs 1 credit. A credit usage chart visualises spending history. |
| PPT Export | Any module's content can be exported as a .pptx presentation with structured slides, built server-side with pptxgenjs. |
| Course Archiving | Courses can be archived to keep the active list clean, and restored at any time. |
| Authentication | Full auth flow powered by NextAuth v5 — supports Google OAuth and email/password credentials with email verification and password reset via Resend. |
| Responsive Dashboard | Sidebar navigation with Generate Courses, My Courses, Credits, and Archive sections. Global search bar queries Pinecone for instant results. |
┌─────────────────────────────────────────────────────┐
│ Client (Browser) │
│ Next.js 14 App Router · React 18 │
│ Tailwind CSS · Radix UI · Lucide │
└────────────────────────┬────────────────────────────┘
│ HTTPS
┌────────────────────────▼────────────────────────────┐
│ Next.js API Routes (Edge/Node) │
│ ┌──────────┐ ┌────────────┐ ┌───────────────────┐ │
│ │ Auth │ │ Course Gen │ │ Module Content Gen │ │
│ │ (NextAuth│ │ /genrate │ │ /getModule │ │
│ │ v5) │ │ Outline │ │ │ │
│ └──────────┘ └─────┬──────┘ └────────┬──────────┘ │
│ │ │ │
│ ┌──────────────────▼──────────────────▼──────────┐ │
│ │ Gemini API (Google AI) │ │
│ │ gemini-3.1-flash-lite-preview │ │
│ │ gemini-embedding-001 │ │
│ └────────────────────────────────────────────────┘ │
└──┬──────────────┬────────────────┬──────────────────┘
│ │ │
▼ ▼ ▼
┌────────┐ ┌──────────┐ ┌───────────┐
│PostgreSQL│ │ Pinecone │ │ Upstash │
│ (Neon) │ │ (Vectors)│ │ Redis │
│ via │ │ Semantic │ │ (Cache) │
│ Prisma │ │ Search │ │ │
└────────┘ └──────────┘ └───────────┘
| Layer | Technology | Purpose |
|---|---|---|
| Framework | Next.js 14 (App Router) | Full-stack React framework with server components and API routes |
| Language | TypeScript, Python | Type-safe frontend/backend; Python for AI routing server |
| Styling | Tailwind CSS, Radix UI | Utility-first CSS with accessible component primitives |
| Authentication | NextAuth v5 (Auth.js) | Google OAuth + credential-based login, email verification, password reset |
| Database | PostgreSQL (Neon) | Serverless Postgres for users, courses, modules, progress, assessments |
| ORM | Prisma | Type-safe database access with migrations |
| AI / LLM | Google Gemini API | Course outline generation, module content creation, embeddings |
| Vector Store | Pinecone | Stores course embeddings for semantic similarity search |
| Cache | Upstash Redis | Caches generated module content to reduce latency and API costs |
| Resend + React Email | Transactional emails for verification and password reset | |
| Export | pptxgenjs | Server-side PowerPoint generation from module content |
| Deployment | Vercel | Zero-config deployment for the Next.js app |
| Package Manager | Bun | Fast dependency installation and script execution |
The data model is built around six main entities:
- User — Stores profile, credentials, credit balance, and last credit refresh timestamp.
- Course — Each generated course links to a user and holds the full JSON structure (outline, reference books, assessments), along with domain, subtopics, and module creation count.
- Module — Each course is split into modules (3 per day). Modules are generated lazily — content is created on first access.
- Topic — Stores the actual rich HTML content of a module after generation.
- Assessment — Quizzes attached to modules with questions, options, and answers stored as JSON.
- Progress — Tracks per-user, per-module completion status to compute the course progress percentage.
Users register with email/password or sign in with Google. Email verification is sent via Resend. Upon registration, 5 free credits are allocated. Credits auto-refresh (+5) every 7 days.
The user enters a topic in the "Generate Courses" input. The flow:
- Safety Check — The prompt is validated against content policies (no prohibited biology topics, no non-educational queries).
- Outline Generation — Gemini generates a structured JSON course outline including day-by-day modules, assessments, a conclusion, and reference books with links.
- Storage — The outline is saved to PostgreSQL. Module metadata is bulk-inserted. The course name is embedded and stored in Pinecone for future search.
- Credit Deduction — 1 credit is deducted from the user's balance.
- The course page shows a day-by-day sidebar (Day 1, Day 2, …) with a module list on the right.
- Clicking a module triggers on-demand content generation via Gemini. The result is saved to the database and cached in Redis for 10 minutes.
- A "Download PPT" button converts the module into a PowerPoint presentation.
- Progress is tracked automatically — the progress bar on each course card updates as modules are viewed.
The global search bar performs vector similarity search via Pinecone. Users can also browse all their courses in the "Courses" section or find archived courses in "Archive."
The "Credit" page displays a line chart showing credit usage history, letting users understand their consumption patterns.
├── src/
│ ├── app/ # Next.js App Router
│ │ ├── (root)/(routes)/ # Page routes (auth, dashboard, course)
│ │ └── api/ # API endpoints
│ │ ├── genrateOutline/ # Course generation endpoint
│ │ ├── getModule/ # On-demand module content generation
│ │ ├── search/ # Pinecone semantic search
│ │ ├── query/ # AI query proxy to Python server
│ │ ├── ppt/ # PowerPoint export
│ │ ├── getCredit/ # Credit balance retrieval
│ │ └── setArchive/ # Archive/unarchive courses
│ ├── components/ # React components (UI, auth, dashboard, landing)
│ ├── actions/ # Server actions (login, register, reset)
│ ├── lib/ # Utilities (db, redis, pinecone, mail, tokens)
│ ├── schemas/ # Zod validation schemas
│ └── hooks/ # Custom React hooks
├── prisma/
│ └── schema.prisma # Database schema & migrations
├── genAI.ts # Gemini client & Pinecone initialisation
├── promt.ts # Prompt templates (safety, outline, module)
├── auth.config.ts # NextAuth provider configuration
└── auth.ts # NextAuth session & adapter setup
- Node.js ≥ 18 (or Bun)
- Python ≥ 3.9 (for the AI routing server, optional)
- A PostgreSQL database (e.g., Neon)
- API keys for: Google Gemini, Pinecone, Upstash Redis, Resend, Google OAuth
# Clone the repository
git clone https://github.com/jitanshuraut/Learn-AI-Studio.git
cd Learn-AI-Studio
# Install dependencies
npm install
# Set up environment variables
cp .env.example .env
# Fill in your API keys and database URLs
# Run database migrations
npm run database
# Start the development server
npm run dev| Variable | Description |
|---|---|
DATABASE_URL |
PostgreSQL connection string (pooled) |
DIRECT_URL |
PostgreSQL direct connection string |
GENAI |
Google Gemini API key |
PINECONE |
Pinecone API key |
UPSTASH_REDIS_REST_URL |
Upstash Redis REST endpoint |
UPSTASH_REDIS_REST_TOKEN |
Upstash Redis auth token |
GOOGLE_CLIENT_ID |
Google OAuth client ID |
GOOGLE_CLIENT_SECRET |
Google OAuth client secret |
RESEND_API_KEY |
Resend email API key |
AUTH_SECRET |
NextAuth secret for session encryption |
This project is open-source and available under the MIT License.
-
Run the application:
bun dev
-
Open your browser and navigate to:
http://localhost:3000
Follow the instructions on the page to complete the setup.
To contribute via pull request, follow these steps:
- Create an issue describing the feature you want to work on (Bugs, themes, plugins, new features or webhooks).
- Write your code, tests and documentation, and format them with
black - Create a pull request describing your changes
I'd love to hear your feedback! Feel free to log an issue on our GitHub issues page. If your question is more personal, Jitanshu Raut on LinkedIn is always open as well.