> For the complete documentation index, see [llms.txt](https://refract.js.org/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://refract.js.org/examples/redux-fetch.md).

# Redux fetch

## Redux Fetch

| callbag                                                                                                                               | most                                                                                                                               | RxJS                                                                                                                               | xstream                                                                                                                               |
| ------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------- |
| [`code`](https://git.io/fAZ1d) [`live`](https://codesandbox.io/s/github/fanduel-oss/refract/tree/master/examples/redux-fetch/callbag) | [`code`](https://git.io/fAZ1F) [`live`](https://codesandbox.io/s/github/fanduel-oss/refract/tree/master/examples/redux-fetch/most) | [`code`](https://git.io/fAZ1b) [`live`](https://codesandbox.io/s/github/fanduel-oss/refract/tree/master/examples/redux-fetch/rxjs) | [`code`](https://git.io/fAZ1A) [`live`](https://codesandbox.io/s/github/fanduel-oss/refract/tree/master/examples/redux-fetch/xstream) |

This basic example renders a single text input which prompts for a GitHub username. When the user submits the form (either by clicking the button or pressing return), it dispatches a plain action to Redux.

### Aperture

Inside the Refract `aperture`, two observables are observed: the `USER_REQUEST` action, and the `getUsers` selector. Every time an action with the type `USER_REQUEST` is dispatched to the store, it is passed to the stream; every time the `users` object in the redux store changes, it is also passed to the stream.

These two streams are combined into one `combined$` - each time anything is sent to either stream, this new stream emits a new tuple containing the most recent value from *both* source streams.

This combined stream is piped through various methods in two separate control flows: requests for users whose data is not yet in redux are mapped to a fetch request, with error handling built in; requests for users whose data *is* already in the store are mapped to a `selectUser` action.

### Handler

The Refract `handler` inspects the type of each effect, and causes different effects for different action types. If the effect is an error, it logs the effect; if the effect is either a `USER_RECEIVE` or a `USER_SELECT` effect, it is dispatched to the store.

### Result

The end result is a form with some complex conditional, asynchronous logic built in an easily maintainable way.


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://refract.js.org/examples/redux-fetch.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
