CineMind — Discover Your Next Favorite Film
Inspiration
I built CineMind to make discovering movies and keeping track of films I want to watch a more enjoyable and organized experience. With so many movies available, finding something interesting and remembering which films I want to watch can be challenging. I wanted to create a single platform where users can explore movies and maintain their own personal watchlists through a clean, intuitive interface.
What I Built
CineMind is a full-stack movie discovery and watchlist web application. It combines a responsive React frontend with an Express.js backend and Supabase for database and authentication services. The application allows users to explore movies, sign in to their accounts, and save movies to a personal watchlist.
How I Built It
I developed the frontend using React and Vite, focusing on a smooth and user-friendly experience. I built REST API endpoints with Node.js and Express to handle movie data, authentication, and watchlist operations. Supabase provides persistent data storage and supports user authentication.
I deployed the frontend on Vercel and the backend on Render, configuring the production API URL and cross-origin resource sharing (CORS) so the two services could communicate correctly.
Challenges I Faced
One of the biggest challenges was making the application work reliably outside my local development environment. I encountered issues with production API URLs, CORS configuration, authentication tokens, and mismatched movie ID fields between the frontend and backend.
Debugging these problems helped me understand how different parts of a full-stack application communicate in production. I learned the importance of validating API requests, handling errors, configuring environment variables correctly, and testing deployed services rather than relying only on local development.
What I Learned
Building CineMind strengthened my understanding of full-stack development, REST APIs, database integration, authentication, and cloud deployment. I also learned how small inconsistencies in request payloads or environment configuration can break otherwise functional features.
Most importantly, this project taught me to approach problems systematically: inspect network requests, read server responses, identify the root cause, and test the fix end to end.
What's Next
I plan to continue improving CineMind's movie discovery experience, refine its interface, and explore features such as personalized recommendations and more advanced filtering. My goal is to make finding the next great movie feel effortless.
Built With
- css
- express.js
- git
- html
- javascript
- node.js
- postgresql
- react
- render
- rest-api
- supabase
- vercel
- vite
Log in or sign up for Devpost to join the conversation.