@findify/react-connect

This is a set of Components and High Order Functions based on Findify Agents which simplifies data manipulations in React.js applications.

Documentation

The full documentation can be found here: https://developers.findify.io/page/findify-react-connect-reference

For release notes, see the CHANGELOG.

Quickstart

In the Browser

To use the SDK in the browser, simply add the following script tag to your HTML pages:

<script src="https://cdn.jsdelivr.net/npm/@findify/[email protected]/lib/index.min.js"></script>

In Node.js

Install the SDK using npm:

$ npm install --save @findify/sdk

or yarn

$ yard add @findify/sdk

Minimal Setup

@findify/react-connect' interface looks similar to react-redux. There are two parts - Providers which automatically creates Agent instance and push it through context to connectors, and the Connectors - Hight Order Functions and who listen to changes, mutating entities and adding helpers to the wrapped component.

import React from "react";
import { render } from "react-dom";
import { SearchProvider, connectItems } from "@findify/react-connect";

const Items = connectItems(({ items }) =>
	items.map(({ item }) =>
  	<div key={item.hashCode()}>{item.get('title'}</div>
  )
)
                                                    
const App = (
  <SearchProvider key='YOUR_API_KEY'>
  	<Items />
  </SearchProvider>
);

render(App, document.getElementById('root'));