Skip to content

kanugoyal/React-Typesense-Movie-App

Repository files navigation

React ElasticSearch InstantSearch

Motivation:

This project was created to learn the fundamental functionalities of Elasticsearch within a React application and specifically explore the real-time search capabilities using react-instantsearch. The primary motivation was to grasp how Elasticsearch performs search operations efficiently and promptly as the user types and to understand the integration process of Elasticsearch in a React environment.

Tech Description:

  • React: A JavaScript library used for building user interfaces. It provides a flexible and efficient way to create interactive components.
  • Elasticsearch: A distributed, RESTful search and analytics engine designed for horizontal scalability, reliability, and real-time search functionality.
  • react-instantsearch: A set of components and helpers to build a search interface with Elasticsearch. It allows for real-time search experiences in React applications by enabling instant updates as users input their queries.

Features:

  • Real-time Search: Utilizes Elasticsearch and react-instantsearch to achieve real-time search results as users type.
  • Responsive Interface: Ensures compatibility across various screen sizes and devices.
  • Simple and Intuitive UI: Provides a user-friendly interface for search functionality.

Usage:

  • Access the application via the provided URL after starting the development server.
  • Input search queries in the designated search bar.
  • Observe the real-time search results updating dynamically as you type.

Available Scripts

In the project directory, you can run:

yarn start

Runs the app in the development mode.
Open http://localhost:3000 to view it in your browser.

The page will reload when you make changes.
You may also see any lint errors in the console.

yarn test

Launches the test runner in the interactive watch mode.
See the section about running tests for more information.