You will need the following tools:
- Node.js >= 18
- NPM/Yarn
- Your preferred text editor or IDE (e.g., Visual Studio Code)
- nodemon installed
npm install -g nodemon
- Navigate to the backend directory:
cd backend
- Install the required dependencies:
npm install
- Create a .env file in the root of the backend directory, and add the following:
OMDB_API_KEY=your_omdb_api_key
PORT=your_port_number
UPSTASH_REDIS_REST_URL=your_upstash_redis_rest_url
UPSTASH_REDIS_REST_TOKEN=your_upstash_redis_rest_token
Replace your_omdb_api_key, your_port_number, your_upstash_redis_rest_url, and your_upstash_redis_rest_token with your actual values. Upstash Redis is used for caching the search results. You can get a free Redis instance from Upstash. 4. Start the backend server:
npm run start
- Navigate to the frontend directory:
cd frontend
- Install the required dependencies:
npm install
or
yarn install
- Create a .env file in the root of the frontend directory, and add the following:
VITE_API_URL=your_backend_url
Replace your_backend_url with your actual backend url.
- Start the frontend server:
npm run dev
or
yarn dev
- Open your browser and navigate to http://localhost:5173
- Enter a search term in the search box and results will be shown while you type
- Click on a result to view the details of the movie
- If you click on serch button the results will be displayed in the page paginated
- You can also use the pagination buttons to navigate through the pages
- You can filter the results by type and year
- You can view details of a movie by clicking on the movie title or the view details button