Lightning-fast search for React and React Native apps

React-InstantSearch makes it easy to design the perfect search experience using prepackaged search components or creating your own!

Get started with React Get started with React-Native
Demo vue-instantsearch

Built with design in mind

InstantSearch components

Our search widgets feature slick design by default and benefit from our experience building thousands of search interfaces.

Discover widgets

Intuitive API

We crunched feedback from hundreds of users of instantsearch.js into building React InstantSearch API.

Read the guide

const SearchBox =connectSearchBox(
  ({query, refine}) =>
    <div className="searchbox-container">
      <div className="input-group">
        <input type="text"
               value={query}
               onChange={e => refine(e.target.value)}
               className="form-control"/>

        <span className="input-group-btn">
          <button className="btn btn-default">
          <i className="fa fa-search"></i>
          </button>
        </span>
      </div>
    </div>
);

const RefinementListLinks = connectRefinementList(({items, refine, createURL}) => {
  const itemComponents = items.map(item =>
    <div className={item.isRefined ? ' active' : ''} key={item.label}>
      <a className="item" href={createURL(item.value)} onClick={e => {
        e.preventDefault();
        refine(item.value);
      }}>
        <span> {item.label}</span>
        <span className="badge pull-right">{item.count}</span>
      </a>
    </div>
  );
  • react-native
  • react-ui*
  • react-router

React-community ready

Connectors provide a way to plug any existing code or React library to React InstantSearch and Algolia.

Get started