Skip to content

Commit 9d12596

Browse files
update README
1 parent 395205f commit 9d12596

File tree

1 file changed

+37
-0
lines changed

1 file changed

+37
-0
lines changed

docs/README.md

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,9 @@ async function doSomethingComplex(data) {
2525

2626
Since React allows as to treat the UI as a first-class citizen, we can mix both things for the sake of solving problems that are the same in React and in just JavaScript code.
2727

28+
This project tends to use the simplicity of functional React components and the essential mechanism of coroutines to create stateful components with data fetching colocation.
29+
30+
The problem of existent solutions in colocating data fetching is an initial complexity of their APIs. These APIs usually tend to provide convenient way for handling one particular use case. This often means possible future issues with handling exceptions or dealing with pending state. However, that's something that can be easily described in terms of the language and may be different based on your opinion or particular task.
2831

2932
## Install
3033

@@ -85,6 +88,40 @@ In the example above, the result component receives `userId` property and uses i
8588
<PostListCo userId={...} />
8689
```
8790

91+
### Async Iterators
92+
93+
[Asynchronous Iterators](https://github.com/tc39/proposal-async-iteration) are in [Stage 3](https://github.com/tc39/proposals) and soon will be added to the language. However, you might want to try them right now, using [Babel](https://babeljs.io/) or [async-to-gen](https://github.com/leebyron/async-to-gen).
94+
95+
```javascript
96+
async function* CommentListContainer() {
97+
yield <LoadingSpinner />;
98+
99+
try {
100+
const comments = await CommentsDAO.retrieve();
101+
return <CommentList comments={comments} />;
102+
} catch (error) {
103+
return <ErrorMessage error={error} />;
104+
}
105+
}
106+
107+
export default Coroutine.create(CommentListContainer);
108+
```
109+
110+
```javascript
111+
async function* List() {
112+
try {
113+
const items = await Items.retrieve();
114+
yield <ItemList items={items} />;
115+
const additionalInfo = await Info.retrieve();
116+
return <ItemList items={items} info={info} />;
117+
} catch (error) {
118+
return <p>...</p>;
119+
}
120+
}
121+
122+
export default Coroutine.create(List);
123+
```
124+
88125
## Testing
89126

90127
Please read the [testing guide](./Testing.md).

0 commit comments

Comments
 (0)