#DSP 2017 – Understanding Redux…

Last two weeks I’ve worked on redux with reactJS. Have to admit, that I loved this. Understanding this was very though, all tutorials or articles were, in my humble opinion, hard to get the point of it, especially when you are beginner in JS, or was related with jQuery too long :D. So today I’ll try to explain it by my self – I’ll divide this article, because it is way to complex, to write it in one article… ok lets begin:

So in redux we have

1. actions
2. reducers
3. store (where we combine reducers)
4. dispatchers ( as reducers… )

Our actions are kind of code with business logic, where we want place needed function, to handle any action of our app/component – i.e fetching results from backend, saving user data or sending request to the backend and handling it. So lets build some acrton from the scratch. In our inChef app on front-end:

1. we present available meals
2. user can register or login
3. user can order meal
4. something else…

So we will use each option to proper reducers with actions. So lets focus on presenting available meals, we need:

1. REQUEST_MEALS
2. RECEIVE_MEALS
3. SELECT_MEAL
4. INVALIDATE_MEALS

So lets code it

export const REQUEST_MEALS = 'REQUEST_MEALS';
export const RECEIVE_MEALS = 'RECEIVE_MEALS';
export const SELECT_MEAL = 'SELECT_MEAL';
export const INVALIDATE_MEALS = 'INVALIDATE_MEALS';

Then for each action we need to write proper dispatchers…  ok this is for now – I’ll finish it Tomorrow.