Jahnavi2001 / my-netflix-gpt

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Netflix GPT

  • Create React App
  • Configured TailwindCSS
  • Header
  • Routing of App
  • Login Form
  • SignUp Form
  • Form Validation
  • useRef Hook (To get Email and Password entered values) (Here we can use useState hook instead of useRef hook also)
  • Firebase Setup
  • Deploying our app to production
  • Create SignUp User Account
  • Implement SignIn User API
  • Created Redux Store with userSlice
  • Implemented Signout Feature
  • Update Profile
  • BugFix: Signup user displayName and profilePicture update
  • BugFix: If the user is not logged in Redirect/Browse to login page and vice-versa
  • Unsubscribed to the onAuthStateChanged callback
  • Add hardcoded values to the constants file
  • Register TMDB API & create an app & 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
  • Embedded 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
  • Found and added TMDB Image CDN URL
  • Made the browse page amazing with Tailwind CSS
  • Created usePopularMovies Custom Hook
  • Created useTopRatedMovies Custom Hook
  • Created useUpcomingMovies Custom Hook
  • GPT Search Page
  • GPT Search Bar
  • (BONUS) Multi-language Feature in our App
  • Get Open AI API Key
  • Gpt Search API Call
  • Fetched gptMovieSuggestions from TMDB
  • Created gptSlice and added data
  • Reused Movie list component to make movie suggestion container
  • Memoization
  • Added .env file
  • Added .env file to gitignore
  • Made our site responsive

Features

  • Sign In/Sign Up
    • Sign In/ Sign Up form
    • Redirect to Browse Page
  • Browser (After Authentication)
    • Header
    • Main Movie
      • Tailer in the Background
      • Title & Description
      • Movie Suggestions
        • MovieLists * N
  • NetflixGPT
    • Search Bar
    • Movie Suggestions

About


Languages

Language:JavaScript 93.8%Language:HTML 6.0%Language:CSS 0.2%