You'll find this "setup" script located in your*package.json*.

We'll be installing several NPM packages from terminal. You may consider installing a plugin for adding a terminal inside your editor, such as["platformio-ide-terminal"](https://github.com/platformio/platformio-atom-ide-terminal).

Let's get started by settings up the**store** for your Redux app.

Let's get started by settings up the**store** for your Redux app. We will be working in "src/index.js".

"pages": [

{

"title":"Project Setup",

"description":"Welcome! In this tutorial series we'll be exploring Redux, a tool for predictably managing state in your app.\n\nWe will be making a\"Worst Pokemon\" voting app. For the app, we'll need to setup some build tools.\n\nRunning `> npm run setup` will do the following:\n\n1. Install package dev dependencies\n2. Create an output directory called\"dist\"\n3. Install\"concurrently\" &\"browser-sync\" globally\n4. Run our app in the browser\n\nYou'll find this\"setup\" script located in your *package.json*.\n\n> We'll be installing several NPM packages from terminal. You may consider installing a plugin for adding a terminal inside your editor, such as [\"platformio-ide-terminal\"](https://github.com/platformio/platformio-atom-ide-terminal).",

"description":"Welcome! In this tutorial series we'll be exploring Redux, a tool for predictably managing state in your app.\n\nWe will be making a\"Worst Pokemon\" voting app. For the app, we'll need to setup some build tools.\n\nRunning `> npm run setup` will do the following:\n\n1. Install package dev dependencies\n2. Create an output directory called\"dist\"\n3. Install\"concurrently\" &\"browser-sync\" globally\n4. Run our app in the browser\n\nYou'll find this\"setup\" script located in your *package.json*.\n\nWe'll be installing several NPM packages from terminal. You may consider installing a plugin for adding a terminal inside your editor, such as [\"platformio-ide-terminal\"](https://github.com/platformio/platformio-atom-ide-terminal).",

"tasks": [

{

"description":"Open a terminal in this project directory and run `npm run setup`. Save to continue.",

},

{

"title":"The Store",

"description":"In Redux, the **store** is the boss. Think of the **store** as holding the\"single source of truth\" of your application data.\n\nOnce created, the **store** has several helpful methods:\n - `getState` to read the current data of your app.\n - `dispatch` to trigger actions. We'll look at actions more later.\n - `subscribe` to listen for state changes\n\n> [Learn more](http://redux.js.org/docs/basics/Store.html).\n\nLet's get started by settings up the **store** for your Redux app.",

"description":"In Redux, the **store** is the boss. Think of the **store** as holding the\"single source of truth\" of your application data.\n\nOnce created, the **store** has several helpful methods:\n - `getState` to read the current data of your app.\n - `dispatch` to trigger actions. We'll look at actions more later.\n - `subscribe` to listen for state changes\n\n> [Learn more](http://redux.js.org/docs/basics/Store.html).\n\nLet's get started by settings up the **store** for your Redux app. We will be working in\"src/index.js\".",

"tasks": [

{

"description":"install Redux as a dependency.",

]

},

{

"description":"createyour first store andcall it `store`. Use a simple\"reducer\" function for now, let's say `state => state`.",

"description":"use `createStore` to makeyour first store. Be sure tocall it `store`. Use a simple\"reducer\" function for now, let's say `state => state`. See [docs](http://redux.js.org/docs/api/createStore.html).",

"hints": [

"declare your store, `const store`",

]

},

{

"description":"import the newly written data in 'data.js'. Set it to a variable called\"initialState\".",

"description":"import the newly written data in 'data.js'. Set it to a variable called\"initialState\". Note: due to a bug with `import`'s, use `require` for imports.",

"tests": [

],

{

"description":"pass in `initialState` as a second param your `createStore`",

"tests": [

],

"hints": [

"testSuffix":".js"

},

"dependencies": {

"mocha-coderoad":"^0.10.0"

"mocha-coderoad":"^0.10.1"

}

}

You'll find this "setup" script located in your*package.json*.

We'll be installing several NPM packages from terminal. You may consider installing a plugin for adding a terminal inside your editor, such as["platformio-ide-terminal"](https://github.com/platformio/platformio-atom-ide-terminal).

+ Open a terminal in this project directory and run`npm run setup`. Save to continue.

@test('01/01')

"watch":"npm-watch"

},

"dependencies": {

"mocha-coderoad":"0.9.3"

"chai":"3.5.0",

"chai-spies":"0.7.1",

"mocha-coderoad":"^0.10.1"

},

"devDependencies": {

"babel-preset-es2015":"^6.9.0",

"babel-preset-es2015":"^6.13.2",

"babel-preset-react":"^6.11.1",

"babelify":"^7.3.0",

"browser-sync":"^2.13.0",

"browser-sync":"^2.14.0",

"coderoad-redux-js":"^0.1.0",

"concurrently":"^2.2.0",

"npm-watch":"^0.1.5"

"npm-watch":"^0.1.6"

},

"watch": {

"reload": {

Let's get started by settings up the**store** for your Redux app.

Let's get started by settings up the**store** for your Redux app. We will be working in "src/index.js".

+ install Redux as a dependency.

@hint('Add`import { createStore } from 'redux';`')

@test('02/02')

+createyour first store andcall it`store`. Use a simple "reducer" function for now, let's say`state => state`.

+use`createStore` to makeyour first store. Be sure tocall it`store`. Use a simple "reducer" function for now, let's say`state => state`. See[docs](http://redux.js.org/docs/api/createStore.html).

@hint('declare your store,`const store`')

@hint('call store with a simple reducer,`const store = createStore(state => state)`')

@test('02/03')

@test('02/05')

@hint('`console.log(store.getState())`')

+ import the newly written data in 'data.js'. Set it to a variable called "initialState".

+ import the newly written data in 'data.js'. Set it to a variable called "initialState". Note: due to a bug with`import`'s, use`require` for imports.

@test('02/06')

@action(writeFromFile('src/data.js', '02/data.js'))

@hint('Try this:`const initialState = require('./data.js').default;`')

+ pass in`initialState` as a second param your`createStore`

@test('02/06')

@test('02/07')

@hint('Pass in`initialState` as a second param to`createStore`')

@onPageComplete('As you can see, the store is just an object with various methods like "dispatch" and "getState". Let's see what these methods do in the next step.')