1. About The Project
   • Built With
2. Demo
3. Usage
   • Connecting/Disconnecting Your Google Calendar
   • Searching and Adding a TV Series
   • Searching and Adding a Movie
   • Delete Multiple Reminders from Watchlist
   • Mobile Design
4. Roadmap
5. License
6. Contact
7. Acknowledgments

• ReactJS - A JavaScript library for building user interfaces
• Create React App - Create React apps with no build configuration.
• Express.js - Fast, unopinionated, minimalist web framework for node.
• FullCalendar - A full-sized drag & drop JavaScript event calendar
• Google Calendar API - Integrate your app with Google Calendar, creating new ways for you to engage your users.
• TheMovieDatabaseAPI - Millions of movies, TV shows and people to discover.
• Mongoose - An Object Data Modeling (ODM) library for MongoDB and Node.js.
• Bootstrap - Extensive list of components and Bundled Javascript plugins.
• Railway - Infrastructure platform where you can provision infrastructure, develop with that infrastructure locally, and then deploy to the cloud.

(back to top)

Live demo: HERE

*Note: Pending Google app verification

(back to top)

(back to top)

• Search The Movie Database API for tv shows or movies by title
• Display results as a collection of Bootstrap 5 cards
• Filters out cancelled/released content from results
• Selecting a card opens a modal with more detailed info and option to add
• Selectively add episodes to the watchlist or add all upcoming
• Only adds future release dates to calendar
• Authenticate with Google OAuth2 using @react-oauth and Google API Node Client
• Adds user token database on login and uses cookies to save session state
• Deletes user from the database and revokes tokens onlogout
• Displays the user's profile photo, name, email, and link to Google Calendar in a Bootstrap offcanvas component
• Creates a secondary calendar called 'tv-movie' in the user's Google Calendar or finds one if it exists
• Display the user's Google Calendar watchlist as a FullCalendar list (monthly view)
• Select multiple events to delete from the watchlist
• Responsive mobile design using Bootstrap 5 breakpoints

• Deploy a live demo
• Apply for Google app verification
• Fix modal bugs
• Implement React Router 6
• Implement useReducer or useContext
• Optimize rendering and remove unnecessary
• Component testing

(back to top)

Images from Undraw

Google Button CSS from @google-react-login

Loading spinner from Contact Mentor

Animated scroll icon from Unused CSS

(back to top)

Colene Encarnado

Email: [email protected]

(back to top)

Distributed under the MIT © License. See LICENSE.txt for more information.

(back to top)