# Usage With React

It is not a requirement you should use React to use Redux Resource, but the two work well together. We recommend using the [react-redux](https://github.com/reactjs/react-redux) library to [link Redux with React](http://redux.js.org/docs/basics/UsageWithReact.html).

The following are some patterns that we find ourselves using frequently with Redux Resource.

## Using `mapStateToProps`

We recommend placing your calls to [`getResources`](/api-reference/get-resources.md) and [`getStatus`](/api-reference/get-status.md) within `mapStateToProps`. That way, you can access this information from any of the component's lifecycle methods, without needing to compute them within each method.

For example:

```javascript
import { getResources, getStatus } from 'redux-resource';

function mapStateToProps(state) {
  const searchedBooks = getResources(state.books, 'searchResults');
  const searchStatus = getStatus(state, 'books.requests.getSearchResults.status');

  return {
    searchedBooks,
    searchStatus
  };
}
```

## Type Checking with Prop Types

Redux Resource Prop Types exports a number of helpful prop types for common props that you'll pass into your React Components. Read the [Redux Resource Prop Types documentation](/extras/redux-resource-prop-types.md) for more.

## Using Request Statuses

This is such an important topic that there is a [dedicated guide for it](/other-guides/using-request-statuses.md).

## Determining When a Request Succeeds

Sometimes, you want to know the exact moment that a request succeeds. You can do this within your components by comparing the previous state with the next state to determine when a request changes from one status to another.

We recommend performing this check within `componentDidUpdate`. This might look like:

```javascript
import { getResources, getStatus } from 'redux-resource';

class BooksList extends Component {
  render() {
    // Render contents here
  }

  // Let's log to the console whenever a search result succeeds
  componentDidUpdate(prevProps) {
    if (this.props.searchStatus.succeeded && prevProps.searchStatus.pending) {
      console.log('The search request just succeeded.');
    }
  }
}


function mapStateToProps(state) {
  const searchStatus = getStatus(state, 'books.requests.getSearchResults.status');

  return {
    searchStatus
  };
}
```

This same approach can also be used to detect the moment that a request fails.


---

# Agent Instructions: 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:

```
GET https://redux-resource.js.org/other-guides/usage-with-react.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
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.
