A simple tool for fetching and handling data from an API with React.
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
build
examples
src
tools
unit
.eslintignore
.eslintrc
.gitattributes
.gitignore
.npmignore
.travis.yml
LICENSE
README.md
gulpfile.js
package.json

README.md

react-api

Build Status npm version

A simple tool for fetching and handling data from an API with React

Installation

Installing react-api in your Node project is simple:

$ npm install react-api --save

Usage

At its core, react-api is really just a simple React component. You would treat it as you would any other React component, with a few specific settings to keep in mind while configuring:

  • ref - string - Used to reference the component getting the API response.
  • url - string - The address of where you're getting your API response.
  • callback - function - A function for handling the actual response.

Examples

Here is a basic example of using react-api to get some data of a GitHub user's repositories:

const ReactAPI = require('react-api');

// The address of where to retrieve data
var URL = 'https://api.github.com/users/nickzuber/repos';

const MyAwesomeComponent = React.createClass({

  handleResponse: function(){
    // API response as a JavaScript object:
    console.log(this.refs.github.state.data);
  },

  render: function(){
    return(
      <div>
        <ReactAPI ref='github' url={URL} callback={this.handleResponse} />
      </div>
    );
  }

});

License

MIT

Copyright (c) 2015 Nick Zuber