/movies-search

Fullstack search application built with Reactjs, Nodejs and Elasticsearch

Primary LanguageJavaScript

Movies Search App

Report Bug · Request Feature


Table of Contents
  1. About The Project
  2. Getting Started
  3. Application
  4. Contributing
  5. License

About The Project

Movies Search App

It's a movie search application that indexes data from the IMDB API to a local deployment of Elasticsearch made using Docker containers, all orchestrated by a Nodejs server.

Built With

React.js Tailwindcss Elasticsearch Node.js Express.js IMDb

(back to top)

Getting Started

Follow these steps to get the project locally on your machine.

Prerequisites

  • Docker
  • IMDb API key

Installation

  1. Get a free IMDb API Key here

  2. Clone the repo by running:

    git clone https://github.com/AbdoulBaguiM/movies-search.git
  3. Edit the .env file by filling in your settings (specify the stack version you want to work on, the ELASTIC_PASSWORD and KIBANA_PASSWORD)

  4. Next, open a terminal an run:

    docker-compose up -d

    It may take some time depending on your internet connection as it will pull Elasticsearch and Kibana images from the Docker Hub.

  5. Once the containers are launched, take care of the backend first. Open a new terminal, cd into the backend folder and install the dependencies by running:

    yarn
  6. Rename the .env.example file to .env and fill in the ELASTICSEARCH_CLIENT and ELASTICSEARCH_PASSWORD as well as the port on which the backend server will be deployed and the IMDB API_KEY you got on step (1).

  7. Next, you'll need to copy the certificates generated by the setup service when you launched docker-compose in the backend folder, to ensure a secure connexion between your application and Elasticsearch (this step is crucial). Run the following command in a terminal after filling in the full path to the backend folder:

    docker cp es01:/usr/share/elasticsearch/config/certs/ca/ca.crt YOUR/PATH/TO/BACKEND/FOLDER/certs
  8. Once done, you can run the backend with:

    yarn run dev
  9. Before indexing the data from IMDb, you need to create the movies index in Elasticsearch, so open Kibana in your browser, log in using the password you set in step 3. Open Dev tools > Console and run this command to create the mapping:

PUT movies
{
    "mappings": {
    "properties": {
        "contentRating": {
            "type": "text",
            "fields": {
                "keyword": {
                    "type": "keyword",
                    "ignore_above": 256
                }
            }
        },
        "directors": {
            "type": "text",
            "fields": {
                "keyword": {
                    "type": "keyword",
                    "ignore_above": 256
                }
            }
        },
        "genres": {
            "type": "keyword"
        },
        "imDbRating": {
            "type": "float"
        },
        "imDbRatingCount": {
            "type": "integer"
        },
        "image": {
            "type": "text",
            "fields": {
                "keyword": {
                    "type": "keyword"
                }
            }
        },
        "plot": {
            "type": "text"
        },
        "runtimeMins": {
            "type": "integer"
        },
        "stars": {
            "type": "text",
                "fields": {
                    "keyword": {
                        "type": "keyword"
                    }
            }
        },
        "title": {
            "type": "text",
            "fields": {
                "keyword": {
                    "type": "keyword",
                    "ignore_above": 256
                }
            }
        }
    }
}
  1. We'll also configure a pipeline to ingest our data before indexing so, run the following:
PUT _ingest/pipeline/movies_pipeline
{
  "processors": [
        {
            "remove": {
                "field": [
                    "id",
                    "title",
                    "year",
                    "releaseState",
                    "metacriticRating",
                    "genreList",
                    "directorList",
                    "starList",
                    "runtimeStr"
                ],
                "ignore_missing": true
            }
        },
        {
            "rename": {
                "field": "fullTitle",
                "target_field": "title"
            }
        },
        {
            "trim": {
                "field": "genres",
                "ignore_missing": true
            }
        },
        {
            "split": {
                "field": "genres",
                "separator": ",",
                "ignore_missing": true
            }
        }
    ]
}
  1. Now that every thing is setup, open a new tab in your browser an go to http://localhost:3001/ingest_movies. The data will be collected from IMDb, it will be transformed through the newly created pipeline before being added to our index created in step (9).

  2. You can now open a new terminal in the frontend browser and install the dependeciesby running:

yarn
  1. The application will be available at : http://localhost:3000

Application

demo

(back to top)

Contributing

If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement". Don't forget to give the project a star! Thanks again!

  1. Fork the Project
  2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
  3. Commit your Changes (git commit -m 'Add some AmazingFeature')
  4. Push to the Branch (git push origin feature/AmazingFeature)
  5. Open a Pull Request

license-shield

(back to top)