Skip to content

Commit 3312cd8

Browse files
committed
improve readme
1 parent 8b3261e commit 3312cd8

File tree

1 file changed

+7
-9
lines changed

1 file changed

+7
-9
lines changed

README.md

Lines changed: 7 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
[![NPM](https://img.shields.io/npm/dm/react-async-hook.svg)](https://www.npmjs.com/package/react-async-hook)
44
[![Build Status](https://travis-ci.com/slorber/react-async-hook.svg?branch=master)](https://travis-ci.com/slorber/react-async-hook)
55

6-
This **tiny** library only **does one small thing**, and **does it well**.
6+
This **tiny** library only **does one thing**, and **does it well**.
77

88
Don't expect it to grow in size, it is **feature complete**:
99

@@ -49,11 +49,9 @@ Don't expect it to grow in size, it is **feature complete**:
4949
- SSR
5050
- router integration for render-as-you-fetch pattern
5151

52-
You can indeed build on top of this little lib to provide more advanced features, if you like composition, that is encouraged in the React ecosystem.
52+
You can build on top of this little lib to provide more advanced features (using composition), or move to popular full-featured libraries like [SWR](https://github.com/vercel/swr) or [React-Query](https://github.com/tannerlinsley/react-query).
5353

54-
If you prefer a full-featured fetching library, try [SWR](https://github.com/vercel/swr) or [React-Query](https://github.com/tannerlinsley/react-query).
55-
56-
## Usecase: loading async data into a component
54+
## Use-case: loading async data into a component
5755

5856
The ability to inject remote/async data into a React component is a very common React need. Later we might support Suspense as well.
5957

@@ -80,7 +78,7 @@ const StarwarsHero = ({ id }) => {
8078
};
8179
```
8280

83-
## Usecase: injecting async feedback into buttons
81+
## Use-case: injecting async feedback into buttons
8482

8583
If you have a Todo app, you might want to show some feedback into the "create todo" button while the creation is pending, and prevent duplicate todo creations by disabling the button.
8684

@@ -146,7 +144,7 @@ module.exports = {
146144

147145
It is possible to debounce a promise.
148146

149-
I recommend [awesome-debounce-promise](https://github.com/slorber/awesome-debounce-promise), as it handles nicely potential concurrency issues and have React in mind (particularly the common usecase of a debounced search input/autocomplete)
147+
I recommend [awesome-debounce-promise](https://github.com/slorber/awesome-debounce-promise), as it handles nicely potential concurrency issues and have React in mind (particularly the common use-case of a debounced search input/autocomplete)
150148

151149
As debounced functions are stateful, we have to "store" the debounced function inside a component. We'll use for that [use-constant](https://github.com/Andarist/use-constant) (backed by `useRef`).
152150

@@ -166,7 +164,7 @@ const StarwarsHero = ({ id }) => {
166164

167165
#### How can I implement a debounced search input / autocomplete?
168166

169-
This is one of the most common usecase for fetching data + debouncing in a component, and can be implemented easily by composing different libraries.
167+
This is one of the most common use-case for fetching data + debouncing in a component, and can be implemented easily by composing different libraries.
170168
All this logic can easily be extracted into a single hook that you can reuse. Here is an example:
171169

172170
```tsx
@@ -349,7 +347,7 @@ asyncSomething.execute();
349347

350348
#### How to support retry?
351349

352-
Use a lib that simply adds retry feature to async/promises directly. Doesn't exist? Build it.
350+
Use a lib that adds retry feature to async/promises directly.
353351

354352
# License
355353

0 commit comments

Comments
 (0)