Skip to content

Latest commit

 

History

History
54 lines (34 loc) · 1.85 KB

README.md

File metadata and controls

54 lines (34 loc) · 1.85 KB

Overview

From a code challenge:

We want you to develop a small single page app, that shows us all the information related to a character from the Star Wars universe. Basically, the user submits the name of the character he is looking for, in order to see all the relevant information in a dedicated area.

Demo

Live: https://manos-liakos.dev/starwars-autocomplete/

Autosuggest Component Demo

Features

  • Live character search.
  • Character related information displayed in dedicated area, upon selection.
  • Custom debouncing hook to limit requests while typing.
  • Request cancelation to prevent race conditions.
  • Simple caching mechanism using the localStorage API. Each keyword:results pair is stored.
  • Results arrow navigation.

Note: The search button is decorative. Search is performed automatically during typing.

Installation / Usage

Using the development build

  1. Download and install the latest LTS version of Node.js.
  2. Open a terminal in root directory and run npm install, to install all the necessary node modules.
  3. When finished run npm start to start the development server.
  4. Open a browser and visit 'localhost:3000'.

Using the production build

Building a production version

  1. Open a terminal in root directory and run npm run-script build.

Using a local static file server

  1. Once project building is finished, run npm install -g serve to install a local static file server.
  2. Run serve -s build to start the app.
  3. Visit localhost:5000 (see instructions in terminal).

Testing

Important Note: Before you run any tests, make sure the app is running on http://localhost:3000. If the app is not running, follow the steps mentioned in the above section.

To run all test suites, open a terminal in root directory and type npm test.