NetflixGPT

  • Create React App
  • Configured TailwindCSS
  • Header
  • Login Form
  • Sign Up Form
  • Form validation
  • useRef Hook
  • Firebase Setup
  • Deploying our app to production
  • Create Sign Up user account
  • Implement Sign In user Api
  • Created Redux Store with userSlice
  • Implemented Sign out
  • Update Profile
  • BugFix: Sign up user & displayName update
  • BugFix: if user is not logged in, redirect /browse to login page and vice-versa
  • Unsubscribe to the onAuthStateChanged callback
  • Add hardcoded values to constants file
  • Register for TMDB API and create an app and get access token
  • Get Data from TMDB now playing movies list API
  • Custom hook for Now Playing Movies
  • Create movieSlice
  • Update Store with movies Data
  • Planning for Main Container and secondary container
  • Fetch data for Trailer video
  • Update store with trailer video data
  • Embedder the youtube video and make it autoplay and mute
  • Tailwind classes to make main container look awesome
  • Build Secondary Component
  • Build Movie List
  • build Movie Card
  • TMDB Image CDN URL
  • Made the Browsre page amazing with Tailwind CSS
  • usePopularMovies Custom hook

Features

  • Login/Sign Up
    • Sign In/ Sign Up Form
    • redirect to Browse Page
  • Browse (after authentication)
    • Header
    • Main Movie
      • Trailer in Background
      • Title and description
      • Movie Suggestions
        • Movie Lists * N (Vertical Scrolling)
  • NetflixGPT
    • Search Bar
    • Movie Suggestions