Redux Toolkit > Redux Toolkit: Initial State

Redux Toolkit Initial State

Within our createSlice function call, we're going to initialize the state of our app. Typically, you wouldn't have hardcoded data like this, but until we add data fetching (coming later), we're going to populate some mock data so we can start playing around with Redux toolkit features.

By the way, the redux documentation is amazing! Be sure to reference that alongside this course.

Okay, so we've got our initial state setup in our slice. Now we need a way to select things from this slice.

Lesson 2/6

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

const defaultMissions = [
  {
    id: 1,
    title: "Learn React",
    description: "Start with the basics of UI",
    created_at: "1/1/22",
  },
  {
    id: 2,
    title: "Learn Redux",
    description: "Manage client-side application state",
    created_at: "2/1/22",
  },
  {
    id: 3,
    title: "Learn Rails",
    description: "Build a scalable REST API",
    created_at: "3/4/22",
  },
];

const missionsSlice = createSlice({
  name: "missions",
  initialState: {
    missions: defaultMissions,
  },
  reducers: {},
});

export default missionsSlice.reducer;

Open Sandbox