# Request & Response

<details>

<summary>Notes: Frontend Data Fetching (Axios)</summary>

We use **Axios** as our data fetching library on the frontend, so the backend responses will ultimately come to the front end as the value of the `data` field of Axios's response object, which [has the following format](https://axios-http.com/docs/res_schema):

```json
{
  // `data` is the response that was provided by the server
  data: {}, // or [{}] for "many return" requests (e.g. Rails #index action)

  // `status` is the HTTP status code from the server response
  status: 200,

  // `statusText` is the HTTP status message from the server response
  // As of HTTP/2 status text is blank or unsupported.
  // (HTTP/2 RFC: https://www.rfc-editor.org/rfc/rfc7540#section-8.1.2.4)
  statusText: 'OK',

  // `headers` the HTTP headers that the server responded with
  // All header names are lower cased and can be accessed using the bracket notation.
  // Example: `response.headers['content-type']`
  headers: {},

  // `config` is the config that was provided to `axios` for the request
  config: {},

  // `request` is the request that generated this response
  // It is the last ClientRequest instance in node.js (in redirects)
  // and an XMLHttpRequest instance in the browser
  request: {}
}
```

</details>

* Use **JSON** as the primary data interchange format.
* Structure responses as:
  * **CRUD**
    * **C**
      * **SINGLE**
        * `{..}` (single object return from backend)
      * **MANY**
        * `[...]` (many objects return from backend)
    * **R**
      * **SINGLE**
        * `{..}` (single object return from backend)
      * **MANY**
        * `[...]` (many objects return from backend)
    * **U**
      * **SINGLE**
        * `{..}` (single object return from backend)
      * **MANY**
        * `[...]` (many objects return from backend)
    * **D**
      * <mark style="background-color:yellow;">**Note:**</mark>  <mark style="background-color:yellow;"></mark><mark style="background-color:yellow;">consider just id / id\[]</mark>
      * **SINGLE**
        * `{..}` (single object return from backend)
      * **MANY**
        * `[...]` (many objects return from backend)
  * **Other**
    * ...?
      * Successful
        * `{ message: "..." }`
      * Error
        * `{ error: "..." }`