diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/.editorconfig b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/.editorconfig
new file mode 100755
index 00000000..8369a3b7
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/.editorconfig
@@ -0,0 +1,19 @@
+# http://editorconfig.org
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 2
+insert_final_newline = true
+trim_trailing_whitespace = true
+
+
+[*.md]
+max_line_length = 0
+trim_trailing_whitespace = false
+
+# Indentation override
+#[lib/**.js]
+#[{package.json,.travis.yml}]
+#[**/**.js]
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/bs-config.json b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/bs-config.json
new file mode 100755
index 00000000..e13c073a
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/bs-config.json
@@ -0,0 +1,8 @@
+{
+  "server": {
+    "baseDir": "src",
+    "routes": {
+      "/node_modules": "node_modules"
+    }
+  }
+}
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/config/helpers.js b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/config/helpers.js
new file mode 100755
index 00000000..0b19f260
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/config/helpers.js
@@ -0,0 +1,7 @@
+var path = require('path');
+var _root = path.resolve(__dirname, '..');
+function root(args) {
+    args = Array.prototype.slice.call(arguments, 0);
+    return path.join.apply(path, [_root].concat(args));
+}
+exports.root = root;
\ No newline at end of file
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/config/karma-test-shim.js b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/config/karma-test-shim.js
new file mode 100755
index 00000000..30d52388
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/config/karma-test-shim.js
@@ -0,0 +1,15 @@
+Error.stackTraceLimit = Infinity;
+require('core-js/es6');
+require('core-js/es7/reflect');
+require('zone.js/dist/zone');
+require('zone.js/dist/long-stack-trace-zone');
+require('zone.js/dist/proxy');
+require('zone.js/dist/sync-test');
+require('zone.js/dist/jasmine-patch');
+require('zone.js/dist/async-test');
+require('zone.js/dist/fake-async-test');
+var appContext = require.context('../src', true, /\.spec\.ts/);
+appContext.keys().forEach(appContext);
+var testing = require('@angular/core/testing');
+var browser = require('@angular/platform-browser-dynamic/testing');
+testing.TestBed.initTestEnvironment(browser.BrowserDynamicTestingModule, browser.platformBrowserDynamicTesting());
\ No newline at end of file
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/config/karma.conf.js b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/config/karma.conf.js
new file mode 100755
index 00000000..61caaa59
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/config/karma.conf.js
@@ -0,0 +1,29 @@
+var webpackConfig = require('./webpack.test');
+
+module.exports = function (config) {
+    var _config = {
+        basePath: '',
+        frameworks: ['jasmine'],
+        files: [
+            {pattern: './config/karma-test-shim.js', watched: false}
+        ],
+        preprocessors: {
+            './config/karma-test-shim.js': ['webpack', 'sourcemap']
+        },
+        webpack: webpackConfig,
+        webpackMiddleware: {
+            stats: 'errors-only'
+        },
+        webpackServer: {
+            noInfo: true
+        },
+        reporters: ['progress'],
+        port: 9876,
+        colors: true,
+        logLevel: config.LOG_INFO,
+        autoWatch: false,
+        browsers: ['PhantomJS'],
+        singleRun: true
+    };
+    config.set(_config);
+};
\ No newline at end of file
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/config/webpack.common.js b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/config/webpack.common.js
new file mode 100755
index 00000000..4fd9a807
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/config/webpack.common.js
@@ -0,0 +1,59 @@
+var webpack = require('webpack');
+var HtmlWebpackPlugin = require('html-webpack-plugin');
+var ExtractTextPlugin = require('extract-text-webpack-plugin');
+var helpers = require('./helpers');
+
+module.exports = {
+    entry: {
+        'polyfills': './src/polyfills.ts',
+        'vendor': './src/vendor.ts',
+        'app': './src/main.ts'
+    },
+    resolve: {
+        extensions: ['.ts', '.js', '.html', '.css']
+    },
+    module: {
+        rules: [
+        {
+            test: /\.ts$/,
+            loaders: [{
+            loader: 'awesome-typescript-loader',
+            options: { configFileName: helpers.root('src', 'tsconfig.json') }
+            } , 'angular2-template-loader']
+        },
+        {
+            test: /\.html$/,
+            loader: 'html-loader'
+        },
+        {
+            test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)$/,
+            loader: 'file-loader?name=assets/[name].[hash].[ext]'
+        },
+        {
+            test: /\.css$/,
+            exclude: helpers.root('src', 'app'),
+            loader: ExtractTextPlugin.extract({ fallbackLoader: 'style-loader', loader: 'css-loader?sourceMap' })
+        },
+        {
+            test: /\.css$/,
+            include: helpers.root('src', 'app'),
+            loader: 'raw-loader'
+        }
+        ]
+    },
+    plugins: [
+        // Workaround for angular/angular#11580
+        new webpack.ContextReplacementPlugin(
+            // The (\\|\/) piece accounts for path separators in *nix and Windows
+            /angular(\\|\/)core(\\|\/)(esm(\\|\/)src|src)(\\|\/)linker/,
+            helpers.root('./src'), // location of your src
+            {} // a map of your routes
+        ),
+        new webpack.optimize.CommonsChunkPlugin({
+            name: ['app', 'vendor', 'polyfills']
+        }),
+        new HtmlWebpackPlugin({
+        template: 'src/index.html'
+        })
+    ]
+};
\ No newline at end of file
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/config/webpack.dev.js b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/config/webpack.dev.js
new file mode 100755
index 00000000..7da0e9a5
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/config/webpack.dev.js
@@ -0,0 +1,24 @@
+var webpackMerge = require('webpack-merge');
+var ExtractTextPlugin = require('extract-text-webpack-plugin');
+var commonConfig = require('./webpack.common.js');
+var helpers = require('./helpers');
+
+module.exports = webpackMerge(commonConfig, {
+    devtool: 'cheap-module-eval-source-map',
+
+    output: {
+        path: helpers.root('dist'),
+        publicPath: 'http://localhost:8080/',
+        filename: '[name].js',
+        chunkFilename: '[id].chunk.js'
+    },
+
+    plugins: [
+        new ExtractTextPlugin('[name].css')
+    ],
+
+    devServer: {
+        historyApiFallback: true,
+        stats: 'minimal'
+    }
+});
\ No newline at end of file
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/config/webpack.prod.js b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/config/webpack.prod.js
new file mode 100755
index 00000000..e4f6a51a
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/config/webpack.prod.js
@@ -0,0 +1,38 @@
+var webpack = require('webpack');
+var webpackMerge = require('webpack-merge');
+var ExtractTextPlugin = require('extract-text-webpack-plugin');
+var commonConfig = require('./webpack.common.js');
+var helpers = require('./helpers');
+
+const ENV = process.env.NODE_ENV = process.env.ENV = 'production';
+
+module.exports = webpackMerge(commonConfig, {
+    devtool: 'source-map',
+
+    output: {
+        path: helpers.root('dist'),
+        publicPath: '/',
+        filename: '[name].[hash].js',
+        chunkFilename: '[id].[hash].chunk.js'
+    },
+
+    plugins: [
+        new webpack.NoEmitOnErrorsPlugin(),
+        new webpack.optimize.UglifyJsPlugin({ // https://github.com/angular/angular/issues/10618
+            mangle: {
+                keep_fnames: true
+            }
+        }),
+        new ExtractTextPlugin('[name].[hash].css'),
+        new webpack.DefinePlugin({
+            'process.env': {
+            'ENV': JSON.stringify(ENV)
+            }
+        }),
+        new webpack.LoaderOptionsPlugin({
+            htmlLoader: {
+                minimize: false // workaround for ng2
+            }
+        })
+    ]
+});
\ No newline at end of file
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/config/webpack.test.js b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/config/webpack.test.js
new file mode 100755
index 00000000..41742759
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/config/webpack.test.js
@@ -0,0 +1,44 @@
+var webpack = require('webpack');
+var helpers = require('./helpers');
+
+module.exports = {
+    devtool: 'inline-source-map',
+    resolve: {
+        extensions: ['.ts', '.js']
+    },
+    module: {
+        rules: [
+            {
+                test: /\.ts$/,
+                loaders: ['awesome-typescript-loader', 'angular2-template-loader']
+            },
+            {
+                test: /\.html$/,
+                loader: 'html-loader'
+            },
+            {
+                test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)$/,
+                loader: 'null-loader'
+            },
+            {
+                test: /\.css$/,
+                exclude: helpers.root('src', 'app'),
+                loader: 'null-loader'
+            },
+            {
+                test: /\.css$/,
+                include: helpers.root('src', 'app'),
+                loader: 'raw-loader'
+            }
+        ]
+    },
+
+    plugins: [
+        new webpack.ContextReplacementPlugin(
+            // The (\\|\/) piece accounts for path separators in *nix and Windows
+            /angular(\\|\/)core(\\|\/)(esm(\\|\/)src|src)(\\|\/)linker/,
+            helpers.root('./src'), // location of your src
+            {} // a map of your routes
+        )
+    ]
+}
\ No newline at end of file
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/karma.conf.js b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/karma.conf.js
new file mode 100755
index 00000000..fc51e550
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/karma.conf.js
@@ -0,0 +1 @@
+module.exports = require('./config/karma.conf.js');
\ No newline at end of file
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/package.json b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/package.json
new file mode 100755
index 00000000..b859b7ce
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/package.json
@@ -0,0 +1,57 @@
+{
+  "name": "angular-quickstart",
+  "version": "1.0.0",
+  "description": "QuickStart package.json from the documentation, supplemented with testing support",
+  "scripts": {
+    "start": "webpack-dev-server --inline --progress --port 8080",
+    "test": "karma start",
+    "build": "rimraf dist && webpack --config config/webpack.prod.js --progress --profile --bail"
+  },
+  "keywords": [
+    "angular2",
+    "webpack",
+    "typescript"
+  ],
+  "author": "",
+  "license": "MIT",
+  "dependencies": {
+    "@angular/common": "~2.4.0",
+    "@angular/compiler": "~2.4.0",
+    "@angular/core": "~2.4.0",
+    "@angular/forms": "~2.4.0",
+    "@angular/http": "~2.4.0",
+    "@angular/platform-browser": "~2.4.0",
+    "@angular/platform-browser-dynamic": "~2.4.0",
+    "@angular/router": "~3.4.0",
+    "core-js": "^2.4.1",
+    "rxjs": "5.0.1",
+    "zone.js": "^0.7.4"
+  },
+  "devDependencies": {
+    "@types/jasmine": "^2.5.35",
+    "@types/node": "^6.0.45",
+    "angular2-template-loader": "^0.6.0",
+    "awesome-typescript-loader": "^2.2.4",
+    "css-loader": "^0.26.1",
+    "extract-text-webpack-plugin": "2.0.0-beta.5",
+    "file-loader": "^0.9.0",
+    "html-loader": "^0.4.3",
+    "html-webpack-plugin": "^2.16.1",
+    "jasmine-core": "^2.4.1",
+    "karma": "^1.2.0",
+    "karma-jasmine": "^1.0.2",
+    "karma-phantomjs-launcher": "^1.0.2",
+    "karma-sourcemap-loader": "^0.3.7",
+    "karma-webpack": "^2.0.1",
+    "null-loader": "^0.1.1",
+    "phantomjs-prebuilt": "^2.1.7",
+    "raw-loader": "^0.5.1",
+    "rimraf": "^2.5.2",
+    "style-loader": "^0.13.1",
+    "typescript": "~2.0.10",
+    "webpack": "^2.2.0",
+    "webpack-dev-server": "2.2.0-rc.0",
+    "webpack-merge": "^2.4.0"
+  },
+  "repository": {}
+}
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/app-routing.module.ts b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/app-routing.module.ts
new file mode 100644
index 00000000..88516bac
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/app-routing.module.ts
@@ -0,0 +1,19 @@
+import { NgModule }             from '@angular/core';
+import { RouterModule, Routes } from '@angular/router';
+import { DashboardComponent }   from './dashboard.component';
+import { HeroesComponent }      from './heroes.component';
+import { HeroDetailComponent }  from './hero-detail.component';
+import { HeroEditingComponent } from './hero-editing.component';
+
+const routes: Routes = [
+    { path: '', redirectTo: '/dashboard', pathMatch: 'full' },
+    { path: 'dashboard',  component: DashboardComponent },
+    { path: 'detail/:id', component: HeroDetailComponent },
+    { path: 'editing/:id',component: HeroEditingComponent },
+    { path: 'heroes',     component: HeroesComponent }
+];
+@NgModule({
+    imports: [ RouterModule.forRoot(routes) ],
+    exports: [ RouterModule ]
+})
+export class AppRoutingModule {}
\ No newline at end of file
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/app.component.css b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/app.component.css
new file mode 100755
index 00000000..3e9de533
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/app.component.css
@@ -0,0 +1,75 @@
+.selected {
+  background-color: #CFD8DC !important;
+  color: white;
+}
+.heroes {
+  margin: 0 0 2em 0;
+  list-style-type: none;
+  padding: 0;
+  width: 15em;
+}
+.heroes li {
+  cursor: pointer;
+  position: relative;
+  left: 0;
+  background-color: #EEE;
+  margin: .5em;
+  padding: .3em 0;
+  height: 1.6em;
+  border-radius: 4px;
+}
+.heroes li.selected:hover {
+  background-color: #BBD8DC !important;
+  color: white;
+}
+.heroes li:hover {
+  color: #607D8B;
+  background-color: #DDD;
+  left: .1em;
+}
+.heroes .text {
+  position: relative;
+  top: -3px;
+}
+.heroes .badge {
+  display: inline-block;
+  font-size: small;
+  color: white;
+  padding: 0.8em 0.7em 0 0.7em;
+  background-color: #607D8B;
+  line-height: 1em;
+  position: relative;
+  left: -1px;
+  top: -4px;
+  height: 1.8em;
+  margin-right: .8em;
+  border-radius: 4px 0 0 4px;
+}
+h1 {
+  font-size: 1.2em;
+  color: #999;
+  margin-bottom: 0;
+}
+h2 {
+  font-size: 2em;
+  margin-top: 0;
+  padding-top: 0;
+}
+nav a {
+  padding: 5px 10px;
+  text-decoration: none;
+  margin-top: 10px;
+  display: inline-block;
+  background-color: #eee;
+  border-radius: 4px;
+}
+nav a:visited, a:link {
+  color: #607D8B;
+}
+nav a:hover {
+  color: #039be5;
+  background-color: #CFD8DC;
+}
+nav a.active {
+  color: #039be5;
+}
\ No newline at end of file
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/app.component.html b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/app.component.html
new file mode 100755
index 00000000..dc12d499
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/app.component.html
@@ -0,0 +1,21 @@
+<main>
+    <h1>{{title}}</h1>
+    <h2>My Heroes</h2>
+    <ul class="heroes">
+        <li *ngFor="let hero of heroes"
+            [class.selected]="hero === selectedHero"
+            (click)="onSelect(hero)">
+            <span class="badge">{{hero.id}}</span> {{hero.name}}
+        </li>
+    </ul>
+    
+    <div *ngIf="selectedHero">
+        <h2>{{selectedHero.name}} details!</h2>
+        <div><label>id: </label>{{selectedHero.id}}</div>
+        <div>
+            <label>name: </label>
+            <input [(ngModel)]="selectedHero.name" placeholder="name"/>
+        </div>
+    </div>  
+   
+</main>
\ No newline at end of file
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/app.component.js b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/app.component.js
new file mode 100755
index 00000000..671d0a3b
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/app.component.js
@@ -0,0 +1,36 @@
+"use strict";
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __metadata = (this && this.__metadata) || function (k, v) {
+    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
+};
+var core_1 = require('@angular/core');
+var Hero = (function () {
+    function Hero() {
+    }
+    return Hero;
+}());
+exports.Hero = Hero;
+var AppComponent = (function () {
+    function AppComponent() {
+        this.title = 'Tour of Heroes';
+        this.hero = {
+            id: 1,
+            name: 'Windstorm'
+        };
+    }
+    AppComponent = __decorate([
+        core_1.Component({
+            selector: 'my-app',
+            template: "\n  <h1>{{title}}</h1>\n  <h2>{{hero.name}} details!</h2>\n  <div><label>id: </label>{{hero.id}}</div>\n  <div>\n    <label>name: </label>\n    <input value=\"{{hero.name}}\" placeholder=\"name\">\n  </div>\n  "
+        }), 
+        __metadata('design:paramtypes', [])
+    ], AppComponent);
+    return AppComponent;
+}());
+exports.AppComponent = AppComponent;
+//# sourceMappingURL=app.component.js.map
\ No newline at end of file
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/app.component.js.map b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/app.component.js.map
new file mode 100755
index 00000000..9b786aa3
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/app.component.js.map
@@ -0,0 +1 @@
+{"version":3,"file":"app.component.js","sourceRoot":"","sources":["app.component.ts"],"names":[],"mappings":";;;;;;;;;;AAAA,qBAA0B,eAAe,CAAC,CAAA;AAC1C;IAAA;IAGA,CAAC;IAAD,WAAC;AAAD,CAAC,AAHD,IAGC;AAHY,YAAI,OAGhB,CAAA;AAcD;IAAA;QACI,UAAK,GAAG,gBAAgB,CAAC;QACzB,SAAI,GAAS;YACT,EAAE,EAAE,CAAC;YACL,IAAI,EAAE,WAAW;SACpB,CAAC;IACN,CAAC;IAnBD;QAAC,gBAAS,CAAC;YACT,QAAQ,EAAE,QAAQ;YAClB,QAAQ,EAAC,oNAQR;SAEF,CAAC;;oBAAA;IAOF,mBAAC;AAAD,CAAC,AAND,IAMC;AANY,oBAAY,eAMxB,CAAA"}
\ No newline at end of file
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/app.component.spec.ts b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/app.component.spec.ts
new file mode 100755
index 00000000..87beafad
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/app.component.spec.ts
@@ -0,0 +1,11 @@
+import { TestBed } from '@angular/core/testing';
+import { AppComponent } from './app.component';
+describe('App', () => {
+    beforeEach(() => {
+        TestBed.configureTestingModule({ declarations: [AppComponent]});
+    });
+    it ('should work', () => {
+        let fixture = TestBed.createComponent(AppComponent);
+        expect(fixture.componentInstance instanceof AppComponent).toBe(true, 'should create AppComponent');
+    });
+});
\ No newline at end of file
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/app.component.ts b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/app.component.ts
new file mode 100644
index 00000000..be140e41
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/app.component.ts
@@ -0,0 +1,16 @@
+import { Component } from '@angular/core';
+@Component({
+    selector: 'my-app',
+    template: `
+        <h1>{{title}}</h1>
+        <nav>
+            <a routerLink="/dashboard" routerLinkActive="active">Dashboard</a>
+            <a routerLink="/heroes" routerLinkActive="active">Heroes</a>
+        </nav>
+        <router-outlet></router-outlet>
+    `,
+    styleUrls: ['./app.component.css'],
+})
+export class AppComponent {
+    title = 'Tour of Heroes';
+}
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/app.module.js b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/app.module.js
new file mode 100755
index 00000000..5091eb05
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/app.module.js
@@ -0,0 +1,34 @@
+"use strict";
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __metadata = (this && this.__metadata) || function (k, v) {
+    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
+};
+var core_1 = require('@angular/core');
+var platform_browser_1 = require('@angular/platform-browser');
+var forms_1 = require('@angular/forms');
+var app_component_1 = require('./app.component');
+var AppModule = (function () {
+    function AppModule() {
+    }
+    AppModule = __decorate([
+        core_1.NgModule({
+            imports: [
+                platform_browser_1.BrowserModule,
+                forms_1.FormsModule
+            ],
+            declarations: [
+                app_component_1.AppComponent
+            ],
+            bootstrap: [app_component_1.AppComponent]
+        }), 
+        __metadata('design:paramtypes', [])
+    ], AppModule);
+    return AppModule;
+}());
+exports.AppModule = AppModule;
+//# sourceMappingURL=app.module.js.map
\ No newline at end of file
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/app.module.js.map b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/app.module.js.map
new file mode 100755
index 00000000..8a720fb5
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/app.module.js.map
@@ -0,0 +1 @@
+{"version":3,"file":"app.module.js","sourceRoot":"","sources":["app.module.ts"],"names":[],"mappings":";;;;;;;;;;AAAA,qBAA8B,eAAe,CAAC,CAAA;AAC9C,iCAA8B,2BAA2B,CAAC,CAAA;AAC1D,sBAA8B,gBAAgB,CAAC,CAAA;AAC/C,8BAA8B,iBAAiB,CAAC,CAAA;AAWhD;IAAA;IAAyB,CAAC;IAV1B;QAAC,eAAQ,CAAC;YACR,OAAO,EAAE;gBACP,gCAAa;gBACb,mBAAW;aACZ;YACD,YAAY,EAAE;gBACZ,4BAAY;aACb;YACD,SAAS,EAAE,CAAE,4BAAY,CAAE;SAC5B,CAAC;;iBAAA;IACuB,gBAAC;AAAD,CAAC,AAA1B,IAA0B;AAAb,iBAAS,YAAI,CAAA"}
\ No newline at end of file
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/app.module.ts b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/app.module.ts
new file mode 100755
index 00000000..a26157c1
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/app.module.ts
@@ -0,0 +1,38 @@
+import { NgModule }             from '@angular/core';
+import { BrowserModule }        from '@angular/platform-browser';
+import { FormsModule }          from '@angular/forms';
+import { HttpModule }           from '@angular/http';
+import { AppRoutingModule }     from './app-routing.module';
+// Imports for loading & configuring the in-memory web api
+import { InMemoryWebApiModule } from 'angular-in-memory-web-api';
+import { InMemoryDataService }  from './in-memory-data.service';
+import { AppComponent }         from './app.component';
+import { DashboardComponent }   from './dashboard.component';
+import { HeroesComponent }      from './heroes.component';
+import { HeroDetailComponent }  from './hero-detail.component';
+import { HeroEditingComponent } from './hero-editing.component';
+import { HeroService }          from './hero.service';
+import { HeroSearchComponent }  from './hero-search.component';
+import { ReactiveFormsModule }  from '@angular/forms';  // <-- #1 import module
+
+@NgModule({
+    imports: [
+        BrowserModule,
+        FormsModule,
+        HttpModule,
+        InMemoryWebApiModule.forRoot(InMemoryDataService),
+        AppRoutingModule,
+        ReactiveFormsModule // <-- #2 add to Angular module imports
+    ],
+    declarations: [
+        AppComponent,
+        DashboardComponent,
+        HeroDetailComponent,
+        HeroEditingComponent,
+        HeroesComponent,
+        HeroSearchComponent
+    ],
+    providers: [ HeroService ],
+    bootstrap: [ AppComponent ]
+})
+export class AppModule { }
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/dashboard.component.css b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/dashboard.component.css
new file mode 100644
index 00000000..ca2e78f7
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/dashboard.component.css
@@ -0,0 +1,62 @@
+
+[class*='col-'] {
+  float: left;
+  padding-right: 20px;
+  padding-bottom: 20px;
+}
+[class*='col-']:last-of-type {
+  padding-right: 0;
+}
+a {
+  text-decoration: none;
+}
+*, *:after, *:before {
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+}
+h3 {
+  text-align: center; margin-bottom: 0;
+}
+h4 {
+  position: relative;
+}
+.grid {
+  margin: 0;
+}
+.col-1-4 {
+  width: 25%;
+}
+.module {
+  padding: 20px;
+  text-align: center;
+  color: #eee;
+  max-height: 120px;
+  min-width: 120px;
+  background-color: #607D8B;
+  border-radius: 2px;
+}
+.module:hover {
+  background-color: #EEE;
+  cursor: pointer;
+  color: #607d8b;
+}
+.grid-pad {
+  padding: 10px 0;
+}
+.grid-pad > [class*='col-']:last-of-type {
+  padding-right: 20px;
+}
+@media (max-width: 600px) {
+  .module {
+    font-size: 10px;
+    max-height: 75px; }
+}
+@media (max-width: 1024px) {
+  .grid {
+    margin: 0;
+  }
+  .module {
+    min-width: 60px;
+  }
+}
\ No newline at end of file
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/dashboard.component.html b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/dashboard.component.html
new file mode 100644
index 00000000..987b76dd
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/dashboard.component.html
@@ -0,0 +1,9 @@
+<h3>Top Heroes</h3>
+<div class="grid grid-pad">
+    <a *ngFor="let hero of heroes"  [routerLink]="['/detail', hero.id]"  class="col-1-4">
+        <div class="module hero">
+            <h4>{{hero.name}}</h4>
+        </div>
+    </a>
+</div>
+<hero-search></hero-search>
\ No newline at end of file
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/dashboard.component.ts b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/dashboard.component.ts
new file mode 100644
index 00000000..f2cfc0f6
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/dashboard.component.ts
@@ -0,0 +1,21 @@
+import { Component, OnInit } from '@angular/core';
+import { Hero } from './hero';
+import { HeroService } from './hero.service';
+
+@Component({
+    //moduleId: module.id,
+    selector: 'my-dashboard',
+    templateUrl: './dashboard.component.html',
+    styleUrls: [ './dashboard.component.css' ]
+})
+export class DashboardComponent implements OnInit {
+
+    heroes: Hero[] = [];
+
+    constructor(private heroService: HeroService) { }
+
+    ngOnInit(): void {
+        this.heroService.getHeroes()
+            .then(heroes => this.heroes = heroes.slice(1, 5));
+    }
+}
\ No newline at end of file
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/hero-detail.component.css b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/hero-detail.component.css
new file mode 100644
index 00000000..b75cb026
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/hero-detail.component.css
@@ -0,0 +1,29 @@
+label {
+  display: inline-block;
+  width: 3em;
+  margin: .5em 0;
+  color: #607D8B;
+  font-weight: bold;
+}
+input {
+  height: 2em;
+  font-size: 1em;
+  padding-left: .4em;
+}
+button {
+  margin-top: 20px;
+  font-family: Arial;
+  background-color: #eee;
+  border: none;
+  padding: 5px 10px;
+  border-radius: 4px;
+  cursor: pointer; cursor: hand;
+}
+button:hover {
+  background-color: #cfd8dc;
+}
+button:disabled {
+  background-color: #eee;
+  color: #ccc; 
+  cursor: auto;
+}
\ No newline at end of file
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/hero-detail.component.html b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/hero-detail.component.html
new file mode 100644
index 00000000..0e4157fb
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/hero-detail.component.html
@@ -0,0 +1,17 @@
+<section>    
+    <div *ngIf="hero">
+        <h2>{{hero.name}} details!</h2>
+        <div>
+            <label>id:</label>{{hero.id}}
+        </div>
+        <div>
+            <label>name:</label>{{hero.name}}
+        </div>
+        <div>
+            <label>skill:</label>{{hero.skill}}
+        </div>    
+        <div>
+            <img src="{{hero.avatar}}">
+        </div>  
+    </div>
+</section>    
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/hero-detail.component.ts b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/hero-detail.component.ts
new file mode 100644
index 00000000..038b4de2
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/hero-detail.component.ts
@@ -0,0 +1,35 @@
+import { Component, Input, OnInit } from '@angular/core';
+import { ActivatedRoute, Params }   from '@angular/router';
+import { Location }                 from '@angular/common';
+import { HeroService }  from './hero.service';
+import { Hero }         from './hero';
+import 'rxjs/add/operator/switchMap';
+import { FormBuilder, FormGroup, Validators  } from '@angular/forms';
+
+@Component({
+    //moduleId: module.id,
+    selector: 'my-hero-detail',
+    templateUrl: './hero-detail.component.html'
+
+})
+export class HeroDetailComponent implements OnInit {
+    @Input() hero: Hero;
+    
+    constructor(
+        private heroService: HeroService,
+        private route: ActivatedRoute,
+        private location: Location
+    ) {}
+
+    ngOnInit(): void {
+        this.route.params
+            .switchMap((params: Params) => this.heroService.getHero(+params['id']))
+            .subscribe(hero => {
+                this.hero = hero;
+            });
+   }
+
+    goBack(): void {
+        this.location.back();
+    }
+}
\ No newline at end of file
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/hero-editing.component.html b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/hero-editing.component.html
new file mode 100644
index 00000000..1b0629ef
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/hero-editing.component.html
@@ -0,0 +1,34 @@
+<div *ngIf="hero">
+    <h2>{{hero.name}} details!</h2>
+    <h3><i>FormControl in a FormGroup</i></h3>
+    <form [formGroup]="heroForm" novalidate>
+        <div class="form-group">
+            <label class="center-block">Id:
+                <input class="form-control" formControlName="id">
+            </label>
+        </div>   
+        <div class="form-group">
+            <label class="center-block">Name:
+                <input class="form-control" formControlName="name">
+                    <div *ngIf="heroForm.controls['name'].invalid && heroForm.controls['name'].touched">
+                        <span class="error-message">Name is required</span>
+                    </div>
+            </label>
+        </div>
+        <div class="form-group">
+            <label class="center-block">Skill:
+                <input class="form-control" formControlName="skill">
+            </label>
+        </div>  
+        <div class="form-group">
+            <label class="center-block">Avatar:
+                <img src="{{hero?.avatar}}">
+            </label>
+        </div>
+        <button (click)="goBack()">Back</button>
+        <button (click)="save()">Save</button>
+    </form>
+</div>
+
+<p>Form value: {{ heroForm.value | json }}</p>
+<p>Form status: {{ heroForm.status | json }}</p>
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/hero-editing.component.ts b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/hero-editing.component.ts
new file mode 100644
index 00000000..67246999
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/hero-editing.component.ts
@@ -0,0 +1,62 @@
+import { Component, Input, OnInit } from '@angular/core';
+import { ActivatedRoute, Params }   from '@angular/router';
+import { Location }                 from '@angular/common';
+import { HeroService }  from './hero.service';
+import { Hero }         from './hero';
+import 'rxjs/add/operator/switchMap';
+import { FormGroup,  Validators, FormBuilder} from '@angular/forms';
+
+@Component({
+    selector: 'my-hero-editing',
+    templateUrl: './hero-editing.component.html'
+
+})
+export class HeroEditingComponent {
+    heroForm: FormGroup; 
+    @Input() hero: Hero;
+    constructor(
+        private heroService: HeroService,
+        private route: ActivatedRoute,
+        private location: Location,
+        private fb: FormBuilder
+    ) {}
+    ngOnInit(): void {
+        this.createForm();
+        this.route.params
+            .switchMap((params: Params) => this.heroService.getHero(+params['id']))
+            .subscribe(hero => {
+                this.hero = hero;
+                this.heroForm = this.fb.group({
+                    id: this.hero.id,
+                    name: this.hero.name,
+                    skill: this.hero.skill,
+                    avatar: this.hero.avatar
+                });
+        
+            });
+    }
+    
+    createForm() {
+        this.heroForm = this.fb.group({
+            id: '',
+            name: ['', Validators.required],
+            skill: '',
+            avatar: ''
+        });
+    }
+    goBack(): void {
+        this.location.back();
+    }
+    save(): void {
+        let formModel = this.heroForm.value;
+        let saveHero: Hero = {
+            id: this.hero.id,
+            name: formModel.name as string,
+            skill: formModel.skill as string, 
+            avatar: this.hero.avatar
+        };
+        this.heroService
+            .update(saveHero)
+            .then(() => this.goBack());
+    }
+}
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/hero-search.component.css b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/hero-search.component.css
new file mode 100644
index 00000000..5f3c005e
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/hero-search.component.css
@@ -0,0 +1,18 @@
+.search-result{
+  border-bottom: 1px solid gray;
+  border-left: 1px solid gray;
+  border-right: 1px solid gray;
+  width:195px;
+  height: 16px;
+  padding: 5px;
+  background-color: white;
+  cursor: pointer;
+}
+.search-result:hover {
+  color: #eee;
+  background-color: #607D8B;
+}
+#search-box{
+  width: 200px;
+  height: 20px;
+}
\ No newline at end of file
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/hero-search.component.html b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/hero-search.component.html
new file mode 100644
index 00000000..7f8711ba
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/hero-search.component.html
@@ -0,0 +1,10 @@
+<div id="search-component">
+    <h4>Hero Search</h4>
+    <input #searchBox id="search-box" (keyup)="search(searchBox.value)" />
+    <div>
+        <div *ngFor="let hero of heroes | async"
+            (click)="gotoDetail(hero)" class="search-result" >
+            {{hero.name}}
+        </div>
+    </div>
+</div>
\ No newline at end of file
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/hero-search.component.ts b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/hero-search.component.ts
new file mode 100644
index 00000000..0d8b7b0b
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/hero-search.component.ts
@@ -0,0 +1,49 @@
+import { Component, OnInit } from '@angular/core';
+import { Router }            from '@angular/router';
+import { Observable }        from 'rxjs/Observable';
+import { Subject }           from 'rxjs/Subject';
+// Observable class extensions
+import 'rxjs/add/observable/of';
+// Observable operators
+import 'rxjs/add/operator/catch';
+import 'rxjs/add/operator/debounceTime';
+import 'rxjs/add/operator/distinctUntilChanged';
+import { HeroSearchService } from './hero-search.service';
+import { Hero } from './hero';
+@Component({
+    //moduleId: module.id,
+    selector: 'hero-search',
+    templateUrl: './hero-search.component.html',
+    styleUrls: [ './hero-search.component.css' ],
+    providers: [HeroSearchService]
+})
+export class HeroSearchComponent implements OnInit {
+    heroes: Observable<Hero[]>;
+    private searchTerms = new Subject<string>();
+    constructor(
+        private heroSearchService: HeroSearchService,
+        private router: Router) {}
+        // Push a search term into the observable stream.
+        search(term: string): void {
+            this.searchTerms.next(term);
+        }
+    ngOnInit(): void {
+        this.heroes = this.searchTerms
+            .debounceTime(300)        // wait 300ms after each keystroke before considering the term
+            .distinctUntilChanged()   // ignore if next search term is same as previous
+            .switchMap(term => term   // switch to new observable each time the term changes
+                // return the http search observable
+                ? this.heroSearchService.search(term)
+                // or the observable of empty heroes if there was no search term
+                : Observable.of<Hero[]>([]))
+            .catch(error => {
+                // TODO: add real error handling
+                console.log(error);
+                return Observable.of<Hero[]>([]);
+            });
+    }
+    gotoDetail(hero: Hero): void {
+        let link = ['/detail', hero.id];
+        this.router.navigate(link);
+    }
+}
\ No newline at end of file
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/hero-search.service.ts b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/hero-search.service.ts
new file mode 100644
index 00000000..18b7a25e
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/hero-search.service.ts
@@ -0,0 +1,14 @@
+import { Injectable } from '@angular/core';
+import { Http }       from '@angular/http';
+import { Observable }     from 'rxjs/Observable';
+import 'rxjs/add/operator/map';
+import { Hero }           from './hero';
+@Injectable()
+export class HeroSearchService {
+    constructor(private http: Http) {}
+    search(term: string): Observable<Hero[]> {
+        return this.http
+            .get(`app/heroes/?name=${term}`)
+            .map(response => response.json().data as Hero[]);
+    }
+}
\ No newline at end of file
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/hero.service.ts b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/hero.service.ts
new file mode 100644
index 00000000..4cb3c4d2
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/hero.service.ts
@@ -0,0 +1,52 @@
+import { Injectable } from '@angular/core';
+import { Headers, Http } from '@angular/http';
+import 'rxjs/add/operator/toPromise';
+import { Hero } from './hero';
+//import { HEROES } from './mock-heroes';
+@Injectable()
+export class HeroService {
+    private heroesUrl = 'api/heroes';  // URL to web api
+    private headers = new Headers({'Content-Type': 'application/json'});
+    
+    constructor(private http: Http) { }
+    
+    getHeroes(): Promise<Hero[]> {
+        return this.http.get(this.heroesUrl)
+            .toPromise()
+            .then(response => response.json().data as Hero[])
+            .catch(this.handleError);
+    }
+    private handleError(error: any): Promise<any> {
+        return Promise.reject(error.message || error);
+    }
+    getHero(id: number): Promise<Hero> {
+        const url = `${this.heroesUrl}/${id}`;
+        return this.http.get(url)
+            .toPromise()
+            .then(response => response.json().data as Hero)
+            .catch(this.handleError);
+    }
+    update(hero: Hero): Promise<Hero> {
+        const url = `${this.heroesUrl}/${hero.id}`;
+                console.log(url + "  " + JSON.stringify(hero) );
+        return this.http
+            .put(url, JSON.stringify(hero), {headers: this.headers})
+            .toPromise()
+            .then(() => hero)
+            .catch(this.handleError);
+    }
+    create(name: string): Promise<Hero> {
+        return this.http
+        .post(this.heroesUrl, JSON.stringify({name: name}), {headers: this.headers})
+        .toPromise()
+        .then(res => res.json().data)
+        .catch(this.handleError);
+    }
+    delete(id: number): Promise<void> {
+        const url = `${this.heroesUrl}/${id}`;
+        return this.http.delete(url, {headers: this.headers})
+            .toPromise()
+            .then(() => null)
+            .catch(this.handleError);
+    }
+}
\ No newline at end of file
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/hero.ts b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/hero.ts
new file mode 100644
index 00000000..feefc55f
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/hero.ts
@@ -0,0 +1,6 @@
+export class Hero {
+    id: number;
+    name: string;
+    skill: string;
+    avatar: string;
+}
\ No newline at end of file
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/heroes.component.css b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/heroes.component.css
new file mode 100644
index 00000000..f4bab6c8
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/heroes.component.css
@@ -0,0 +1,57 @@
+.selected {
+  background-color: #CFD8DC !important;
+  color: white;
+}
+.heroes {
+  margin: 0 0 2em 0;
+  list-style-type: none;
+  padding: 0;
+  width: 15em;
+}
+.heroes li {
+  cursor: pointer;
+  position: relative;
+  left: 0;
+  background-color: #EEE;
+  margin: .5em;
+  padding: .3em 0;
+  height: 1.6em;
+  border-radius: 4px;
+}
+.heroes li.selected:hover {
+  background-color: #BBD8DC !important;
+  color: white;
+}
+.heroes li:hover {
+  color: #607D8B;
+  background-color: #DDD;
+  left: .1em;
+}
+.heroes .text {
+  position: relative;
+  top: -3px;
+}
+.heroes .badge {
+  display: inline-block;
+  font-size: small;
+  color: white;
+  padding: 0.8em 0.7em 0 0.7em;
+  background-color: #607D8B;
+  line-height: 1em;
+  position: relative;
+  left: -1px;
+  top: -4px;
+  height: 1.8em;
+  margin-right: .8em;
+  border-radius: 4px 0 0 4px;
+}
+.edit_button {
+  float: right;
+}
+button.delete {
+  float:right;
+  margin-top: 2px;
+  margin-right: .8em;
+  background-color: gray !important;
+  color:white;
+}
\ No newline at end of file
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/heroes.component.html b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/heroes.component.html
new file mode 100644
index 00000000..511fe162
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/heroes.component.html
@@ -0,0 +1,27 @@
+<section>
+    <h1>{{title}}</h1>
+    <h2>My Heroes</h2>
+    <ul class="heroes">
+        <li *ngFor="let hero of heroes"
+            [class.selected]="hero === selectedHero"
+            (click)="onSelect(hero)">
+            <span class="badge">{{hero.id}}</span> {{hero.name}}  
+            <button class="delete"
+                (click)="delete(hero); $event.stopPropagation()">x</button>
+        </li>
+    </ul>
+    <div *ngIf="selectedHero">
+        <h2>
+            {{selectedHero.name | uppercase}} is my hero
+        </h2>
+        <button (click)="gotoDetail()">View Details</button>
+        <button (click)="gotoEditing()">Editing</button>
+    </div>
+    <div>
+        <label>Hero name:</label> <input #heroName />
+        <button (click)="add(heroName.value); heroName.value=''">
+            Add
+        </button>
+    </div>
+    <my-hero-editing [hero]="editHero"></my-hero-editing>
+</section>
\ No newline at end of file
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/heroes.component.ts b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/heroes.component.ts
new file mode 100755
index 00000000..b4589626
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/heroes.component.ts
@@ -0,0 +1,58 @@
+import { Component, OnInit } from '@angular/core';
+import { Hero } from './hero';
+import { HeroService } from './hero.service';
+import { Router } from '@angular/router';
+
+
+@Component({
+    // moduleId: module.id,
+    selector: 'my-heroes',
+    templateUrl: 'heroes.component.html',
+    styleUrls: ['heroes.component.css'],
+    providers: [HeroService]
+})
+export class HeroesComponent implements OnInit {
+    heroes: Hero[];
+    selectedHero: Hero;
+
+    constructor(
+        private router: Router,
+        private heroService: HeroService) { }
+
+    getHeroes(): void {
+        this.heroService.getHeroes().then(heroes => this.heroes = heroes);
+    }
+
+    ngOnInit(): void {
+        this.getHeroes();
+    }
+
+    onSelect(hero: Hero): void {
+        this.selectedHero = hero;
+    }
+
+    gotoDetail(): void {
+        this.router.navigate(['/detail', this.selectedHero.id]);
+    }
+
+    gotoEditing(): void {
+        this.router.navigate(['/editing', this.selectedHero.id]);
+    }
+    add(name: string): void {
+        name = name.trim();
+        if (!name) { return; }
+        this.heroService.create(name)
+            .then(hero => {
+                this.heroes.push(hero);
+                this.selectedHero = null;
+            });
+    }
+    delete(hero: Hero): void {
+        this.heroService
+            .delete(hero.id)
+            .then(() => {
+                this.heroes = this.heroes.filter(h => h !== hero);
+                if (this.selectedHero === hero) { this.selectedHero = null; }
+             });
+    }
+}
\ No newline at end of file
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/in-memory-data.service.ts b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/in-memory-data.service.ts
new file mode 100644
index 00000000..e48c6f8e
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/app/in-memory-data.service.ts
@@ -0,0 +1,19 @@
+import { InMemoryDbService } from 'angular-in-memory-web-api';
+export class InMemoryDataService implements InMemoryDbService {
+  createDb() {
+    let heroes = [
+        {id: 11, name: 'Mr. Nice', skill: 'Freeze time', avatar: '/src/assets/1.jpg'},
+        {id: 12, name: 'Narco', skill: 'Warm', avatar: '/src/assets/2.jpg'},
+        {id: 13, name: 'Bombasto', skill: 'Telepathy', avatar: '/src/assets/3.jpg'},
+        {id: 14, name: 'Celeritas', skill: 'Telekines', avatar: '/src/assets/4.jpg'},
+        {id: 15, name: 'Magneta', skill: 'Empath', avatar: '/src/assets/5.jpg'},
+        {id: 16, name: 'RubberMan', skill: 'Flights', avatar: '/src/assets/6.jpg'},
+        {id: 17, name: 'Dynama', skill: 'High jump', avatar: '/src/assets/7.jpg'},
+        {id: 18, name: 'Dr IQ', skill: 'Laud voice', avatar: '/src/assets/8.jpg'},
+        {id: 19, name: 'Magma', skill: 'Fireball', avatar: '/src/assets/9.jpg'},
+        {id: 20, name: 'Tornado', skill: 'Teleport', avatar: '/src/assets/10.jpg'},
+        {id: 21, name: 'Celeb', skill: 'Cupid power', avatar: '/src/assets/11.jpg'}
+    ];
+    return {heroes};
+  }
+}
\ No newline at end of file
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/assets/1.jpg b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/assets/1.jpg
new file mode 100644
index 00000000..05e02a19
Binary files /dev/null and b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/assets/1.jpg differ
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/assets/10.jpg b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/assets/10.jpg
new file mode 100644
index 00000000..04619330
Binary files /dev/null and b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/assets/10.jpg differ
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/assets/11.jpg b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/assets/11.jpg
new file mode 100644
index 00000000..3409a4e7
Binary files /dev/null and b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/assets/11.jpg differ
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/assets/12.jpg b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/assets/12.jpg
new file mode 100644
index 00000000..589596ad
Binary files /dev/null and b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/assets/12.jpg differ
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/assets/2.jpg b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/assets/2.jpg
new file mode 100644
index 00000000..1dd84b14
Binary files /dev/null and b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/assets/2.jpg differ
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/assets/3.jpg b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/assets/3.jpg
new file mode 100644
index 00000000..e74c57c1
Binary files /dev/null and b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/assets/3.jpg differ
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/assets/4.jpg b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/assets/4.jpg
new file mode 100644
index 00000000..dc274a9d
Binary files /dev/null and b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/assets/4.jpg differ
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/assets/5.jpg b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/assets/5.jpg
new file mode 100644
index 00000000..6bc02307
Binary files /dev/null and b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/assets/5.jpg differ
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/assets/6.jpg b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/assets/6.jpg
new file mode 100644
index 00000000..36da7c68
Binary files /dev/null and b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/assets/6.jpg differ
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/assets/7.jpg b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/assets/7.jpg
new file mode 100644
index 00000000..2160b6aa
Binary files /dev/null and b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/assets/7.jpg differ
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/assets/8.jpg b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/assets/8.jpg
new file mode 100644
index 00000000..4f50c142
Binary files /dev/null and b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/assets/8.jpg differ
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/assets/9.jpg b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/assets/9.jpg
new file mode 100644
index 00000000..dc45e22e
Binary files /dev/null and b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/assets/9.jpg differ
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/index.html b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/index.html
new file mode 100755
index 00000000..346565bc
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/index.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <title>Angular With Webpack</title>
+        <meta charset="UTF-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1">
+        <base href="/">
+        <link rel="stylesheet" href="styles.css">
+    </head>
+    <body>
+        <my-app>Loading...</my-app>
+    </body>
+</html>
\ No newline at end of file
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/main.ts b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/main.ts
new file mode 100755
index 00000000..fb336317
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/main.ts
@@ -0,0 +1,7 @@
+import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
+import { enableProdMode } from '@angular/core';
+import { AppModule } from './app/app.module';
+if (process.env.ENV === 'production') {
+    enableProdMode();
+}
+platformBrowserDynamic().bootstrapModule(AppModule);
\ No newline at end of file
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/polyfills.ts b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/polyfills.ts
new file mode 100755
index 00000000..fa217c85
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/polyfills.ts
@@ -0,0 +1,11 @@
+import 'core-js/es6';
+import 'core-js/es7/reflect';
+require('zone.js/dist/zone');
+
+if (process.env.ENV === 'production') {
+    // Production
+} else {
+    // Development and test
+    Error['stackTraceLimit'] = Infinity;
+    require('zone.js/dist/long-stack-trace-zone');
+}
\ No newline at end of file
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/styles.css b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/styles.css
new file mode 100755
index 00000000..779c1581
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/styles.css
@@ -0,0 +1,23 @@
+/* Master Styles */
+h1 {
+  color: #369;
+  font-family: Arial, Helvetica, sans-serif;
+  font-size: 250%;
+}
+h2, h3 {
+  color: #444;
+  font-family: Arial, Helvetica, sans-serif;
+  font-weight: lighter;
+}
+body {
+  margin: 2em;
+}
+body, input[text], button {
+  color: #888;
+  font-family: Cambria, Georgia;
+}
+/* . . . */
+/* everywhere else */
+* {
+  font-family: Arial, Helvetica, sans-serif;
+}
\ No newline at end of file
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/vendor.ts b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/vendor.ts
new file mode 100755
index 00000000..efada3e3
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/src/vendor.ts
@@ -0,0 +1,11 @@
+// Angular
+import '@angular/platform-browser';
+import '@angular/platform-browser-dynamic';
+import '@angular/core';
+import '@angular/common';
+import '@angular/http';
+import '@angular/router';
+// RxJS
+import 'rxjs';
+// Other vendors for example jQuery, Lodash or Bootstrap
+// You can import js, ts, css, sass, ...
\ No newline at end of file
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/tsconfig.json b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/tsconfig.json
new file mode 100755
index 00000000..77b380c5
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/tsconfig.json
@@ -0,0 +1,13 @@
+{
+  "compilerOptions": {
+    "target": "es5",
+    "module": "commonjs",
+    "moduleResolution": "node",
+    "sourceMap": true,
+    "emitDecoratorMetadata": true,
+    "experimentalDecorators": true,
+    "lib": ["es2015", "dom"],
+    "noImplicitAny": true,
+    "suppressImplicitAnyIndexErrors": true
+  }
+}
\ No newline at end of file
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/tslint.json b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/tslint.json
new file mode 100755
index 00000000..5cf07f0c
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/tslint.json
@@ -0,0 +1,93 @@
+{
+  "rules": {
+    "class-name": true,
+    "comment-format": [
+      true,
+      "check-space"
+    ],
+    "curly": true,
+    "eofline": true,
+    "forin": true,
+    "indent": [
+      true,
+      "spaces"
+    ],
+    "label-position": true,
+    "label-undefined": true,
+    "max-line-length": [
+      true,
+      140
+    ],
+    "member-access": false,
+    "member-ordering": [
+      true,
+      "static-before-instance",
+      "variables-before-functions"
+    ],
+    "no-arg": true,
+    "no-bitwise": true,
+    "no-console": [
+      true,
+      "debug",
+      "info",
+      "time",
+      "timeEnd",
+      "trace"
+    ],
+    "no-construct": true,
+    "no-debugger": true,
+    "no-duplicate-key": true,
+    "no-duplicate-variable": true,
+    "no-empty": false,
+    "no-eval": true,
+    "no-inferrable-types": true,
+    "no-shadowed-variable": true,
+    "no-string-literal": false,
+    "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,
+    "one-line": [
+      true,
+      "check-open-brace",
+      "check-catch",
+      "check-else",
+      "check-whitespace"
+    ],
+    "quotemark": [
+      true,
+      "single"
+    ],
+    "radix": true,
+    "semicolon": [
+      "always"
+    ],
+    "triple-equals": [
+      true,
+      "allow-null-check"
+    ],
+    "typedef-whitespace": [
+      true,
+      {
+        "call-signature": "nospace",
+        "index-signature": "nospace",
+        "parameter": "nospace",
+        "property-declaration": "nospace",
+        "variable-declaration": "nospace"
+      }
+    ],
+    "variable-name": false,
+    "whitespace": [
+      true,
+      "check-branch",
+      "check-decl",
+      "check-operator",
+      "check-separator",
+      "check-type"
+    ]
+  }
+}
diff --git a/homeworks/igor.sokurenko_praetorianlive/angular-test-project/webpack.config.js b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/webpack.config.js
new file mode 100755
index 00000000..0715c306
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/angular-test-project/webpack.config.js
@@ -0,0 +1 @@
+module.exports = require('./config/webpack.dev.js');
\ No newline at end of file
diff --git a/homeworks/igor.sokurenko_praetorianlive/homework_8/README.md b/homeworks/igor.sokurenko_praetorianlive/homework_8/README.md
new file mode 100644
index 00000000..c3c95b27
--- /dev/null
+++ b/homeworks/igor.sokurenko_praetorianlive/homework_8/README.md
@@ -0,0 +1,3 @@
+# tictactoe.github.io
+https://github.com/praetorianlive/tictactoe.github.io
+https://praetorianlive.github.io/tictactoe.github.io/
\ No newline at end of file