tutorial updates - step 2 outlined

ShMcK · ShMcK · commit 4443e0102372 · 2016-08-01T13:29:15.000-07:00
diff --git a/README.md b/README.md
@@ -41,3 +41,7 @@ We'll be installing a lot of scripts from terminal. You may also want to conside
 ##### The Store
 
 The "single source of truth".
+
+```js
+const store = createStore(reducer, initialState);
+```
diff --git a/coderoad.json b/coderoad.json
@@ -18,33 +18,41 @@
           ],
           "actions": [
             "open('package.json')",
-            "set('{\n  \"name\": \"coderoad-redux-js\",\n  \"version\": \"0.1.0\",\n  \"description\": \"Coderoad tutorial for using redux with raw javascript\",\n  \"bugs\": {\n    \"url\": \"https://github.com/shmck/coderoad-redux-js\"\n  },\n  \"license\": \"ISC\",\n  \"author\": \"Shawn McKay <shawn.j.mckay@gmail.com>\",\n  \"main\": \"index.js\",\n  \"repository\": \"https://github.com/shmck/coderoad-redux-js\",\n  \"scripts\": {\n    \"test\": \"echo \\\"Error: no test specified\\\" && exit 1\"\n  },\n  \"config\": {\n    \"language\": \"JS\",\n    \"runner\": \"mocha-coderoad\"\n  },\n  \"dependencies\": {\n    \"mocha-coderoad\": \"latest\"\n  },\n    \"devDependencies\": {\n    \"babel-preset-es2015\": \"^6.9.0\",\n    \"babel-preset-react\": \"^6.11.1\",\n    \"babelify\": \"^7.3.0\",\n    \"browser-sync\": \"^2.13.0\",\n    \"concurrently\": \"^2.2.0\",\n    \"npm-watch\": \"^0.1.5\"\n  },\n  \"watch\": {\n    \"reload\": {\n      \"patterns\": [\n        \"src\"\n      ],\n      \"extensions\": \"js,jsx,css,html,scss\",\n      \"ignore\": \"node_modules\",\n      \"quiet\": false\n    }\n  },\n  \"scripts\": {\n    \"browserify\": \"browserify src/index.js --extension=.jsx -o dist/bundle.js -t [ babelify --presets [ es2015 react ] ]\",\n    \"browsersync:reload\": \"browser-sync reload\",\n    \"browsersync:start\": \"browser-sync start --server --files 'index.html dist/bundle.js'\",\n    \"build\": \"npm run browserify\",\n    \"reload\": \"npm run browserify && npm run browsersync:reload\",\n    \"start\": \"concurrently --kill-others 'npm run build' 'npm run browsersync:start' 'npm run watch'\",\n    \"test\": \"echo \\\"Error: no test specified\\\" && exit 1\",\n    \"watch\": \"npm-watch\",\n    \"setup\": \"npm install && mkdir -p dist && npm i -g concurrently browser-sync && npm start\"\n  }\n}\n')"
+            "set('{\n  \"name\": \"coderoad-redux-js\",\n  \"version\": \"0.1.0\",\n  \"description\": \"Coderoad tutorial for using redux with raw javascript\",\n  \"bugs\": {\n    \"url\": \"https://github.com/shmck/coderoad-redux-js\"\n  },\n  \"license\": \"ISC\",\n  \"author\": \"Shawn McKay <shawn.j.mckay@gmail.com>\",\n  \"main\": \"index.js\",\n  \"repository\": \"https://github.com/shmck/coderoad-redux-js\",\n  \"scripts\": {\n    \"test\": \"echo \\\"Error: no test specified\\\" && exit 1\"\n  },\n  \"dependencies\": {\n    \"mocha-coderoad\": \"latest\"\n  },\n    \"devDependencies\": {\n    \"babel-preset-es2015\": \"^6.9.0\",\n    \"babel-preset-react\": \"^6.11.1\",\n    \"babelify\": \"^7.3.0\",\n    \"browser-sync\": \"^2.13.0\",\n    \"concurrently\": \"^2.2.0\",\n    \"npm-watch\": \"^0.1.5\",\n    \"coderoad-redux-js\": \"^0.1.0\"\n  },\n  \"watch\": {\n    \"reload\": {\n      \"patterns\": [\n        \"src\"\n      ],\n      \"extensions\": \"js,jsx,css,html,scss\",\n      \"ignore\": \"node_modules\",\n      \"quiet\": false\n    }\n  },\n  \"scripts\": {\n    \"browserify\": \"browserify src/index.js --extension=.jsx -o dist/bundle.js -t [ babelify --presets [ es2015 react ] ]\",\n    \"browsersync:reload\": \"browser-sync reload\",\n    \"browsersync:start\": \"browser-sync start --server --files 'index.html dist/bundle.js'\",\n    \"build\": \"npm run browserify\",\n    \"reload\": \"npm run browserify && npm run browsersync:reload\",\n    \"start\": \"concurrently --kill-others 'npm run build' 'npm run browsersync:start' 'npm run watch'\",\n    \"test\": \"echo \\\"Error: no test specified\\\" && exit 1\",\n    \"watch\": \"npm-watch\",\n    \"setup\": \"npm install && mkdir -p dist && npm i -g concurrently browser-sync && npm start\"\n  }\n}\n')"
           ]
         }
       ],
       "onPageComplete": "Continue to start working with Redux"
     },
     {
       "title": "The Store",
-      "description": "The \"single source of truth\".",
+      "description": "The \"single source of truth\".\n\n```js\nconst store = createStore(reducer, initialState);\n```",
       "tasks": [
         {
-          "description": "write a function `divideOne` divides a number by 1",
+          "description": "install Redux. Run `npm install redux`.",
+          "actions": [
+            "open('index.js')"
+          ],
           "tests": [
             "02/01"
-          ],
-          "actions": [
-            "open('page-02.js')",
-            "set('// divideOne\nfunction divideOne(x) {\n  return ::>\n}\n')"
           ]
         },
         {
-          "description": "write a function `mutiplyone` that multiplies a number by 1",
+          "description": "import { createStore } from 'redux';",
           "tests": [
             "02/02"
-          ],
-          "actions": [
-            "insert('\n// multiplyOne\nfunction multiplyOne(x) {\n  return ::>\n}\n')"
+          ]
+        },
+        {
+          "description": "create your first store and call it `store`. Use a simple \"reducer\" function for now, let's say `state => state`.",
+          "tests": [
+            "02/03"
+          ]
+        },
+        {
+          "description": "log your store to the console and have a look.",
+          "tests": [
+            "02/04"
           ]
         }
       ]
diff --git a/package.json b/package.json
@@ -7,16 +7,19 @@
   },
   "license": "ISC",
   "author": "Shawn McKay <shawn.j.mckay@gmail.com>",
-  "main": "index.js",
+  "main": "coderoad.json",
   "repository": "https://github.com/shmck/coderoad-redux-js",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1"
   },
   "config": {
+    "dir": "tutorial",
+    "testSuffix": ".js",
     "language": "JS",
-    "runner": "mocha-coderoad"
+    "runner": "mocha-coderoad",
+    "edit": true
   },
   "dependencies": {
-    "mocha-coderoad": "latest"
+    "mocha-coderoad": "0.9.0"
   }
 }
diff --git a/test.js b/test.js
diff --git a/tutorial/01/01.js b/tutorial/01/01.js
@@ -1,20 +1,6 @@
 var expect = require('chai').expect;
-const { accessSync, F_OK } = require('fs');
 
-// must include function to check before deps are added
-function exists(path, silent = true) {
-  try {
-    accessSync(path, F_OK);
-  } catch (e) {
-    if (e) {
-      if (!silent) {
-        console.log(e);
-      }
-      return false;
-    }
-  }
-  return true;
-}
+/// load('index.js')
 
 describe('01 setup', () => {
 
diff --git a/tutorial/01/index.md b/tutorial/01/index.md
@@ -37,10 +37,6 @@ We'll be installing a lot of scripts from terminal. You may also want to conside
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1"
   },
-  "config": {
-    "language": "JS",
-    "runner": "mocha-coderoad"
-  },
   "dependencies": {
     "mocha-coderoad": "latest"
   },
@@ -50,7 +46,8 @@ We'll be installing a lot of scripts from terminal. You may also want to conside
     "babelify": "^7.3.0",
     "browser-sync": "^2.13.0",
     "concurrently": "^2.2.0",
-    "npm-watch": "^0.1.5"
+    "npm-watch": "^0.1.5",
+    "coderoad-redux-js": "^0.1.0"
   },
   "watch": {
     "reload": {
diff --git a/tutorial/02/01.js b/tutorial/02/01.js
@@ -1,24 +1,12 @@
-var expect = require('chai').expect;
+var chai = require('chai');
+var spies = require('chai-spies');
+var expect = chai.expect;
+chai.use(spies);
 
-/// load('page-02.js')
+describe('01 Redux', () => {
 
-describe('01 divideOne', function() {
-
-  it('doesn\'t exist', function () {
-    expect(divideOne).to.be.defined;
-  });
-
-  it('should take a parameter', function() {
-    expect(divideOne).to.have.length(1);
-  });
-
-  it('doesn\'t output a number', function () {
-    expect(divideOne(1)).to.be.a('number');
-  });
-
-  it('returns the same number', function() {
-    expect(divideOne(1)).to.equal(1);
-    expect(divideOne(10)).to.equal(10);
+  it('isn\'t installed', () => {
+    expect(exists('node_modules/redux')).to.be.true;
   });
 
 });
diff --git a/tutorial/02/02.js b/tutorial/02/02.js
@@ -1,20 +1,7 @@
-describe('02 multiplyOne', function() {
+describe('02 createStore', () => {
 
-  it('doesn\'t exist', function () {
-    expect(multiplyOne).to.be.defined;
-  });
-
-  it('should take a parameter', function() {
-    expect(multiplyOne).to.have.length(1);
-  });
-
-  it('should output a number', function () {
-    expect(multiplyOne(1)).to.be.a('number');
-  });
-
-  it('returns the multiplied number by one', function() {
-    expect(multiplyOne(1)).to.equal(1);
-    expect(multiplyOne(10)).to.equal(10);
+  it('isn\'t imported. `import { createStore } from "redux";`', () => {
+    expect(createStore).to.be.defined;
   });
 
 });
diff --git a/tutorial/02/03.js b/tutorial/02/03.js
@@ -0,0 +1,7 @@
+describe('03 store', () => {
+
+  it('isn\'t defined. `const store`', () => {
+    expect(store).to.be.defined;
+  });
+
+});
diff --git a/tutorial/02/04.js b/tutorial/02/04.js
@@ -0,0 +1,9 @@
+var spy = chai.spy.on(console, 'log');
+
+describe('04 log store', () => {
+
+  it('isn\'t logged to the console. `console.log(store)`', () => {
+    expect(spy).to.have.been.called.with(store);
+  });
+
+});
diff --git a/tutorial/02/index.md b/tutorial/02/index.md
@@ -1,26 +1,19 @@
 ## The Store
 The "single source of truth".
 
-+ write a function `divideOne` divides a number by 1
-@test('02/01')
-@action(open('page-02.js'))
-@action(set(
-```
-// divideOne
-function divideOne(x) {
-  return ::>
-}
+```js
+const store = createStore(reducer, initialState);
 ```
-))
 
-+ write a function `mutiplyone` that multiplies a number by 1
++ install Redux. Run `npm install redux`.
+@action(open('index.js'))
+@test('02/01')
+
++ `import { createStore } from 'redux';`
 @test('02/02')
-@action(insert(
-```
 
-// multiplyOne
-function multiplyOne(x) {
-  return ::>
-}
-```  
-))
++ create your first store and call it `store`. Use a simple "reducer" function for now, let's say `state => state`.
+@test('02/03')
+
++ log your store to the console and have a look.
+@test('02/04')
