Cosmic Watchlist
I built a premium, server-first watchlist for anime, films, TV, and games with shareable filters and smart stats.
- Server-first CRUD via Server Actions with strict Zod validation and Google OAuth.
- Shareable filters via URL params for bookmarks and clean links.
- Smart stats with optional TMDB/OMDb enrichment for recommendations.
- Database-first source of truth with server-rendered pages and minimal client state.
- Revalidation after writes to keep views fresh without heavy client caching.
- Cosmic UI + Radix primitives for consistent, accessible UI patterns.
Tags
Next.jsTypeScriptDrizzlePostgreSQLAuth.js
Description
I built a server-first watchlist designed to stay fast even with messy metadata and heavy filtering. It uses Server Actions with strict Zod validation, keeps views shareable via URL-based filters, and surfaces stats like completion rate and runtime totals. Optional TMDB/OMDb enrichment adds recommendations without turning the core workflow into a cluttered feature pile.
Frontend
- • Next.js 16
- • React 19
- • TypeScript
- • Tailwind CSS
- • @stargazers-stella/cosmic-ui
- • Radix UI
- • framer-motion
Backend
- • Next.js Server Actions
- • Zod validation
- • Auth.js (Google OAuth)
- • TMDB / OMDb APIs
Database
- • PostgreSQL
- • Drizzle ORM
Tools
- • Vercel
- • Vercel Analytics
- • Speed Insights
- • Vitest
Architecture
