Croods

A React + Redux framework for creating CRUDs

• About
• Install
• Usage
• How to contribute
  • Playground

About

Croods is a library that abstracts most of the details (actions, reducers, etc) needed to integrate a REST API with an react/redux application.

More details on our docs.

Install

yarn add croods

Usage

// src/App.js

import React from 'react'

import { createReducer, List } from 'croods'
import { Provider as CroodsProvider } from 'croods'
import { Provider as ReduxProvider } from 'react-redux'

import { createStore, applyMiddleware, combineReducers } from 'redux'
import thunk from 'redux-thunk'

import './App.css'

const rootReducer = combineReducers({ beagle: createReducer('beagle') })
const store = createStore(rootReducer, applyMiddleware(thunk))

export default props => (
  <ReduxProvider store={store}>
    <CroodsProvider baseUrl="https://dog.ceo/api/breed/beagle">
      <List
        name="beagle"
        path="/images"
        parseListResponse={({ message: list }) => ({ list })}
        render={list => (
          <div>
            <h1>Hello Beagles!</h1>
            <ul>
              {list.map((item, index) => (
                <li key={index}>
                  <img src={item} alt="" />
                </li>
              ))}
            </ul>
          </div>
        )}
      />
    </CroodsProvider>
  </ReduxProvider>
)

How to contribute

$ # Fork and clone this project
$ cd croods
$ yarn

Playground:

You can see your changes on croods using the /example inside croods.

First make sure croods is running.

$ cd croods
$ yarn
$ yarn start

Leave it running, then open another terminal and run the example.

$ cd croods/example
$ yarn
$ yarn start

The example will update for every change that you make on croods.

License

MIT © SeasonedSoftware