Movie Database Project

A collaborative project featuring a comprehensive movie database using modern web technologies.

The Movie Database Project is a collaborative web application designed to offer users a seamless experience in browsing, searching, and discovering movies. The project was built using the Next.js Pages Router, a powerful React-based framework that allowed us to create a highly optimized and fast-loading interface for movie lovers. By leveraging the capabilities of Supabase as the backend, we were able to manage a robust and scalable database for storing movie information, user reviews, and more.

Tech Stack

  • Next.js
  • Sass
  • Supabase
  • Next Auth

Collaboration

This project was developed as part of a collaboration with three other talented individuals from BCIT. Each team member brought a unique set of skills to the table, contributing to various aspects of the project:

  • Jalen Cameron: Frontend Design
  • Danial Daneshfar: Front/Backend Development
  • Riley Leclaire: UI/UX Designer

The collaborative nature of the project enabled us to divide the workload efficiently, ensuring that each area—from backend logic to front-end design—was handled with care and expertise. Regular stand-ups and online meetings helped us stay aligned and tackle challenges together.

Features

  • Comprehensive Movie Search: Users can search for movies based on titles, genres, release dates, and ratings.
  • Authentication and User Accounts: Powered by Next Auth, users can create accounts, log in, and save their favorite movies.
  • Real-Time Database Updates: Supabase's real-time capabilities keep user data and movie reviews updated instantly.
  • Responsive Design: Developed with Sass, the user interface is fully responsive, offering a great experience across devices.

Challenges and Solutions

Developing the Movie Database Project presented several interesting challenges:

  • Data Management with Supabase: Managing and structuring a database for thousands of movies required careful planning. We utilized Supabase's scalability and real-time features to keep data consistent and accessible. By designing efficient SQL queries and indexes, we optimized data retrieval times.
  • Authentication Integration: Integrating Next Auth with various providers was complex. We addressed this by utilizing OAuth flows and customizing authentication logic to fit our needs, ensuring user data remained secure while providing a smooth login experience.
  • Collaboration Between Team Members: Coordinating efforts across four team members required strong communication. To streamline our workflow, we utilized tools like Git for version control and Trello for task management, ensuring everyone was on the same page.
  • UI/UX Consistency: Ensuring a consistent look and feel across different parts of the application was challenging due to the involvement of multiple developers. Using Scss with a shared design system helped us maintain uniformity in components and styling.

Project Gallery

Homepage of Movie Database ProjectMovie details pageUser authentication screen

Testimonials

"Working on this project was an amazing experience. The collaboration and use of cutting-edge tools made it truly unique."

- Danial Daneshfar

"The integration of Supabase with Next.js was seamless and made the database management a breeze."

- Jalen Cameron

Conclusion

The Movie Database Project was an incredible opportunity to work with a talented team and leverage some of the best tools available in modern web development. Using Next.js allowed us to build a fast and responsive application, while Supabase provided a powerful backend to manage our data efficiently. The collaborative nature of the project fostered creativity and problem-solving, and ultimately led to a product we are all proud of.

This project not only expanded my technical skills but also reinforced the importance of effective teamwork and communication. It was a rewarding experience that prepared me for future collaborative endeavors in the web development industry.