/hotstar-clone

Primary LanguageTypeScript

Hotstar123

This app show movie, and tv show in entertainment, you can check detail for each content, search for content, and save your watchlist movie or tv show. The data is provided by Themoviedb. You can check the deployed app on Hotstar123.

Local Setup

Get Themoviedb API key

To running this web you need to get api key from Themoviedb, this key will be used for fetching data. Go to https://developer.themoviedb.org/ to get your key.

Setup env variable

After you get the key, you need set this key on env variable, create file on project root called ".env.local", and put the key:

NEXT_PUBLIC_MDB_TOKEN={your-key}

Install dependencies

Before you ready to run the web, you need install all required dependencies, use Node.js 18.17 or later. run this command on root of project:

npm run install

Run the web

And thats all, now you ready to run the web, hit this command:

npm run dev

Preview

Home

Desktop Mobile
page1 page2

Watchlist

Desktop Mobile
page3 page4

Search

Desktop Mobile
page5 page6

Movie Detail

Desktop Mobile
page7 page8

Tv Detail

Desktop Mobile
page8 page10

Technologies

This project uses several technologies listed below :

  • NextJs, the React Framework for Production.
  • Typescript, a strict syntactical superset of JavaScript and adds optional static typing to the language.
  • React Context, context lets you “broadcast” such data, and changes to it, to all components below.