Delve into Redux Toolkit to streamline Redux development with best practices. Gain insights into creating stores and reducers, and build TweetFind, a Twitter search app, for your portfolio.

data.tar.gz

main-branch

ice-creamy-completed

tweetfind-completed

Learn Redux toolkit (RTK) which highlights the new redux best practices and the new standard of developing applications. With RTK, redux development is more efficient and easier to understand.

Redux toolkit brings the much-needed simplicity you’ve longed for in your redux development. It has out-of-the-box support to handle common use cases such as creating the redux store, creating reducers, handling immutable update logic, and much more.

At the end of the course, you will build tweetfind, a Twitter search application. This will be a great addition to your portfolio.

Intermediate Redux with Redux Toolkit

# The createSlice API
Since you already know the purpose of `createSlice`, let’s get right into its API. 

const sliceObject = createSlice({
  name: 'aSliceName',
  initialState: someInitialStateValue,
  reducers: {
     // object of case reducers
  }
})

`createSlice` is invoked with an object of the shape seen above. The `name` field represents the slice name, `initialState` is the initial state for the slice of state, and `reducers` is an object of case reducers where each value handles a certain action type. 

Don’t worry if you don’t fully understand it. Let’s refactor Flappy to use `createSlice`, and it’ll all come together nicely! 

The Flappy app has a simple application state. Let’s create a single slice of state to represent this: 


import { createSlice } from "@reduxjs/toolkit";

const flappyMoodSlice = createSlice({
  
});

Let’s give this slice a name: `mood`. 


Get started with the createSlice utility provided by Redux toolkit.


What is Redux Toolkit and Why Use it?

Building Your First Redux Toolkit Application

Challenge on Building Your First Redux toolkit Application

RTK Deep Dive: Build a Twitter Search Application

Conclusion: Where to Go From Here

Appendix

Creating Slices of State with createSlice

The createSlice API