Inspiration

I wanted to solve a simple problem: having too many movies and games I want to experience, but not having one place to organize everything. When a backlog gets too big, even choosing what to watch or play can become difficult.

That inspired me to build NextUp — a unified media backlog and decision hub for keeping track of entertainment and deciding what to experience next.

What it does

NextUp brings movies, TV series, anime, documentaries, and video games into one place.

Users can search and explore media, add titles to their backlog, track their progress, rate what they have experienced, and view their activity history.

The main feature is Pick My Next, which helps with decision paralysis. Users can filter their choices based on media type, mood, genre, and available time, or simply let NextUp randomly choose something from their backlog.

NextUp also supports guest mode with local storage and account-based cloud synchronization.

How I built it

I built NextUp using React, TypeScript, Vite, and Tailwind CSS, with Motion for animations and Lucide React for icons.

I integrated external media databases to retrieve information such as titles, artwork, ratings, release dates, genres, platforms, and other metadata.

For persistence, NextUp uses Firebase Authentication and Firestore for account-based cloud storage, while local storage provides a fast offline experience for guests.

Challenges I ran into

One of the biggest challenges was bringing different types of entertainment into one consistent experience. Movies, TV series, and games have different metadata and progress systems, so I needed to create a structure that could handle them while keeping each media type useful and distinct.

Another challenge was making Pick My Next more useful than simply choosing a random title. I designed it around factors such as available time, mood, genre, and media type so that the result feels more relevant to the user.

Accomplishments that I'm proud of

I'm proud of turning a simple idea into a complete working product with dedicated Movies, Games, Activity, and Profile experiences.

I'm especially happy with the Pick My Next feature because it addresses the actual problem behind the project: sometimes having too many choices makes it harder to choose anything at all.

I also wanted NextUp to be useful without forcing users to create an account immediately, which is why I included guest mode and local persistence alongside cloud synchronization.

What I learned

Building NextUp helped me improve my understanding of React, TypeScript, state management, API integration, Firebase, persistent data, reusable components, responsive design, and UI/UX.

I also learned that building a good product isn't just about adding features. Each feature should solve a real problem and work together as part of a simple user experience.

What's next for NextUp

I would like to continue improving NextUp with more personalized recommendations, richer statistics, additional media sources, improved streaming information, and more ways for users to organize and discover their entertainment.

Built With

  • firebase-authentication
  • firestore
  • igdb
  • lucide
  • mobygames
  • motion
  • omdb-api
  • react
  • tailwindcss
  • typescript
  • vite
Share this project:

Updates

Submission history