Course Content
Introduction to Redux
Introduction to Redux
Redux Application Structure
To recap from the previous chapter, we can set up a basic application using the following command: npx create-react-app my-app --template redux
.
Our focus here is the src
folder since the public
folder has no significant change. In the src
folder, we will see many files and folders however following are the ones to be taken into consideration before we go on to understanding the remaining parts:
src
app
store.js
features
counter
counter.js
counterSlice.js
index.js
App.js
Following are the files found in it:
- The
app
folder always contains astore.js
file, which contains the code for creating the Redux store; - The
features
folder is unnecessary though it helps organize all the feature-focused components and their reducers. Thecounter.js
file contains theCounter
component, and thecounterSlice.js
contains the reducer, which is supposed to handle the state changes of theCounter
component; index.js
is the entry point of the application, this is executed first when the application starts;App.js
contains the top-level componentApp
.
Here is the codesandbox with the application. Tap the top left three lines to access other files.
Everything was clear?