A Remix action is a server-side function attached to a route that handles submitted form data and other mutations. It complements loader(), which reads route data; action() receives the request and can update application state, cookies, or models. section 11.3.3 section 12.3.4
Use route actions to:
- Read submitted values with request.formData(). section 11.3.3
- Persist local preferences through server-side cookies, including temperature and time-format settings. section 11.3.3
- Update domain data, such as user income, or create expenses with existing or new categories. section 12.3.4
- Support progressive enhancement: browser forms still work without JavaScript, while Remix can submit the form without a full page reload when JavaScript is enabled. section 11.3.3
City preference route
A city route combines a loader for city data and default formats with an action for submitted preference changes. The action reads form data, delegates cookie updates to helpers, serializes the new cookie, and redirects back with a Set-Cookie header. The same form remains functional when JavaScript is unavailable. section 11.3.3
Figure 11.18 The overall structure of the Remix city route contains three parts. Besides the data package and component, which I’ve covered extensively, we also have a data handler that’s capable of handling form submissions.
Use the route-structure diagram to inspect how the action sits beside the component and loader/data package as the form-submission handler. section 11.3.3
