Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.Project's Initial Code and File Structure | Redux Toolkit in Practice
course content

Course Content

Redux Toolkit & React

1. Introduction to Redux Toolkit

What is in this Course?Introduction to State ManagementUnderstanding Redux ToolkitInstallation of Redux ToolkitCreating a React Redux Toolkit ProjectChallenge: Installation of Redux ToolkitAdditional Software

2. Redux Toolkit in Practice

What AwaitsProject's Initial Code and File StructureCreating Redux StoreIntegrating Redux Store into the AppStore Inspection in the AppActions and Action CreatorsReducers RoleActions and Reducers InspectionConnecting Redux and ReactCompleting App Code

3. Redux Toolkit Challenge Workshop

OverviewChallenge RulesChallenge: Setting up the StoreChallenge: Creating ActionsChallenge: Creating ReducerChallenge: Involving Redux into ReactRedux Toolkit Sum Up

Redux Toolkit & React

Project's Initial Code and File StructureProject's Initial Code and File Structure

Before you begin working on the project, it's essential to inspect the provided files and folders to get familiar with the project structure. At present, only UI components are available without any logic. If you prefer to work locally, you can copy the components. However, please note that all code examples will be presented throughout the section.

How to work with Code Sandbox

Redux folder

It is recommended to inspect the redux folder very carefully. The following folders and files are presented.

  • actions/counterAction.js: This file will contain the action creators for the counter functionality. It defines functions that create actions related to the counter;
  • reducers/counterReducer.js: This file will contain the reducer function responsible for managing the counter state. It specifies how the state should change in response to different actions;
  • store.js: This file will set up the Redux store using Redux Toolkit's configureStore function. It combines multiple reducers and sets any required middleware.

Everything was clear?

Section 2. Chapter 2
course content

Course Content

Redux Toolkit & React

1. Introduction to Redux Toolkit

What is in this Course?Introduction to State ManagementUnderstanding Redux ToolkitInstallation of Redux ToolkitCreating a React Redux Toolkit ProjectChallenge: Installation of Redux ToolkitAdditional Software

2. Redux Toolkit in Practice

What AwaitsProject's Initial Code and File StructureCreating Redux StoreIntegrating Redux Store into the AppStore Inspection in the AppActions and Action CreatorsReducers RoleActions and Reducers InspectionConnecting Redux and ReactCompleting App Code

3. Redux Toolkit Challenge Workshop

OverviewChallenge RulesChallenge: Setting up the StoreChallenge: Creating ActionsChallenge: Creating ReducerChallenge: Involving Redux into ReactRedux Toolkit Sum Up

Redux Toolkit & React

Project's Initial Code and File StructureProject's Initial Code and File Structure

Before you begin working on the project, it's essential to inspect the provided files and folders to get familiar with the project structure. At present, only UI components are available without any logic. If you prefer to work locally, you can copy the components. However, please note that all code examples will be presented throughout the section.

How to work with Code Sandbox

Redux folder

It is recommended to inspect the redux folder very carefully. The following folders and files are presented.

  • actions/counterAction.js: This file will contain the action creators for the counter functionality. It defines functions that create actions related to the counter;
  • reducers/counterReducer.js: This file will contain the reducer function responsible for managing the counter state. It specifies how the state should change in response to different actions;
  • store.js: This file will set up the Redux store using Redux Toolkit's configureStore function. It combines multiple reducers and sets any required middleware.

Everything was clear?

Section 2. Chapter 2
some-alt