The Python Coder

Reducers are part of Redux (which is a predictable state container for JS apps). Redux is used mostly for application state management in JS frameworks / libraries. Redux maintains the state of an entire application in a single immutable state tree (object) which cannot be changed directly. To change something, a new object must be created (using actions and reducers). So what are reducers anyway ? Reducers are used in response to an action which is sent to the store (a single immutable store). Reducers specify how the application’s state changes while action only describe what happens. You can think of reducers like an state changer, Let’s take an example of simple application where you want display list of food dishes using React js with Redux. Now, this list will usually have 3 actions:  i) DISHES_LOADING : which indicates dishes are been loading.  ii) DISHES_FAILED : which indicates the application failed to fetch the dishes details.  iii) ADD_DISHES...

If you are just starting react js or looking for a way to start react js , check out these examples below: These examples / concepts are must for a beginner to get well versed with. Stateful Components are components depending on it’s state object and change it’s own state. The component re-renders based on changes to it’s state, and may pass down properties of it’s state to child components as properties on a props object. Fig.1 Stateful Components Stateless Components purely acts as a view, the components do not have any state. Here, we pass props (method argument) and provide the value along with it. Notice there is “this” keyword. Fig.2. Stateless component Implicit Return Components are the same as above but without a return statement. This would be useful when you are creating a button or a default form that could be used else where. Fig.3. Implicit React Component Fragments are used to render multiple elements without using wrapper class. Fragments let you group a list of c...

Fig.1. Cool graphic design for better visuals Are you looking for some new react js to expand your skills or to explore the possibilities of react js, have a look at these projects :  Project 1 : Next.js React GraphQL Express Apollo Boilerplate If you are react js developer who uses GraphQL, Next.js, Express and Apollo regularly ( well I do ) then, give this boilerplate a go.  Features: Next.js React GraphQL Express React Apollo Typescript JsonWebToken TSLint Husky Bluebird Cors Github Link Project 2 : React Dashboard - "isomorphic" admin dashboard template If you are looking for a react dashboard template to use it for your own website, take a look at this: Fig.2. React Dashboard Features : React Mobile Friendly layout (responsive) React Router Bootstrap GraphQL Nodejs Backend Integration Sass styles Stylish, clean, responsive layout Lots of utility css classes for rapid development (flatlogic css set) Authentication CRUD operations examples Github Link Project 3 : React...