Skip to content
🎣 Declarative data fetching for React
Branch: next
Clone or download

Latest commit

Fetching latest commit…
Cannot retrieve the latest commit at this time.


Type Name Latest commit message Commit time
Failed to load latest commit information.
docs chore(*): publish v1.0.0-beta.1 Sep 27, 2018
scripts feat(*): switch to Babel 7️⃣ Oct 5, 2018
.gitignore feat(FetchManager): initial implementation 🙌 Oct 6, 2018

Declarative data fetching for React 🎣

build: CircleCI coverage: Coveralls version: next gzip size code style module formats: umd, cjs, esm

react-data-fetching provides a very intuitive way to perform any REST API call without hassle, through a single React component. It also helps you take care of timeouts, loading states, errors handling, data saving, uploading/downloading progress, etc. Fetching data while letting the user know what's going on has never been that easy!

The package is quite lightweight (~7 kB gzipped) and has been built from the ground up with universal apps in mind: you can use it wherever React is rendering - meaning it works seamlessly with React (web) & React Native!


Using Yarn:

$ yarn add react-data-fetching@next

Then, use it as you would with anything else:

// using ES6 modules
import { Fetch } from 'react-data-fetching'

// using CommonJS modules
var Fetch = require('react-data-fetching').Fetch

The UMD build is also available on unpkg:

<script src=""></script>

You can find the library on window.ReactDataFetching.


The following illustrates the simplest way to use react-data-fetching:

import React, { Component } from 'react'
import { Fetch } from 'react-data-fetching'

import { Loader } from './components'

export default class App extends Component {
  render() {
    return (
        loader={<Loader />} // Replace this with your lovely handcrafted loader
        {({ data }) => (

The package gives access to <Fetch>, <FetchProvider> and requestToApi(). To have an in-depth explanation of how to use them, how they work and even more, head to this post: Introducing React Data Fetching 🎣.


The documentation is available here:


Want to submit a PR but don't know where to start? Here is a list of features you could consider! This might change in the future as the API is far from being complete.

  • Add compatibility to React 16.3.0+ lifecycles ⚛️
  • Implement React 16.3.0+ new context API ⚛️
  • Add an /examples folder for newcomers & contributors 📂
  • Add the ability to run multiple fetches serially or in parallel
  • Implement a caching system (through React's Suspense?) 📥
  • What else?


react-data-fetching is currently developed and maintained by yours truly, @Charles_Mangwa. Feel free to get in touch if you want to contribute!

You can’t perform that action at this time.