Creating a Hulu UI clone (with server side rendering)
This project is a small attempt to create some basic UI functionalities of Hulu using Next.js . I have used Next.js, Tailwind and flexbox CSS for this project
The Movie database API has been used to fetch the movies according to their genres or ratings. You will need an API key for that. Just create an account for free using https://www.themoviedb.org/ and create a project, then you will see the key there.
- Clone into a folder
- Open terminal, type "yarn install"
- Create a .env file containing the name API_KEY="" <= your API key inside the quote (keep it without quotes)
- To start project, type "yarn run dev"
- Open localhost:3000 on any browser
If you are more used to npm, then feel free to remove the yarn.lock file from the project.
I plan to add account creation, login/logout etc and also plan to learn how to actually run a movie on a page so that i can extend it to a movie streaming app. Stay tuned.
Following link is where its deployed live now. Feel free to check it out.