Skip to content
Haz edited this page Apr 1, 2017 · 14 revisions

Actions are plain objects dispatched by the application (usually from containers) to describe changes on the store. Reducers and sagas listen to it so they can perform state changes and side effects, respectively, within the store.

A simple action looks like:

{ type: 'RESOURCE_UPDATE', id: 1, title: 'Hi!' }

ARc uses action types and action creators to create those action objects:

// src/store/resource/actions.js
export const RESOURCE_UPDATE = 'RESOURCE_UPDATE'

export const resourceUpdate = (id, body) => ({
  type: RESOURCE_UPDATE,
  id,
  ...body,
})

That way, other parts of the app, usually containers, can dispatch that action:

// src/containers/ResourceList.js
import { resourceUpdate } from 'store/actions'

store.dispatch(resourceUpdate(1, { title: 'Hi!' }))

Naming conventions

Actions and action creators don't perform any change by themselves. Therefore, it doesn't make sense to name them imperatively like updateResource. If it was the case, it would be more descriptive to name it like createResourceUpdateAction.

That said, to make things simpler, but stay descriptive, ARc follows these naming conventions:

  • Action types should be named as MODULE_ACTION. e.g. RESOURCE_UPDATE, RESOURCE_UPDATE_REQUEST;
  • Action creators should have the same name as their action type, but camelCased. e.g. resourceUpdate, resourceUpdateRequest.

This way, we can read it like store dispatches an resource update request on resource 1 changing its title to Hi!

store.dispatch(resourceUpdateRequest(1, { title: 'Hi!' }))
Clone this wiki locally