Interact

Declarative

The days of communicating with your data store using an imperative API are over. Simply declare your data requirements and let Interact fetch and mutate your data when needed.

Colocation

Queries live next to the views that rely on them, so you can easily reason about your app. No more complex state management systems and data flow.

REST

Plug it in and start communicating immediately with your existing REST API or other 3rd party APIs. No specialized server-side architechture needed.

Basic Example

import React, { Component } from 'react'
import { createContainer } from 'react-interact'

class TodoList extends Component {

  render() {
    return <div>
      {this.props.todos.map(todo => {
        return `${todo.title}, `
      })}
    </div>
  },
  
}

export default createContainer(TodoList, () => ({
  todos: '/api/v1/todos',
}))

Network request

GET /api/v1/todos

Response

[
  {id: 1, title: 'Laundry'},
  {id: 2, title: 'Weights'},
  {id: 3, title: 'Stroke the cat'},
]

Result

Laundry, Weights, Stroke the cat,