react-flowstate icon indicating copy to clipboard operation
react-flowstate copied to clipboard

Fetching and displaying data made easy

react-flowstate

license

useState and useEffect, they're so lame
They're making me mad, I'm gonna change the game
react-flowstate, the library that's gonna make you feel sane
So say goodbye to those two, and let's get this party started!
This is from Google Bard. Don't like it? Send your PR!

Get started | API | Examples

Features

  • Dead simple to use.
  • Automatically manages data lifecycle and display condition.
  • Reloads data on dependency change with debounce support.
  • Supports React Native and TypeScript.

Install

npm install react-flowstate

Quickstart

import {DataLayout} from 'react-flowstate';

const fetchData = () => Math.random();

export default function App() {
  return (
    <DataLayout
      dataSource={fetchData}
      loadingIndicator={<div>Loading ...</div>}
      errorFallback={(err) => <div>{err.message}</div>}
    >
      {({data}) => <div>Your data is here: {data}</div>}
    </DataLayout>
  );
}