TMDB Clone

Building TMDB Clone App with React.js + Next.js 13 + TypeScript + Tailwind CSS + React Icons + Vercel Hosting (a mobile-friendly).

Table of contents

• Author
• Demo
• Technologies
• Features
• Related Projects
• Optimizations
• Contributing
• Status
• Inspiration
• Support
• Feedback
• Run Locally
• Environment Variables
• Deployment
• Screenshots

Author

@Saddam Arbaa

Technologies

• React Js
• Next Js
• TypeScript
• Tailwind CSS
• React Icons
• next-themes
• react-youtube
• movie-traile

Demo

LIVE DEMO

Features

• View all movies
• View all netflix main genres
• View top rated movies
• View movie detail
• View movie youtube trailer video
• Debounce search
• Dark mode
• Used TMDb API

Optimizations

• Next Js Image component
• Next Js file-system based routing
• Next Js Server-side rendering
• TypeScript
• Vercel Hosting
• React Server Components

Contributing

Contributions are always welcome!

Support

For support, email saddamarbaas@gmail.com.

Feedback

If you have any feedback, please reach out to me at saddamarbaas@gmail.com

Twitter https://twitter.com/ArbaaSaddam/

Linkedin. https://www.linkedin.com/in/saddamarbaa/

Github https://github.com/saddamarbaa

Instagram https://www.instagram.com/saddam.dev/

Facebook https://www.facebook.com/saddam.arbaa

Run_Locally

Clone the project

  https://github.com/saddamarbaa/imdb-clone-app-next13-typescript

Go to the project directory

  cd imdb-clone-app-next13-typescript

Install dependencies

  npm install

Start the server

  npm start

Environment

• To run this project, you will need TMDB api key

• API_KEY

Status

Project is: in progress I'm working on it in my free time testing new Next 13 features

Inspiration

Build By Saddam Arbaa Project inspired by https://www.themoviedb.org/

Deployment

To deploy this project on vercel Flow the vercel documentation Vercel Documentation

Related_Projects

Netflix Clone App built with React Js + TypeScript + Redux + Stripe Checkout/Payments + Vercel Hosting + Firebase

Github Repo

LIVE DEMO

Hulu Clone App built with React Js, Next Js, TypeScript, Redux, Tailwind CSS, Vercel Hosting, with complete user authentication

Github Repo

LIVE DEMO

Front-End Mentor Rest Countries API Challenge app built with React Js + Next Js + TypeScript + Tailwind CSS + Vercel Hosting

Github Repo

LIVE DEMO

Google Clone App built with React Js + Next Js + TypeScript + Tailwind CSS + Vercel Hosting

Github Repo

LIVE DEMO

Realtor Clone App built with React Js + TypeScript + Tailwind CSS + Vercel Hosting + Firebase

Github Repo

LIVE DEMO

Twitter Clone App built with React Js + Next Js + TypeScript + Tailwind CSS + Vercel Hosting

Github Repo

LIVE DEMO

LinkedIn Clone App built with React Js + TypeScript + Redux + Styled Components + Material-UI + Firebase Realtime Database + Vercel Hosting

Github Repo

LIVE DEMO

Instagram Clone App built with React Js + Next Js + TypeScript + Redux + Tailwind CSS + Heroicons

Github Repo

LIVE DEMO

Facebook Clone App built with React Js + Next Js + TypeScript + Redux + Styled Components

Github Repo

LIVE DEMO

Messenger Clone App built with React Js + Next Js + Redux + Styled Components + Material-UI

Github Repo

LIVE DEMO

Gmail Clone App built with React Js + Next Js + TypeScript + Styled Components + Material-UI + Firebase Realtime Database + Vercel Hosting

Github Repo

LIVE DEMO

Signal Clone App built with React Native + TypeScript + Expo + React Navigation + Firebase Realtime Database + User Authentication + Passwordless Authentication with Magic Link

Github Repo

WhatsApp Clone App built with React Js + React Context API + Styled Components + Material-UI + Firebase Realtime Database + Firebase Hosting

Github Repo

LIVE DEMO

Slack Clone App built with React Js + Next Js + Styled Components + firebase-hooks + Material-UI

Github Repo

LIVE DEMO

Airbnb Clone App built with React Js + Next Js + Redux + Tailwind CSS

Github Repo

LIVE DEMO

Amazon Clone App built with React Js + TypeScript + Redux + Styled Components

Github Repo

LIVE DEMO

Tesla Clone App built with React Js + TypeScript + Redux + Styled Components + Material-UI + Vercel Hosting

Github Repo

LIVE DEMO

Screenshots

Responsive on large screens - Home Page

Dark Mode

Light Mode

Responsive on tablet screens

Responsive on mobile screens

Details Page

About Page

loading UI

Error Handling UI