AI Study Assistant
A polished, glassmorphic study suite built with React 19, TypeScript, and Vite. It combines an AI tutor powered by Google's Gemini API with client-side PDF summarization, quizzes, flashcards, a planner, and a Pomodoro timer — all running entirely in the browser as a static site.
🚀 Key Features
- AI Chat — Conversational tutor with multi-thread history and Markdown-rendered replies.
- Explain Topic — Ask about any concept and get a structured, easy-to-read breakdown.
- Quiz Generator — AI-generated multiple-choice quizzes with explanations.
- PDF Summarizer — Parses PDFs entirely client-side with PDF.js, then summarizes with Gemini.
- Flashcards — AI-generated decks plus a spaced "mastered" tracker.
- Study Planner — Task list with day buckets, categories, and priorities.
- Pomodoro Timer — Study/break cycles with daily stats.
- Settings — Theme presets, font size, Gemini API key management, and JSON backup/restore.
🛠️ Tech Stack
- React 19 + TypeScript (strict mode, zero
any)
- Vite 6 for dev server and bundling
- Tailwind CSS v4 (via
@tailwindcss/vite)
- Lucide Icons
- PDF.js (
pdfjs-dist npm package, loaded via ES modules with a Vite-bundled worker) for client-side text extraction
- Google Gemini API (
gemini-2.5-flash), called directly from the browser
This is a fully static frontend application — there is no backend server. It deploys as-is to any static host.
📂 Project Structure
├── index.html # Vite entry HTML
├── src/
│ ├── main.tsx # App bootstrap
│ ├── App.tsx # Root component & state
│ ├── index.css # Tailwind import + global styles
│ ├── vite-env.d.ts # Vite client type reference (asset imports)
│ ├── types/
│ │ ├── index.ts # Shared app domain types & seed data
│ │ └── gemini.ts # Gemini API request/response interfaces
│ ├── components/ # UI components (one per feature/page)
│ └── utils/
│ ├── api.ts # Gemini API client (key from localStorage)
│ ├── pdf.ts # PDF.js (pdfjs-dist) text extraction
│ ├── markdown.ts # Lightweight Markdown → HTML renderer
│ └── errors.ts # Typed unknown-error → message helper
├── vite.config.ts
├── tsconfig.json
└── package.json
⚙️ Setup & Local Development
npm install
npm run dev
Open the local URL Vite prints (typically http://localhost:5173).
Connect the AI Tutor
- Go to Settings in the sidebar.
- Paste a Gemini API key (create one for free at Google AI Studio).
- Save — this unlocks Chat, Explain, Quiz, Summarizer, and Flashcards.
The key is stored only in your browser's localStorage. It is never hardcoded, checked into source, or sent anywhere except Google's Gemini API.
📦 Build & Deploy
npm run build # type-checks and produces a static build in dist/
npm run preview # preview the production build locally
The dist/ folder is a plain static site — deploy it to Vercel, Netlify, GitHub Pages, or any static host with zero extra configuration (both platforms auto-detect the Vite build).
📜 License
Distributed under the MIT License. See LICENSE for details.