Silver Screen

Search Engine for Movies and Television Shows
Explore the docs »

Live Demo · Report Bug · Request Feature

Table of Contents

1. About the Project
   • Overview
   • Built With
2. Getting Started
   • Prerequisites
   • Setup
3. Deploy
   • Vercel
   • Netlify / Firebase etc.
4. Support
5. Licence
6. Acknowledgments

About the Project

Overview

A movie-search engine that lets users browse a wide variety of films and television shows and helps get information regarding them. It makes use of TMDB API for all films' related metadata.

Fully Responsive

(back to top)

Built With

• 
• 
• 
• 
• 

(back to top)

Getting Started

Prerequisites

• IDE or code editor of your choice
• Node (v16.13.0 or higher)
• Yarn (recommended) or NPM

(back to top)

Setup

Here is a run through of how to set up the application:

• Step 1 : Clone this repository using git clone https://github.com/nilotpaldhar/silverscreen.git or downloading a ZIP file of the code.
• Step 2 : The repository, if downloaded as a .zip file will need to be extracted to your preferred location and opened.
• Step 3 : Go to the project root directory and install the dependencies using: yarn install or npm install
• Step 4 : Add Envirnoment Variables to your project:
  • Create a new copy of .env.sample file in your root directory and rename it to .env.local
  • Go to the the movie database (TMDB) API WEBSITE, sign up for a free account and generate an API key.
  • On .env.local file add your API key like TMDB_ACCESS_TOKEN='<your-api-key>'
• Step 5 : On your terminal run yarn dev or npm run dev command to open a local development server on localhost:3000

(back to top)

Deploy

Vercel

The easiest way to deploy the application is to use the Vercel Platform from the creators of Next.js. Check out the Next.js deployment documentation for more details.

Netlify / Firebase etc.

As the application uses next/image for image optimization, additional configurations have to be made to deploy on other popular static hosting websites like Netlify. Alternatively, replace the next/image component with a standard <img> tag. See next/image documentation for more details.

The API routes used in the autocomplete search component cannot be used in a static site export. You will need to use a form API endpoint provider and substitute the route in the search component accordingly. Other hosting platforms such as Netlify also offer alternative solutions - please refer to their docs for more information.

(back to top)

Support

Like 💖 this project? Support this effort by giving a star on GitHub, sharing it in your own blog, and giving a shoutout on Twitter

(back to top)

Licence

You are welcome to use this application however you wish under the MIT license.

(back to top)

Acknowledgments

• The Movie Database
• Vercel
• Figma
• React Icons
• Choose an Open Source License
• Img Shields
• Best README Template

(back to top)