Images
MovieWatch is a personalized movie-tracking app designed to make it easy to remember and recommend movies you’ve seen. It allows you to log movies you've watched, rate them, and keep a record, so you don’t have to rely on memory alone. It’s perfect for film enthusiasts who often get asked for recommendations, or anyone who simply wants a convenient way to keep track of their favorite movies.
This was actually a passion project i had wanted to do for quite some time due to the constant asking of movie or series recommendations from my friends. At teh exact moments, i knew i had watched so many sjows since i was 5 but i just couldn't remember any, and to make it worse, somtimes its hard for me to identify the genres so even them telling me wouldn't help, like is the Avengers SCI-FI is it Action is it Fiction is it all?? It was a simple project but brought me so much joy to create.
Instead of trying to recall every film you’ve seen, MovieWatch organizes them all in one place, making sharing recommendations with friends easy and effortless.
Programming Languages: JavaScript, HTML/CSS.
Frameworks & Libraries: Express.js, Bootstrap, EJS.
Database: PostgreSQL
API: Spoonacular API (for recipe data), MapLibre(for Map and geolocation).
Version Control: Git, GitHub.
Design: Figma (for UI design).
Testing: Postman (for API testing), Google lighthouse for performance, accessibility, best practices and SEO testing.
Deployment: Vercel.
Database Design and Management.
API Integration and Management.
Server-Side Development.
Template Engine Utilization.
Responsive Design with Bootstrap.
Data Handling and Processing.
CRUD Operations.
Project deployment.
Navigating the through the API - The TMDB API was not as straight forward as the Spoonacular API so finding the right endpoints for my exact need was quite tricky, most of the time i resourted to googling to find the end point as digging through the documentation was sometimes leading me to dead-ends.
Rendering of the genres - Genres from the API were being displayed as IDs and not names so that became a little tricky to navigate because displaying the genre names was an integral part of the application but later on I found out that they actually had an endpoint for genres so that made things way easier because all i'd have to do was loop through and map an ID to its genre as then dispaly the result.
Slow loading after deployment - Similiarly to GreenBite, MovieWarch was working pretty fast localy but after pushing it to the cloud, ofcourse due to things such as network latency and resouce allocation, it experiencee some delay. I decided to use Google lighthouse to test out my application's different pages and some of the things i did to increase the speed were: