TMDB Autocomplete

---

TMDB Autocomplete is a React component that provides a dropdown list of suggestions based on the user's input.

Table of Contents

1. About The Project
   • Built With
2. Getting Started
   • Prerequisites
   • Installation
3. Usage
4. Design Decision
5. Deployment
Contributor

About The Project

TMDB Autocomplete is a React component that provides a dropdown list of suggestions based on the user's input. The component is built using React and Typescript and is designed to be used as a controlled component. We'll be using the TMDB API to fetch movie suggestions based on the user's input.

Features:

• 🔍 Autocomplete suggestions based on user input from the TMDB API
• 🎬 List of suggestions with movie poster, title, and release date
• 📝 Controlled component
• 📱 Responsive design
• 🎨 Customizable styles
• 📦 Built with React and Typescript
• 🚀 Optimized for performance
• 📚 Well-documented code
• 📝 Linted code using ESLint and Prettier

Built With

Getting Started

To get a local copy up and running follow these simple steps.

Prerequisites

• Node.js
• Yarn

Installation

1. Download the repository shared with you on email

2. Install NPM packages

   yarn install

3. Make sure the .env file that has been shared with you is available in the root directory with the following environment variables:

   API_KEY=YOUR_TMDB_API_KEY
   API_URL=https://api.themoviedb.org/3

Usage

Run the development server:

yarn dev

Open http://localhost:3000 with your browser to see the result.

To run the deployment build:

yarn build
yarn preview

Linting

I am using ESLint, Typescript and Prettier to lint the code. The code is linted on every commit using husky and lint-staged.

Contributor

• Shettayyy