react-instantsearch-hooks-web

Table of Contents generated with DocToc

• react-instantsearch-hooks-web

- Why - Installation - Getting started - Documentation - Playground - Contributing - License
React InstantSearch Hooks Web is an open-source React library that lets you create an instant search result experience using Algoliaalgolia-website’s search API. It is part of the InstantSearch family:
React InstantSearch | InstantSearch.jsinstantsearch.js-github | Angular InstantSearchinstantsearch-angular-github | Vue InstantSearchinstantsearch-vue-github | InstantSearch Androidinstantsearch-android-github | InstantSearch iOSinstantsearch-ios-github

Why

You should be using React InstantSearch Hooks Web if you want to:

• Design search experiences with best practices
• Customize your components at will
• Follow React principles

Note: If you are working with React Native, or otherwise do not use the DOM, check out react-instantsearch-hooks instead.

Installation

React InstantSearch is available on the npm registry. It relies on algoliasearch to communicate with Algolia APIs.

yarn add algoliasearch react-instantsearch-hooks-web
# or
npm install algoliasearch react-instantsearch-hooks-web

Getting started

Using React InstantSearch Hooks Web is as simple as adding these components to your app:

import React from 'react';
import ReactDOM from 'react-dom';
import algoliasearch from 'algoliasearch/lite';
import { InstantSearch, SearchBox, Hits } from 'react-instantsearch-hooks-web';

const searchClient = algoliasearch(
  'latency',
  '6be0576ff61c053d5f9a3225e2a90f76'
);

const App = () => (
  <InstantSearch
    indexName="bestbuy"
    searchClient={searchClient}
  >
    <SearchBox />
    <Hits />
  </InstantSearch>
);

<img alt="Edit on CodeSandbox" src="https://codesandbox.io/static/img/play-codesandbox.svg">

To learn more about the library, follow the getting started guidedoc-getting-started.

Documentation

The documentation is available on algolia.com/docdoc.

Playground

You can get to know React InstantSearch on this playgrounddoc-playground.
Start by adding componentsdoc-getting-started and tweaking the display. Once you get more familiar with the library, you can learn more advanced concepts in our guidesdoc-guides.

Contributing

We welcome all contributors, from casual to regular 💙

• Bug report. Is something not working as expected? Send a bug reportcontributing-bugreport.
• Feature request. Would you like to add something to the library? Send a feature requestcontributing-featurerequest.
• Documentation. Did you find a typo in the doc? Open an issuecontributing-newissue and we'll take care of it.
• Development. If you don't know where to start, you can check the open issues that are tagged easycontributing-label-easy, the bugscontributing-label-bug or chorescontributing-label-chore.

To start contributing to code, you need to:

1. Fork the project
2. Clone the repository
3. Install the dependencies: yarn

Please read our contribution process to learn more.

License

React InstantSearch Hooks is MIT licensed.