Introducing React Elasticsearch

[ERR!]
authored by Raphaël Huchet 7/24/2019 7:28:00 PM
JavaScript React reactjs React.js ElasticSearch

React Elasticsearch is a UI components library, created in order to be expressive, lightweight and customizable. It just has been released and is used by the french Ministry of Culture for its Cultural Heritage Open Platform.

  • 🏝 Released under MIT licence.
  • 👩‍🎨 Each component is built with React and is customizable. Not too much extra features nor magic.
  • 💅 It comes with no style so it's the developers responsibility to implement their own.
  • 🐿 Only 35.32KB gzipped for the whole lib, compatible with old browsers: >0.03% usage.
  • 🔮 No legacy: created in 2019, with hooks.

Documentation: https://react-elasticsearch.raph.site/ (including live demo, getting started and the history behind this library)

Repository: https://github.com/betagouv/react-elasticsearch



<Elasticsearch url="http://example.org/search">
  <SearchBox id="mainSearch" />
  <Facet id="actors" fields={["actors"]} />
  <Facet id="releasedYear" fields={["releasedYear"]} />
  <Results
    id="results"
    items={data =>
      // Map on result hits and display whatever you want.
      data.map(item => <MyCardItem key={item._id} source={item._source} />)
    }
  />
</Elasticsearch>
Raphaël Huchet

About the Author

🍵 Stodgy mixture of Rust, Laravel, PostgreSQL, procedural generation, music and more. 👨‍🌾 CTO here and there
0 comments