Building A Simple React Application Using The Flux Pattern: A Step-By-Step Guide - Tony Spiro

React is a very powerful library for building interactive JavaScript applications. One of its strongest qualities is that it forces you to build your app in a uni-directional data flow. This is much different from other frameworks’ two-way data binding. With React, every piece of your application is controlled from a single source, it’s owner. The owner is defined by the Component that is passing “props” to its owned component. As more nested components are added, this logic can grow out of hand and can make it difficult to keep track of events passed through the component hierarchy. This is where Flux steps in to provide an outlet from the hierarchy to handle dispatched events and altered data within our application. Rather than going into graphs and models to describe what Flux does, lets build an easy Flux example application. We’ll be building our application with the help of ES6 and Babel. If you’re unfamiliar with these, you can find out more about ES6 and Babel here. Babel allows us to use both ES6 JavaScript and JSX which will both compile to ES5 JavaScript which is compatible across all modern and legacy browsers. Now let’s get started…