Understanding the directory structure
Following is the directory structure of that contains all the files related to Redux. All the actions and reducers are present in the store
directory.
./store
├── actions
│ ├── index.js
│ └── exampleAction.js
├── reducers
│ ├── exampleReducer.js
│ └── userReducers
│ └── user.js
└── sagas
│ ├── exampleSaga.js
│ └── index.js
├── reducers.js
├── actionTypes.js
└── rootSaga.js
actions (directory)
This directory contains all the action creators. Keep reading on how you can create your action creators to be used in your application and within redux-saga
as well.
reducers (directory)
This directory contains all the reducers. You can further create directories and if needed to classify your reducers as well.
sagas (directory)
This directory contains all the sagas. RapidAdminReact comes pre-configured with redux-saga
. You can define your sagas in this directory and if need be nest them inside sub-directories as well to classify them based on the scale of your application.
actionsTypes.js
This file contains all the action types that can be used with Redux. All the action types are declared as constants and can me imported and used and any of the modules as and when needed.
reducers.js
This file contains all the reducers that are then passed to the Redux store to combine and instatiate all the reducers. Once you declare a reducer in the reducers
directory it is mandatory to include the same in this file else the reducer will not work.
rootSaga.js
This file contains all the sagas that you define. Just like the reducers it is all mandatory to include all the sagas that you declare in the sagas
directory.
Now since you are clear with the directory structure and various files in it. Let’s look at how you can make this work for for
synchronous
as well asasynchronous
calls in the next section.