Skip to content

Instantly share code, notes, and snippets.

@dra1n

dra1n/slice_and_dice.md

Last active October 4, 2023 14:41
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save dra1n/5449cfe39ffc240950a9cf774a82061f to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save dra1n/5449cfe39ffc240950a9cf774a82061f to your computer and use it in GitHub Desktop.
Download ZIP
Raw
slice_and_dice.md

Teaching New Toys Old Tricks

What's in the toolbox?

  • createSlice
  • createAction
  • createAsyncThunk
  • configureStore

What's the slice?

  • Reduce boilerplate
  • Increase cohesion
  • Add magic (immutable mutations, action conventions)

OK, we were talking about business logic and UI separation

  • redux toolbox has thunk middleware out of the box
  • configureStore allows to reconfigure middleware, so we are able to inject services
  • createAsyncThunk is where we keep logic and consume services
  • Promises and pending, fullfiled and rejected actions
  • Hide redux from Components with custom hooks

How to test this thing?

  • slice test is pretty straightforward. We call actions, we see state updates, pure functions at it's greatest
  • createAsyncThunk. Action call results in other actions calls, so we might test these. Occasionally we want to test service calls
  • Components. Ideally we want to check that user-generated action results in a redux action. But in reality we had to go deeper and test service calls.

Is it any good? Is it better then saga?

  • It's OK
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment