Your ultimate, distraction-free watch companion. Track your anime, TV series, and movies with zero bloat and absolute speed, supercharged by Gemini AI & TMDB.
Most tracking sites are either covered in intrusive ads, feel like spreadsheets from 2012, or take ages to load on mobile. I wanted a modern dashboard that gets out of the way, looks stunning on a desk monitor or phone, and is smart enough to handle massive franchises without manual data entry.
AniTrace integrates the TMDB API for rich metadata and Gemini 2.5 Flash for AI-assisted autocomplete and franchise mapping (automatically discovering prequels, sequels, and spin-offs in a click).
- 🌌 Modern Dark-Mode Dashboard: Clean interface, vibrant gradients, and fluid animations (powered by Framer Motion) that look great on any screen.
- 🧠 AI Autocomplete & Estimation (Optional): Enter a partial title, and let Gemini estimate total seasons, episodes, and generate a brief clean synopsis.
- 🔗 Smart Franchise Mapping: Instantly discovers prequel/sequel relations and lets you connect them to your watchlist.
- ⚡ Realtime Cloud Sync: Powered by Firebase Authentication and Firestore to save your list instantly across all devices.
- 📱 Fully Responsive: Feels like a native app on mobile, tablet, or desktop.
- 🚫 Ad-free & Tracker-free: Just your watch list, your way.
- Frontend: React 18 (TypeScript), Vite, Tailwind CSS, Framer Motion
- UI Components: Shadcn/ui (Radix Primitives)
- Backend: Firebase (Auth, Firestore, Hosting)
- APIs: TMDB API (Base movie/show searches), Google Gemini 2.5 Flash API (Smart predictions & franchise connections)
Get it up and running locally in under 2 minutes:
git clone https://github.com/darvex-0/AniTrace.git
cd AniTracenpm installCopy the example environment file:
cp .env.example .envOpen .env and fill in your keys:
VITE_TMDB_API_KEY=your_tmdb_api_key
VITE_GEMINI_API_KEY=your_gemini_api_keyImportant
- TMDB API Key: Required for basic search and metadata queries. Grab a free API key from your TMDB account settings.
- Gemini API Key: Unlocks AI autocomplete, smart episode/season count estimation, and franchise timeline mapping. Get a key from the Google AI Studio.
How to configure the Gemini API Key:
- Option 1: Directly in the Web App UI (Recommended): You can enter your Gemini API Key directly inside the app by going to the Profile page and scrolling to AI Autocomplete Settings. This saves the key securely inside your browser's local storage (no environment variable setup needed!).
- Option 2: Via Local Environment: You can paste your key in the
.envfile asVITE_GEMINI_API_KEYto load it permanently for local development.
This project uses Firebase. You can replace the default firebase config in src/lib/firebase.ts with your own project credentials.
npm run devOpen http://localhost:5173 in your browser!
AniTrace follows an industry-standard Software Testing Life Cycle (STLC) incorporating Black-Box Testing, White-Box Testing, and Automated E2E Testing.
- 📋 Master Test Plan: High-level test strategy, environments, pass/fail criteria, and risk matrix.
- 📑 Test Case Suites:
- Module 01: Authentication (Boundary Value Analysis, Equivalence Partitioning, Security)
- Module 02: Search & Autocomplete (Edge cases, Debounce timing, API Fallback)
- 🐛 Defect Log & Bug Reports: Real bug reports with standard Severity (S1–S4) & Priority (P1–P3) metrics.
- 🎭 E2E Automation (Playwright): Page Object Model (POM) architecture testing Desktop Chrome and Mobile viewports.
npm test# Run Playwright tests headlessly
npx playwright test
# Run Playwright tests in interactive UI mode
npx playwright test --ui
# View generated HTML test execution report
npx playwright show-reportContributions make the open-source community an amazing place. Any contributions you make are greatly appreciated.
- Fork the Project
- Create your Feature Branch (
git checkout -b feature/AmazingFeature) - Commit your Changes (
git commit -m 'Add some AmazingFeature') - Push to the Branch (
git push origin feature/AmazingFeature) - Open a Pull Request
Distributed under the MIT License. See LICENSE for more information.