mdabbas110 / netflix-gemini

A project build on React.js has AI integration Gemini that give the best movies result, Redux store to manage state, Firebase-auth for accounts

Netflix Gpt site

• created react app using Vite

• Integrated tailwind Css for styling and fast

Features in this app

• login/signup page

• Routing

  • Signup form
  • login redirect to browse page
  • Form validation
  • useRef for inputs
  • firebase setup
  • create signup new account
  • implement signin user api
  • created redux store

-Progress on project

• bug fix of signup user display name and profile picture update

• redirect the user to /login if trying to browse form the url and visa versa

• useEffect cleanup unsubscribe to the onAuthChange

• added constant file and added the strings there and exports

• got the api key frm tmdb and made the call to get the data out of it

• created slice for the movie trailer

• updated the store with the data

• embaded the YT vid and autoplay and mute

• layout for the main and secondary container

• Feature:- Multi language feature for the search

• Gemini search page for the Ai Recommendation

• Browse landing page (after authentication )

  • Navbar
  • main movie
    • trailer background
    • title description
    • Movie suggestion
    • vertical scroll

• Netflix Gpt page

  • search bar AI movie suggestion