diff --git a/angular-cli.json b/angular-cli.json
index b848f7c..186a019 100644
--- a/angular-cli.json
+++ b/angular-cli.json
@@ -18,7 +18,8 @@
       "tsconfig": "tsconfig.json",
       "prefix": "app",
       "styles": [
-        "styles.css"
+        "styles.css",
+        "../node_modules/bootstrap/dist/css/bootstrap.min.css"
       ],
       "scripts": [],
       "environments": {
diff --git a/package.json b/package.json
index 4d809d7..6af0c8e 100644
--- a/package.json
+++ b/package.json
@@ -20,6 +20,7 @@
     "@angular/platform-browser": "^2.3.1",
     "@angular/platform-browser-dynamic": "^2.3.1",
     "@angular/router": "^3.3.1",
+    "bootstrap": "^3.3.7",
     "core-js": "^2.4.1",
     "rxjs": "^5.0.1",
     "ts-helpers": "^1.1.1",
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index 2e78886..bd46cbb 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -15,5 +15,3 @@ alert('sss');
 
 }
 
-
-}
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 67a1a23..a3e13f5 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -2,20 +2,33 @@ import { BrowserModule } from '@angular/platform-browser';
 import { NgModule } from '@angular/core';
 import { FormsModule } from '@angular/forms';
 import { HttpModule } from '@angular/http';
+import { RouterModule, Routes } from '@angular/router';
 
 import { AppComponent } from './app.component';
 import { innerComponent } from './inner/inner.component';
+import { RoutingComponent } from './routing.component';
+
+const routers: Routes = [
+  {path : '', redirectTo : '/Inner', pathMatch:'full'},
+  { path: 'Inner', component: innerComponent },
+  { path: 'Outer', component: AppComponent },
+  { path: '**', redirectTo: '/Inner', pathMatch: 'full' }
+]
 
 @NgModule({
   declarations: [
-    AppComponent, innerComponent
+    AppComponent,
+    innerComponent,
+    RoutingComponent
   ],
   imports: [
     BrowserModule,
     FormsModule,
-    HttpModule
+    HttpModule,
+    RouterModule.forRoot(routers)
   ],
   providers: [],
-  bootstrap: [AppComponent]
+  //bootstrap: [AppComponent]
+  bootstrap: [RoutingComponent]
 })
 export class AppModule { }
diff --git a/src/app/inner/inner.component.html b/src/app/inner/inner.component.html
index da28161..ee59dd1 100644
--- a/src/app/inner/inner.component.html
+++ b/src/app/inner/inner.component.html
@@ -15,13 +15,13 @@ <h2>NgStyle</h2>
 
 <hr/>
 <h2>*ngFor</h2>
-<button (click)="addItems()"> Click Me</button>
+<button (click)="addItems()"> Click Me</button> 
 <input type="text" [(ngModel)]="itemName" placeholder="Typing..."/>
 <div *ngFor="let eachItem of repeatItems">
 {{itemName}}
 {{eachItem}}
     {{title}}
-</p>
+</div>
 
 <h1 class="md-col-12" *ngIf="showFlag"> showFlag is {{showFlag}}</h1>
 <h1> ngIF condition</h1>
@@ -43,4 +43,5 @@ <h2>For Loop</h2>
         <span [ngSwitchDefault] >{{list.name}}</span>
     </div>-->
 
-</div>
\ No newline at end of file
+</div>
+
diff --git a/src/app/inner/inner.component.ts b/src/app/inner/inner.component.ts
index 7cf8f54..ce46e6b 100644
--- a/src/app/inner/inner.component.ts
+++ b/src/app/inner/inner.component.ts
@@ -56,4 +56,9 @@ export class innerComponent{
     addItems(){
         this.repeatItems.push(this.eachItem);
     }
+<<<<<<< HEAD
     
+}
+=======
+}
+>>>>>>> cae5a08187c7915bcc1ff00bb17d0f8169cdb69a
diff --git a/src/app/routing.component.html b/src/app/routing.component.html
new file mode 100644
index 0000000..8627022
--- /dev/null
+++ b/src/app/routing.component.html
@@ -0,0 +1,6 @@
+
+<div class="col-md-12 col-lg-12">
+  <a routerLink='/Inner' class="link">Inner</a>
+  <a routerLink='/Outer' class="link">Outer</a>
+</div>
+<router-outlet></router-outlet>
\ No newline at end of file
diff --git a/src/app/routing.component.ts b/src/app/routing.component.ts
new file mode 100644
index 0000000..46cbfb5
--- /dev/null
+++ b/src/app/routing.component.ts
@@ -0,0 +1,14 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-routing',
+  templateUrl: './routing.component.html'
+})
+export class RoutingComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit() {
+  }
+
+}
diff --git a/src/index.html b/src/index.html
index 3f691e0..cd20816 100644
--- a/src/index.html
+++ b/src/index.html
@@ -9,6 +9,7 @@
   <link rel="icon" type="image/x-icon" href="favicon.ico">
 </head>
 <body>
-  <app-root>Loading...</app-root>
+<!--  <app-root>Loading...</app-root> -->
+  <app-routing>Routing is Looding... </app-routing>
 </body>
 </html>
diff --git a/src/styles.css b/src/styles.css
index 90d4ee0..a5a84de 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -1 +1,2 @@
 /* You can add global styles to this file, and also import other style files */
+body{font-size:12px; color:#333}
\ No newline at end of file