Redux with Angular 1

We will use the template from the second chapter, chapter2_4.zip. It already has webpack, Babel, and Redux set up, so all we need to do is the following:

• Install Angular 1
• Setup a basic Angular 1 application
• Install ng-redux
• Use ng-redux to connect Redux to Angular

Setting up Angular 1

To set up Angular 1, perform the following steps:

1. First of all, we need to install Angular via npm:

npm install --save angular

2. Do not forget to install the other dependencies by running the following command:

npm install

3. Next, we need to import Angular into our src/index.js file. At the top of the file, add the following:

import angular from 'angular'

4. Now, we need to tell Angular which element to use as a container. With React, we set id="root", and then referenced this element when rendering with ReactDOM. In the Angular world, we will need to set the ng-app attribute on the container element. In the index.html file, find this:

<div id="root"></div>

Now, replace the preceding line with this...