An example Next.js 13 app built using the new router, server components, and all the latest hotness. 🔥
Building a better app for finding great movies has been on my proverbial todo list for awhile. With Next.js 13's paradigm shift, I thought it'd be the perfect time to build it and open source my learnings along the way.
- Advanced movie search by rating, genre, release date, etc
- All movies include YouTube trailers
- Most movies include IMDB rating, RT audience score, and RT critic score
- Supports grid view, list view, and single movie view
- High quality movie database
- New
/appdir - Blurred image placeholders
- Dynamic OG images
- Dark mode
- Hosted on Vercel
- ORM using Prisma + Postgres
- UI components built using Radix UI
- Styled using CSS Modules
- Data fetching using SWR
- Validations using Zod
- Written in TypeScript
- Fully Open Source
Warning This app is a work in progress. I'm building this in public. You can follow the progress on Twitter @transitive_bs.
- Movie database
- Search functionality
- Grid view
- List view
- Single view (original idea for browsing movies using a "next movie" button)
- Dynamic OG images for movies
- Dynamic OG images for genres
- Dark mode
- About page
- Mobile friendly
Post-v1.0:
- Streaming service availability + filters
- Add TV series
- Advanced search by language, country, etc.
- Better movie detail page design
- Person detail page
- User auth and accounts
- Watchlist
- Seen list + user ratings
- Improve text search (fuzzy + weighting)
- Weight single view movie selection by
relevancyScore - Automate scripts to keep movie DB up-to-date
- Improve access to Rotten Tomatoes metadata
- Add top X movies pages
Under the hood, next-movie uses populate-movies to generate it's high quality movie database, featuring:
- ~73k movies (filtered from ~750k TMDB "movies")
- Metadata from TMDB, IMDB, and Rotten Tomatoes
- Automatable pipeline
- Custom post-processing
- Selects the best available YouTube trailer for every movie
- Relevancy scores using a combination of popularity, rating, and release date
- Nuanced foreign movie detection that looks at more than just language/country
- LQIP preview image generation for all movie images
- Basic text index for searching
- Open source using TS + Prisma + Postgres
See the contribution guide and join our amazing list of contributors.
MIT © Travis Fischer
Support my open source work by sponsoring me or following me on twitter
