swapnil233 / filmlist.ca

🍿 LIVE at filmlist.ca. A dynamic website where users can search and find movies/tv shows, and add them to their collections. Created almost entirely using vanilla HTML, CSS & JS. Using Google Firebase as its backend and Axios to get the movie data.

FilmList

The site is live! Check it out at https://filmlist.ca

This is a web app created entirely in vanilla HTML5, CSS3 and JavaScript utilizing ES6 features for the front-end, and Firebase's Auth, Firestore and Storage for the back-end. Movies are fetched using the Open Movie Database (OMD) and Axios, and hosted on Netlify. The website is also secure from unauthorized access, which is done using Firebase security rules.

In this website, users can:

1. Sign up
2. Log in
3. Reset their password
4. Once logged in, update their profile information, including: a. Username b. Biography c. Display Picture
5. Verify their email address
6. Search up movies and TV shows
7. Look up info about the movie/show, such as release date, runtime, ratings, vote count, director(s), actors, and the plot.
8. Create new collections
9. Add movies/shows to their movie collections
10. Delete collections
11. Delete individual movies from collections

Coming Soon:

1. Adding friends and seeing their collections
2. Ability to see a movie's entire information when clicked
3. Renaming Collections
4. Moving movies inside collections
5. See where movie/show is available to steam or buy (e.g., Netflix, Hulu, etc.)

Showcase:

Searching up a Movie:

Adding a Movie to Your Collections:

Your Collections:

Your Profile Settings:

Deleting Your Collections:

Viewing Movie/Show's Information:

Login Page:

Signup Page:

Forgot Password Page: