# Proxy To An API Server In Development With CRA

[create-react-app](https://github.com/facebookincubator/create-react-app) is a great way to bootstrap a React project, especially if you are building a single-page app. When building an SPA, you more likely than not will have a backend API that you interact with.

You can set up your React app to interact with that backend API server in development using the `proxy` configuration in `package.json`.

```json
// package.json
  ...
  "proxy": "http://localhost:4000",
}
```

This will allow you to keep your API calls nice and clean.

```javascript
fetch("/api/session", ...
```

No need to manage some sort of *host URL* environment variable.

Additionally, this will remove an CORS issues because the `webpackDevServer` will be proxying any paths that it doesn't recognize to the host and port that you've specified.

See [the `create-react-app` docs](https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md#proxying-api-requests-in-development) for more details.


---

# 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://ploegert.gitbook.io/til/programmy/react/proxy-to-an-api-server-in-development-with-cra.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.
