🛌 🎣 Rest hooks
Making dynamic sites performant, scalable, simple to build with any API design.
Simple TypeScript definition
class ArticleResource extends Resource {
readonly id: number | null = null;
readonly title: string = '';
readonly body: string = '';
pk() { return this.id; }
static urlRoot = '/articles/';
}One line data hookup
const article = useResource(ArticleResource.singleRequest(), { id });
return (
<>
<h2>{article.title}</h2>
<p>{article.body}</p>
</>
);Mutation
const update = useFetcher(ArticleResource.updateRequest());
return <ArticleForm onSubmit={data => update(data, { id })} />;And subscriptions
const price = useResource(PriceResource.singleRequest(), { symbol });
useSubscription(PriceResource.singleRequest(), { symbol });
return price.value;...all typed ...fast ...and consistent
For the small price of 7kb gziped.
Features
-
Strong Typescript types
-
🛌 React Suspense support -
🎣 Simple declarative API -
💰 Normalized response caching -
💥 Tiny bundle footprint -
🛑 Automatic overfetching elimination -
✨ Optimistic updates - 🧘 Flexible to fit any API design (one size fits all)
-
🌳 Tree-shakable (only use what you need) -
🔁 Subscriptions -
♻️ Optional redux integration -
📙 Storybook mocking -
🚯 Pluggable garbage collection policy
Special thanks
Thanks to @0xcaff, @melissafzhang and @alexiswolfish for their valuable feedback.