React in a Few Words
Everybody loves React, but it is a view-only library. What about the rest of the application? Enter Redux…
Redux in a Few Words
Redux emerged as the winner from the a harsh Darwinian battle of many state management and complete life-cycle for React applications. Facebook originally promoted the Flux architecture and many libraries and frameworks implement various flavors of it. But, then Redux took everybody else by storm.
Redux is based on 3 principles:
- Single source of truth
- State is Read-only
- Change modifications are made by pure functions only
Get up to Speed Quickly with Mozilla Neo
OK, React and Redux are great, but setting up a new project sounds very daunting with all the choices you have to make from some many options. Or is it? The mozilla-neo project is a an npm package that creates a complete project for you based on current best-in-class libraries and tools.
First install it:
```npm install -g mozilla-neo```
Then create a working directory and initialize a Neo project:
cd neo init```
It will ask you a few questions, create a whole directory structure for you and install a bunch of packages:
```02:44:29 [G] neo-app> neo init? What is the title of your app? Neo App? What is the name of your package (i.e. npm package name)? neo-app? Who is the author of this app? Gigi? Description A basic Mozilla Neo app? Choose a port for development 4000 create package.json create srcaboutindex.js create srcapp.js create srchomeindex.js create srcindex.js create srclayoutindex.js create srclayoutindex.scss create src avindex.js create src outes.js create testsabout_test.js create testshome_test.js create testslayout_test.js create tests av_test.js create .gitignore create .travis.yml create LICENSE create README.md
I’m all done. Running npm install for you to install the required dependencies. If this fails, try running the command yourself.
If you follow the instructions and type “npm start” the development server will start running. You can browse to http://localhost:4000 and view the starter Web application in action: http://i.imgur.com/hWbPiwU.png
You get a lot of functionality right out of the box:
- React, Redux, React Router
- ESLint, Babel, ES2015 + modules, Stage 0 preset
- Tests and coverage with Karma, Mocha, Chai, and Enzyme
- Bootstrap 4 and Sass
- Travis CI
There is really no general-purpose capability missing here. You can install additional specialized packages of course.