Step 1

Add a "Name Plural". The "Name" is your context name. An example could be that you want to have a popup-alert context. Then you might want to call the "Name Plural": popupAlerts.

Step 2

Add a "Name Singular". In our alerts example this would be: popupAlert

Step 3

Choose your "Unique Selector". Usually this will be something like: id, value, uid... The unique selector is the key in your object that is unique and used to programmatically identify your item.

Step 4

Choose your required actions.

Required Folder Structure

For the "Imports" to work, please use this folder structure. Otherwise you can easily change the imports by hand. Example with popupAlerts:

ROOT/
├── public/
└── src/
   ├── context/
   │  └── popupAlerts/
   │     ├── PopupAlertState.js
   │     ├── popupAlertsReducer.js
   │     └── popupAlertsContext.js
   ├── components/
   │  └── popupAlerts/
   │     └── PopupAlerts.js
   ├── app.js
   └── ...