feat(tutorial): update cli version to beta.24

courses/tutorial/README.md

@@ -6,14 +6,20 @@
 
 ハンズオンを円滑に進行するために、事前に開発環境の準備を行います。
 
+このハンズオンに必要な開発環境は以下のとおりです
+
+- Node.js 6.x
+- Angular-CLI 1.0.0-beta.24
+
 ### Node.jsのインストール
 
-[Node.js](http://nodejs.org/)からお使いのOSに合わせたNode.jsをインストールしてください。
+[Node.js](https://nodejs.org/ja/)からお使いのOSに合わせたNode.jsをインストールしてください。
 
 ターミナル(コマンドプロンプト)を開いて以下のコマンドが実行できればインストール成功です
 
 ```
 $ node -v
+v6.9.1
 ```
 
 ### Angular-CLIのインストール

courses/tutorial/ch-1/.editorconfig

@@ -5,10 +5,9 @@ root = true
 charset = utf-8
 indent_style = space
 indent_size = 2
-end_of_line = lf
 insert_final_newline = true
 trim_trailing_whitespace = true
 
 [*.md]
-max_line_length = 0
+max_line_length = off
 trim_trailing_whitespace = false

courses/tutorial/ch-1/.gitignore

@@ -6,15 +6,22 @@
 
 # dependencies
 /node_modules
-/bower_components
 
 # IDEs and editors
 /.idea
 .project
 .classpath
+.c9/
 *.launch
 .settings/
 
+# IDE - VSCode
+.vscode/*
+!.vscode/settings.json
+!.vscode/tasks.json
+!.vscode/launch.json
+!.vscode/extensions.json
+
 # misc
 /.sass-cache
 /connect.lock

courses/tutorial/ch-1/angular-cli.json

@@ -1,13 +1,16 @@
 {
   "project": {
-    "version": "1.0.0-beta.15",
+    "version": "1.0.0-beta.24",
     "name": "hello-angular"
   },
   "apps": [
     {
       "root": "src",
       "outDir": "dist",
-      "assets": "assets",
+      "assets": [
+        "assets",
+        "favicon.ico"
+      ],
       "index": "index.html",
       "main": "main.ts",
       "test": "test.ts",
@@ -39,6 +42,18 @@
   },
   "defaults": {
     "styleExt": "css",
-    "prefixInterfaces": false
+    "prefixInterfaces": false,
+    "inline": {
+      "style": false,
+      "template": false
+    },
+    "spec": {
+      "class": false,
+      "component": true,
+      "directive": true,
+      "module": false,
+      "pipe": true,
+      "service": true
+    }
   }
 }

courses/tutorial/ch-1/e2e/app.e2e-spec.ts

@@ -1,10 +1,10 @@
-import { Ch1Page } from './app.po';
+import { HelloAngularPage } from './app.po';
 
-describe('ch-1 App', function() {
-  let page: Ch1Page;
+describe('hello-angular App', function() {
+  let page: HelloAngularPage;
 
   beforeEach(() => {
-    page = new Ch1Page();
+    page = new HelloAngularPage();
   });
 
   it('should display message saying app works', () => {

courses/tutorial/ch-1/e2e/app.po.ts

@@ -1,6 +1,6 @@
-import { browser, element, by } from 'protractor/globals';
+import { browser, element, by } from 'protractor';
 
-export class Ch1Page {
+export class HelloAngularPage {
   navigateTo() {
     return browser.get('/');
   }

courses/tutorial/ch-1/karma.conf.js

@@ -17,6 +17,9 @@ module.exports = function (config) {
     preprocessors: {
       './src/test.ts': ['angular-cli']
     },
+    mime: {
+      'text/x-typescript': ['ts','tsx']
+    },
     remapIstanbulReporter: {
       reports: {
         html: 'coverage',
@@ -27,7 +30,9 @@ module.exports = function (config) {
       config: './angular-cli.json',
       environment: 'dev'
     },
-    reporters: ['progress', 'karma-remap-istanbul'],
+    reporters: config.angularCli && config.angularCli.codeCoverage
+              ? ['progress', 'karma-remap-istanbul']
+              : ['progress'],
     port: 9876,
     colors: true,
     logLevel: config.LOG_INFO,

courses/tutorial/ch-1/package.json

@@ -1,44 +1,47 @@
 {
-  "name": "ch-1",
+  "name": "hello-angular",
   "version": "0.0.0",
   "license": "MIT",
   "angular-cli": {},
   "scripts": {
+    "ng": "ng",
     "start": "ng serve",
     "lint": "tslint \"src/**/*.ts\"",
     "test": "ng test",
-    "pree2e": "webdriver-manager update",
+    "pree2e": "webdriver-manager update --standalone false --gecko false",
     "e2e": "protractor"
   },
   "private": true,
   "dependencies": {
-    "@angular/common": "2.0.0",
-    "@angular/compiler": "2.0.0",
-    "@angular/core": "2.0.0",
-    "@angular/forms": "2.0.0",
-    "@angular/http": "2.0.0",
-    "@angular/platform-browser": "2.0.0",
-    "@angular/platform-browser-dynamic": "2.0.0",
-    "@angular/router": "3.0.0",
+    "@angular/common": "^2.3.1",
+    "@angular/compiler": "^2.3.1",
+    "@angular/core": "^2.3.1",
+    "@angular/forms": "^2.3.1",
+    "@angular/http": "^2.3.1",
+    "@angular/platform-browser": "^2.3.1",
+    "@angular/platform-browser-dynamic": "^2.3.1",
+    "@angular/router": "^3.3.1",
     "core-js": "^2.4.1",
-    "rxjs": "5.0.0-beta.12",
+    "rxjs": "^5.0.1",
     "ts-helpers": "^1.1.1",
-    "zone.js": "^0.6.23"
+    "zone.js": "^0.7.2"
   },
   "devDependencies": {
-    "@types/jasmine": "^2.2.30",
-    "angular-cli": "1.0.0-beta.15",
-    "codelyzer": "~0.0.26",
-    "jasmine-core": "2.4.1",
+    "@angular/compiler-cli": "^2.3.1",
+    "@types/jasmine": "2.5.38",
+    "@types/node": "^6.0.42",
+    "angular-cli": "1.0.0-beta.24",
+    "codelyzer": "~2.0.0-beta.1",
+    "jasmine-core": "2.5.2",
     "jasmine-spec-reporter": "2.5.0",
     "karma": "1.2.0",
     "karma-chrome-launcher": "^2.0.0",
     "karma-cli": "^1.0.1",
     "karma-jasmine": "^1.0.2",
     "karma-remap-istanbul": "^0.2.1",
-    "protractor": "4.0.5",
+    "protractor": "~4.0.13",
     "ts-node": "1.2.1",
-    "tslint": "3.13.0",
-    "typescript": "2.0.2"
+    "tslint": "^4.0.2",
+    "typescript": "~2.0.3"
   }
 }

courses/tutorial/ch-1/protractor.conf.js

@@ -1,5 +1,5 @@
 // Protractor configuration file, see link for more information
-// https://github.com/angular/protractor/blob/master/docs/referenceConf.js
+// https://github.com/angular/protractor/blob/master/lib/config.ts
 
 /*global jasmine */
 var SpecReporter = require('jasmine-spec-reporter');

courses/tutorial/ch-1/src/app/app.component.spec.ts

@@ -3,13 +3,14 @@
 import { TestBed, async } from '@angular/core/testing';
 import { AppComponent } from './app.component';
 
-describe('App: Ch1', () => {
+describe('AppComponent', () => {
   beforeEach(() => {
     TestBed.configureTestingModule({
       declarations: [
         AppComponent
       ],
     });
+    TestBed.compileComponents();
   });
 
   it('should create the app', async(() => {

courses/tutorial/ch-1/src/app/app.component.ts

@@ -6,5 +6,5 @@ import { Component } from '@angular/core';
   styleUrls: ['./app.component.css']
 })
 export class AppComponent {
-  title = 'Hello Angular!';
+  title = 'app works!';
 }

courses/tutorial/ch-1/src/index.html

@@ -2,12 +2,11 @@
 <html>
 <head>
   <meta charset="utf-8">
-  <title>Hello Angular</title>
+  <title>HelloAngular</title>
   <base href="/">
 
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <link rel="icon" type="image/x-icon" href="favicon.ico">
-
 </head>
 <body>
   <app-root>Loading...</app-root>

courses/tutorial/ch-1/src/main.ts

@@ -3,7 +3,7 @@ import './polyfills.ts';
 import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
 import { enableProdMode } from '@angular/core';
 import { environment } from './environments/environment';
-import { AppModule } from './app/';
+import { AppModule } from './app/app.module';
 
 if (environment.production) {
   enableProdMode();

courses/tutorial/ch-1/src/styles.css

@@ -1 +1 @@
-/* You can add global styles to this file, and also import other style files */
+/* You can add global styles to this file, and also import other style files */

courses/tutorial/ch-1/src/test.ts

@@ -6,6 +6,11 @@ import 'zone.js/dist/sync-test';
 import 'zone.js/dist/jasmine-patch';
 import 'zone.js/dist/async-test';
 import 'zone.js/dist/fake-async-test';
+import { getTestBed } from '@angular/core/testing';
+import {
+  BrowserDynamicTestingModule,
+  platformBrowserDynamicTesting
+} from '@angular/platform-browser-dynamic/testing';
 
 // Unfortunately there's no typing for the `__karma__` variable. Just declare it as any.
 declare var __karma__: any;
@@ -14,21 +19,14 @@ declare var require: any;
 // Prevent Karma from running prematurely.
 __karma__.loaded = function () {};
 
-
-Promise.all([
-  System.import('@angular/core/testing'),
-  System.import('@angular/platform-browser-dynamic/testing')
-])
-  // First, initialize the Angular testing environment.
-  .then(([testing, testingBrowser]) => {
-    testing.getTestBed().initTestEnvironment(
-      testingBrowser.BrowserDynamicTestingModule,
-      testingBrowser.platformBrowserDynamicTesting()
-    );
-  })
-  // Then we find all the tests.
-  .then(() => require.context('./', true, /\.spec\.ts/))
-  // And load the modules.
-  .then(context => context.keys().map(context))
-  // Finally, start Karma to run the tests.
-  .then(__karma__.start, __karma__.error);
+// First, initialize the Angular testing environment.
+getTestBed().initTestEnvironment(
+  BrowserDynamicTestingModule,
+  platformBrowserDynamicTesting()
+);
+// Then we find all the tests.
+let context = require.context('./', true, /\.spec\.ts$/);
+// And load the modules.
+context.keys().map(context);
+// Finally, start Karma to run the tests.
+__karma__.start();

courses/tutorial/ch-1/src/tsconfig.json

@@ -1,5 +1,6 @@
 {
   "compilerOptions": {
+    "baseUrl": "",
     "declaration": false,
     "emitDecoratorMetadata": true,
     "experimentalDecorators": true,

courses/tutorial/ch-1/tslint.json

@@ -16,7 +16,6 @@
       "spaces"
     ],
     "label-position": true,
-    "label-undefined": true,
     "max-line-length": [
       true,
       140
@@ -39,7 +38,6 @@
     ],
     "no-construct": true,
     "no-debugger": true,
-    "no-duplicate-key": true,
     "no-duplicate-variable": true,
     "no-empty": false,
     "no-eval": true,
@@ -49,8 +47,6 @@
     "no-switch-case-fall-through": true,
     "no-trailing-whitespace": true,
     "no-unused-expression": true,
-    "no-unused-variable": true,
-    "no-unreachable": true,
     "no-use-before-declare": true,
     "no-var-keyword": true,
     "object-literal-sort-keys": false,
@@ -93,12 +89,8 @@
       "check-type"
     ],
 
-    "directive-selector-prefix": [true, "app"],
-    "component-selector-prefix": [true, "app"],
-    "directive-selector-name": [true, "camelCase"],
-    "component-selector-name": [true, "kebab-case"],
-    "directive-selector-type": [true, "attribute"],
-    "component-selector-type": [true, "element"],
+    "directive-selector": [true, "attribute", "app", "camelCase"],
+    "component-selector": [true, "element", "app", "kebab-case"],
     "use-input-property-decorator": true,
     "use-output-property-decorator": true,
     "use-host-property-decorator": true,
@@ -107,6 +99,9 @@
     "use-life-cycle-interface": true,
     "use-pipe-transform-interface": true,
     "component-class-suffix": true,
-    "directive-class-suffix": true
+    "directive-class-suffix": true,
+    "no-access-missing-member": true,
+    "templates-use-public": true,
+    "invoke-injectable": true
   }
 }

courses/tutorial/ch-2/.editorconfig

@@ -5,10 +5,9 @@ root = true
 charset = utf-8
 indent_style = space
 indent_size = 2
-end_of_line = lf
 insert_final_newline = true
 trim_trailing_whitespace = true
 
 [*.md]
-max_line_length = 0
+max_line_length = off
 trim_trailing_whitespace = false