diff --git a/demos/src/action-sheet/AppModule.ts b/demos/src/action-sheet/app.component.ts
similarity index 79%
rename from demos/src/action-sheet/AppModule.ts
rename to demos/src/action-sheet/app.component.ts
index 600e71bca6..e1f9c5bf15 100644
--- a/demos/src/action-sheet/AppModule.ts
+++ b/demos/src/action-sheet/app.component.ts
@@ -1,8 +1,8 @@
-import { Component, NgModule } from '@angular/core';
-import { ActionSheetController, IonicApp, IonicModule, Platform } from 'ionic-angular';
+import { Component } from '@angular/core';
+import { ActionSheetController, Platform } from 'ionic-angular';
 
 @Component({
-  templateUrl: 'main.html'
+  templateUrl: 'page.html'
 })
 export class ApiDemoPage {
   constructor(public alertCtrl: ActionSheetController, public platform: Platform) { }
@@ -62,18 +62,3 @@ export class ApiDemoPage {
 export class ApiDemoApp {
   root = ApiDemoPage;
 }
-
-@NgModule({
-  declarations: [
-    ApiDemoApp,
-    ApiDemoPage
-  ],
-  imports: [
-    IonicModule.forRoot(ApiDemoApp)
-  ],
-  bootstrap: [IonicApp],
-  entryComponents: [
-    ApiDemoPage
-  ]
-})
-export class AppModule {}
\ No newline at end of file
diff --git a/demos/src/show-when/AppModule.ts b/demos/src/action-sheet/app.module.ts
similarity index 53%
rename from demos/src/show-when/AppModule.ts
rename to demos/src/action-sheet/app.module.ts
index de83210338..a291ef08d7 100644
--- a/demos/src/show-when/AppModule.ts
+++ b/demos/src/action-sheet/app.module.ts
@@ -1,18 +1,6 @@
-import { Component, NgModule } from '@angular/core';
+import { NgModule } from '@angular/core';
 import { IonicApp, IonicModule } from 'ionic-angular';
-
-@Component({
-  templateUrl: 'main.html'
-})
-export class ApiDemoPage {}
-
-
-@Component({
-  template: '<ion-nav [root]="root"></ion-nav>'
-})
-export class ApiDemoApp {
-  root = ApiDemoPage;
-}
+import { ApiDemoApp, ApiDemoPage } from './app.component';
 
 @NgModule({
   declarations: [
diff --git a/demos/src/action-sheet/main.ts b/demos/src/action-sheet/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/action-sheet/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/action-sheet/main.html b/demos/src/action-sheet/page.html
similarity index 100%
rename from demos/src/action-sheet/main.html
rename to demos/src/action-sheet/page.html
diff --git a/demos/src/alert/AppModule.ts b/demos/src/alert/app.component.ts
similarity index 91%
rename from demos/src/alert/AppModule.ts
rename to demos/src/alert/app.component.ts
index ae93590823..cb99e07772 100644
--- a/demos/src/alert/AppModule.ts
+++ b/demos/src/alert/app.component.ts
@@ -1,9 +1,9 @@
-import { Component, NgModule } from '@angular/core';
-import { AlertController, IonicApp, IonicModule } from 'ionic-angular';
+import { Component } from '@angular/core';
+import { AlertController } from 'ionic-angular';
 
 
 @Component({
-  templateUrl: 'main.html'
+  templateUrl: 'page.html'
 })
 export class ApiDemoPage {
   testRadioOpen = false;
@@ -216,19 +216,3 @@ export class ApiDemoPage {
 export class ApiDemoApp {
   root = ApiDemoPage;
 }
-
-
-@NgModule({
-  declarations: [
-    ApiDemoApp,
-    ApiDemoPage
-  ],
-  imports: [
-    IonicModule.forRoot(ApiDemoApp)
-  ],
-  bootstrap: [IonicApp],
-  entryComponents: [
-    ApiDemoPage
-  ]
-})
-export class AppModule {}
diff --git a/demos/src/slides/AppModule.ts b/demos/src/alert/app.module.ts
similarity index 53%
rename from demos/src/slides/AppModule.ts
rename to demos/src/alert/app.module.ts
index de83210338..a291ef08d7 100644
--- a/demos/src/slides/AppModule.ts
+++ b/demos/src/alert/app.module.ts
@@ -1,18 +1,6 @@
-import { Component, NgModule } from '@angular/core';
+import { NgModule } from '@angular/core';
 import { IonicApp, IonicModule } from 'ionic-angular';
-
-@Component({
-  templateUrl: 'main.html'
-})
-export class ApiDemoPage {}
-
-
-@Component({
-  template: '<ion-nav [root]="root"></ion-nav>'
-})
-export class ApiDemoApp {
-  root = ApiDemoPage;
-}
+import { ApiDemoApp, ApiDemoPage } from './app.component';
 
 @NgModule({
   declarations: [
diff --git a/demos/src/alert/main.ts b/demos/src/alert/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/alert/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/alert/main.html b/demos/src/alert/page.html
similarity index 100%
rename from demos/src/alert/main.html
rename to demos/src/alert/page.html
diff --git a/demos/src/button/AppModule.ts b/demos/src/button/AppModule.ts
deleted file mode 100644
index b171cbda72..0000000000
--- a/demos/src/button/AppModule.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-import { Component, NgModule } from '@angular/core';
-import { IonicApp, IonicModule } from 'ionic-angular';
-
-
-@Component({
-  templateUrl: 'main.html'
-})
-export class ApiDemoPage {}
-
-
-@Component({
-  template: '<ion-nav [root]="root"></ion-nav>'
-})
-export class ApiDemoApp {
-  root = ApiDemoPage;
-}
-
-@NgModule({
-  declarations: [
-    ApiDemoApp,
-    ApiDemoPage
-  ],
-  imports: [
-    IonicModule.forRoot(ApiDemoApp)
-  ],
-  bootstrap: [IonicApp],
-  entryComponents: [
-    ApiDemoPage
-  ]
-})
-export class AppModule {}
diff --git a/demos/src/button/app.component.ts b/demos/src/button/app.component.ts
new file mode 100644
index 0000000000..de2b471432
--- /dev/null
+++ b/demos/src/button/app.component.ts
@@ -0,0 +1,15 @@
+import { Component } from '@angular/core';
+
+
+@Component({
+  templateUrl: 'page.html'
+})
+export class ApiDemoPage {}
+
+
+@Component({
+  template: '<ion-nav [root]="root"></ion-nav>'
+})
+export class ApiDemoApp {
+  root = ApiDemoPage;
+}
\ No newline at end of file
diff --git a/demos/src/textarea/AppModule.ts b/demos/src/button/app.module.ts
similarity index 53%
rename from demos/src/textarea/AppModule.ts
rename to demos/src/button/app.module.ts
index de83210338..a291ef08d7 100644
--- a/demos/src/textarea/AppModule.ts
+++ b/demos/src/button/app.module.ts
@@ -1,18 +1,6 @@
-import { Component, NgModule } from '@angular/core';
+import { NgModule } from '@angular/core';
 import { IonicApp, IonicModule } from 'ionic-angular';
-
-@Component({
-  templateUrl: 'main.html'
-})
-export class ApiDemoPage {}
-
-
-@Component({
-  template: '<ion-nav [root]="root"></ion-nav>'
-})
-export class ApiDemoApp {
-  root = ApiDemoPage;
-}
+import { ApiDemoApp, ApiDemoPage } from './app.component';
 
 @NgModule({
   declarations: [
diff --git a/demos/src/button/main.ts b/demos/src/button/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/button/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/button/main.html b/demos/src/button/page.html
similarity index 100%
rename from demos/src/button/main.html
rename to demos/src/button/page.html
diff --git a/demos/src/checkbox/AppModule.ts b/demos/src/checkbox/app.component.ts
similarity index 58%
rename from demos/src/checkbox/AppModule.ts
rename to demos/src/checkbox/app.component.ts
index 2dd9cd4855..ca91f83d72 100644
--- a/demos/src/checkbox/AppModule.ts
+++ b/demos/src/checkbox/app.component.ts
@@ -1,9 +1,8 @@
 import { Component, NgModule } from '@angular/core';
-import { IonicApp, IonicModule } from 'ionic-angular';
 
 
 @Component({
-  templateUrl: 'main.html'
+  templateUrl: 'page.html'
 })
 export class ApiDemoPage {
 
@@ -30,18 +29,3 @@ export class ApiDemoPage {
 export class ApiDemoApp {
   root = ApiDemoPage;
 }
-
-@NgModule({
-  declarations: [
-    ApiDemoApp,
-    ApiDemoPage
-  ],
-  imports: [
-    IonicModule.forRoot(ApiDemoApp)
-  ],
-  bootstrap: [IonicApp],
-  entryComponents: [
-    ApiDemoPage
-  ]
-})
-export class AppModule {}
diff --git a/demos/src/icon/AppModule.ts b/demos/src/checkbox/app.module.ts
similarity index 52%
rename from demos/src/icon/AppModule.ts
rename to demos/src/checkbox/app.module.ts
index b171cbda72..a291ef08d7 100644
--- a/demos/src/icon/AppModule.ts
+++ b/demos/src/checkbox/app.module.ts
@@ -1,19 +1,6 @@
-import { Component, NgModule } from '@angular/core';
+import { NgModule } from '@angular/core';
 import { IonicApp, IonicModule } from 'ionic-angular';
-
-
-@Component({
-  templateUrl: 'main.html'
-})
-export class ApiDemoPage {}
-
-
-@Component({
-  template: '<ion-nav [root]="root"></ion-nav>'
-})
-export class ApiDemoApp {
-  root = ApiDemoPage;
-}
+import { ApiDemoApp, ApiDemoPage } from './app.component';
 
 @NgModule({
   declarations: [
diff --git a/demos/src/checkbox/main.ts b/demos/src/checkbox/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/checkbox/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/checkbox/main.html b/demos/src/checkbox/page.html
similarity index 100%
rename from demos/src/checkbox/main.html
rename to demos/src/checkbox/page.html
diff --git a/demos/src/chip/AppModule.ts b/demos/src/chip/AppModule.ts
deleted file mode 100644
index e4eb04ca2a..0000000000
--- a/demos/src/chip/AppModule.ts
+++ /dev/null
@@ -1,33 +0,0 @@
-import { Component, NgModule } from '@angular/core';
-import { IonicApp, IonicModule } from 'ionic-angular';
-
-@Component({
-  templateUrl: 'main.html'
-})
-export class ApiDemoPage {
-  delete(chip: Element) {
-    chip.remove();
-  }
-}
-
-@Component({
-  template: '<ion-nav [root]="root"></ion-nav>'
-})
-export class ApiDemoApp {
-  root = ApiDemoPage;
-}
-
-@NgModule({
-  declarations: [
-    ApiDemoApp,
-    ApiDemoPage
-  ],
-  imports: [
-    IonicModule.forRoot(ApiDemoApp)
-  ],
-  bootstrap: [IonicApp],
-  entryComponents: [
-    ApiDemoPage
-  ]
-})
-export class AppModule {}
diff --git a/demos/src/chip/app.component.ts b/demos/src/chip/app.component.ts
new file mode 100644
index 0000000000..870f3161d8
--- /dev/null
+++ b/demos/src/chip/app.component.ts
@@ -0,0 +1,18 @@
+import { Component } from '@angular/core';
+
+@Component({
+  templateUrl: 'page.html'
+})
+export class ApiDemoPage {
+  delete(chip: Element) {
+    chip.remove();
+  }
+}
+
+@Component({
+  template: '<ion-nav [root]="root"></ion-nav>'
+})
+export class ApiDemoApp {
+  root = ApiDemoPage;
+}
+
diff --git a/demos/src/chip/app.module.ts b/demos/src/chip/app.module.ts
new file mode 100644
index 0000000000..a291ef08d7
--- /dev/null
+++ b/demos/src/chip/app.module.ts
@@ -0,0 +1,18 @@
+import { NgModule } from '@angular/core';
+import { IonicApp, IonicModule } from 'ionic-angular';
+import { ApiDemoApp, ApiDemoPage } from './app.component';
+
+@NgModule({
+  declarations: [
+    ApiDemoApp,
+    ApiDemoPage
+  ],
+  imports: [
+    IonicModule.forRoot(ApiDemoApp)
+  ],
+  bootstrap: [IonicApp],
+  entryComponents: [
+    ApiDemoPage
+  ]
+})
+export class AppModule {}
diff --git a/demos/src/chip/main.ts b/demos/src/chip/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/chip/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/chip/main.html b/demos/src/chip/page.html
similarity index 100%
rename from demos/src/chip/main.html
rename to demos/src/chip/page.html
diff --git a/demos/src/config/AppModule.ts b/demos/src/config/app.component.ts
similarity index 89%
rename from demos/src/config/AppModule.ts
rename to demos/src/config/app.component.ts
index dbebb4002f..60b5230143 100644
--- a/demos/src/config/AppModule.ts
+++ b/demos/src/config/app.component.ts
@@ -1,7 +1,5 @@
-import { Component, NgModule } from '@angular/core';
-
-import { IonicModule, IonicApp, Platform, NavController } from 'ionic-angular';
-
+import { Component } from '@angular/core';
+import { Platform, NavController } from 'ionic-angular';
 
 if (!window.localStorage) {
   Object.defineProperty(window, 'localStorage', new (function () {
@@ -82,7 +80,7 @@ export class TabPage {
 
 
 @Component({
-  templateUrl: 'main.html'
+  templateUrl: 'page.html'
 })
 export class ApiDemoPage {
   config: any;
@@ -126,7 +124,7 @@ export class ApiDemoPage {
 }
 
 @Component({
-  templateUrl: 'page.html'
+  templateUrl: 'push-page.html'
 })
 export class PushPage {
   constructor(public navCtrl: NavController) {}
@@ -143,21 +141,3 @@ export class PushPage {
 export class ApiDemoApp {
   root = TabPage;
 }
-
-
-@NgModule({
-  declarations: [
-    ApiDemoApp,
-    ApiDemoPage,
-    TabPage,
-    PushPage
-  ],
-  imports: [
-    IonicModule.forRoot(ApiDemoApp, CONFIG_DEMO)
-  ],
-  bootstrap: [IonicApp],
-  entryComponents: [
-    ApiDemoPage
-  ]
-})
-export class AppModule {}
diff --git a/demos/src/config/app.module.ts b/demos/src/config/app.module.ts
new file mode 100644
index 0000000000..a291ef08d7
--- /dev/null
+++ b/demos/src/config/app.module.ts
@@ -0,0 +1,18 @@
+import { NgModule } from '@angular/core';
+import { IonicApp, IonicModule } from 'ionic-angular';
+import { ApiDemoApp, ApiDemoPage } from './app.component';
+
+@NgModule({
+  declarations: [
+    ApiDemoApp,
+    ApiDemoPage
+  ],
+  imports: [
+    IonicModule.forRoot(ApiDemoApp)
+  ],
+  bootstrap: [IonicApp],
+  entryComponents: [
+    ApiDemoPage
+  ]
+})
+export class AppModule {}
diff --git a/demos/src/config/main.html b/demos/src/config/main.html
deleted file mode 100644
index 6c8cd00c3b..0000000000
--- a/demos/src/config/main.html
+++ /dev/null
@@ -1,77 +0,0 @@
-<ion-header>
-
-  <ion-navbar>
-    <ion-title>Config</ion-title>
-  </ion-navbar>
-
-</ion-header>
-
-
-<ion-content class="config-demo">
-
-  <ion-list>
-    <ion-item>
-      <ion-label>Back Button Icon</ion-label>
-      <ion-select [(ngModel)]="config.backButtonIcon">
-        <ion-option value="ios-arrow-back">ios-arrow-back</ion-option>
-        <ion-option value="md-arrow-back">md-arrow-back</ion-option>
-        <ion-option value="close">close</ion-option>
-        <ion-option value="heart">heart</ion-option>
-        <ion-option value="globe">globe</ion-option>
-      </ion-select>
-    </ion-item>
-
-    <ion-item>
-      <ion-label>Icon Mode</ion-label>
-      <ion-select [(ngModel)]="config.iconMode">
-        <ion-option value="ios">ios</ion-option>
-        <ion-option value="md">md</ion-option>
-      </ion-select>
-    </ion-item>
-
-    <ion-item>
-      <ion-label>Tab Placement</ion-label>
-      <ion-select [(ngModel)]="config.tabsPlacement">
-        <ion-option value="bottom">bottom</ion-option>
-        <ion-option value="top">top</ion-option>
-      </ion-select>
-    </ion-item>
-
-  </ion-list>
-  <p class="note">Note: the config will not be updated until you click the button below.</p>
-
-  <div padding>
-    <button ion-button block (click)="load()">
-      Update Config
-    </button>
-  </div>
-
-  <p class="note">Any config for your app should be passed as the third argument to ionicBootstrap.</p>
-
-  <!-- this has to be formatted weird for pre -->
-  <pre margin>
-ionicBootstrap(MyApp, [], {
-  backButtonIcon: "{{initialConfig.backButtonIcon}}"
-  iconMode: "{{initialConfig.iconMode}}"
-  tabsPlacement: "{{initialConfig.tabsPlacement}}"
-});</pre>
-
-  <div padding>
-    <button ion-button block color="secondary" (click)="push()">
-      Go to Another Page
-    </button>
-  </div>
-
-</ion-content>
-
-<style>
-  .config-demo pre {
-    background-color: #f8f8f8;
-  }
-
-  .config-demo .note {
-    color: #444;
-    font-style: italic;
-    margin: 0 16px;
-  }
-</style>
diff --git a/demos/src/config/main.ts b/demos/src/config/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/config/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/config/page.html b/demos/src/config/page.html
index 209ecc3423..6c8cd00c3b 100644
--- a/demos/src/config/page.html
+++ b/demos/src/config/page.html
@@ -1,11 +1,77 @@
 <ion-header>
+
   <ion-navbar>
-    <ion-title>Page</ion-title>
+    <ion-title>Config</ion-title>
   </ion-navbar>
+
 </ion-header>
 
-<ion-content>
+
+<ion-content class="config-demo">
+
+  <ion-list>
+    <ion-item>
+      <ion-label>Back Button Icon</ion-label>
+      <ion-select [(ngModel)]="config.backButtonIcon">
+        <ion-option value="ios-arrow-back">ios-arrow-back</ion-option>
+        <ion-option value="md-arrow-back">md-arrow-back</ion-option>
+        <ion-option value="close">close</ion-option>
+        <ion-option value="heart">heart</ion-option>
+        <ion-option value="globe">globe</ion-option>
+      </ion-select>
+    </ion-item>
+
+    <ion-item>
+      <ion-label>Icon Mode</ion-label>
+      <ion-select [(ngModel)]="config.iconMode">
+        <ion-option value="ios">ios</ion-option>
+        <ion-option value="md">md</ion-option>
+      </ion-select>
+    </ion-item>
+
+    <ion-item>
+      <ion-label>Tab Placement</ion-label>
+      <ion-select [(ngModel)]="config.tabsPlacement">
+        <ion-option value="bottom">bottom</ion-option>
+        <ion-option value="top">top</ion-option>
+      </ion-select>
+    </ion-item>
+
+  </ion-list>
+  <p class="note">Note: the config will not be updated until you click the button below.</p>
+
   <div padding>
-    <button ion-button block (click)="pop()">Go Back to Config</button>
+    <button ion-button block (click)="load()">
+      Update Config
+    </button>
   </div>
+
+  <p class="note">Any config for your app should be passed as the third argument to ionicBootstrap.</p>
+
+  <!-- this has to be formatted weird for pre -->
+  <pre margin>
+ionicBootstrap(MyApp, [], {
+  backButtonIcon: "{{initialConfig.backButtonIcon}}"
+  iconMode: "{{initialConfig.iconMode}}"
+  tabsPlacement: "{{initialConfig.tabsPlacement}}"
+});</pre>
+
+  <div padding>
+    <button ion-button block color="secondary" (click)="push()">
+      Go to Another Page
+    </button>
+  </div>
+
 </ion-content>
+
+<style>
+  .config-demo pre {
+    background-color: #f8f8f8;
+  }
+
+  .config-demo .note {
+    color: #444;
+    font-style: italic;
+    margin: 0 16px;
+  }
+</style>
diff --git a/demos/src/config/push-page.html b/demos/src/config/push-page.html
new file mode 100644
index 0000000000..209ecc3423
--- /dev/null
+++ b/demos/src/config/push-page.html
@@ -0,0 +1,11 @@
+<ion-header>
+  <ion-navbar>
+    <ion-title>Page</ion-title>
+  </ion-navbar>
+</ion-header>
+
+<ion-content>
+  <div padding>
+    <button ion-button block (click)="pop()">Go Back to Config</button>
+  </div>
+</ion-content>
diff --git a/demos/src/datetime/AppModule.ts b/demos/src/datetime/app.component.ts
similarity index 81%
rename from demos/src/datetime/AppModule.ts
rename to demos/src/datetime/app.component.ts
index 56b8db9cd0..81559c2ca9 100644
--- a/demos/src/datetime/AppModule.ts
+++ b/demos/src/datetime/app.component.ts
@@ -1,8 +1,7 @@
-import { Component, NgModule } from '@angular/core';
-import { IonicApp, IonicModule } from 'ionic-angular';
+import { Component } from '@angular/core';
 
 @Component({
-  templateUrl: 'main.html'
+  templateUrl: 'page.html'
 })
 export class ApiDemoPage {
   wwwReleased = '1991';
@@ -69,18 +68,3 @@ export class ApiDemoPage {
 export class ApiDemoApp {
   root = ApiDemoPage;
 }
-
-@NgModule({
-  declarations: [
-    ApiDemoApp,
-    ApiDemoPage
-  ],
-  imports: [
-    IonicModule.forRoot(ApiDemoApp)
-  ],
-  bootstrap: [IonicApp],
-  entryComponents: [
-    ApiDemoPage
-  ]
-})
-export class AppModule {}
diff --git a/demos/src/datetime/app.module.ts b/demos/src/datetime/app.module.ts
new file mode 100644
index 0000000000..a291ef08d7
--- /dev/null
+++ b/demos/src/datetime/app.module.ts
@@ -0,0 +1,18 @@
+import { NgModule } from '@angular/core';
+import { IonicApp, IonicModule } from 'ionic-angular';
+import { ApiDemoApp, ApiDemoPage } from './app.component';
+
+@NgModule({
+  declarations: [
+    ApiDemoApp,
+    ApiDemoPage
+  ],
+  imports: [
+    IonicModule.forRoot(ApiDemoApp)
+  ],
+  bootstrap: [IonicApp],
+  entryComponents: [
+    ApiDemoPage
+  ]
+})
+export class AppModule {}
diff --git a/demos/src/datetime/main.ts b/demos/src/datetime/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/datetime/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/datetime/main.html b/demos/src/datetime/page.html
similarity index 100%
rename from demos/src/datetime/main.html
rename to demos/src/datetime/page.html
diff --git a/demos/src/events/AppModule.ts b/demos/src/events/app.component.ts
similarity index 77%
rename from demos/src/events/AppModule.ts
rename to demos/src/events/app.component.ts
index 6da4d4f1da..a5e6f76f7d 100644
--- a/demos/src/events/AppModule.ts
+++ b/demos/src/events/app.component.ts
@@ -1,5 +1,5 @@
-import { Component, ViewChild, NgModule } from '@angular/core';
-import { Events, IonicApp, IonicModule, Nav } from 'ionic-angular';
+import { Component, ViewChild } from '@angular/core';
+import { Events, Nav } from 'ionic-angular';
 
 @Component({
   templateUrl: 'login.html'
@@ -18,7 +18,6 @@ export class Login {
 
 }
 
-
 @Component({
   templateUrl: 'logout.html'
 })
@@ -69,20 +68,3 @@ export class ApiDemoApp {
     });
   }
 }
-
-@NgModule({
-  declarations: [
-    ApiDemoApp,
-    Logout,
-    Login
-  ],
-  imports: [
-    IonicModule.forRoot(ApiDemoApp)
-  ],
-  bootstrap: [IonicApp],
-  entryComponents: [
-    Logout,
-    Login
-  ]
-})
-export class AppModule {}
diff --git a/demos/src/events/app.module.ts b/demos/src/events/app.module.ts
new file mode 100644
index 0000000000..a291ef08d7
--- /dev/null
+++ b/demos/src/events/app.module.ts
@@ -0,0 +1,18 @@
+import { NgModule } from '@angular/core';
+import { IonicApp, IonicModule } from 'ionic-angular';
+import { ApiDemoApp, ApiDemoPage } from './app.component';
+
+@NgModule({
+  declarations: [
+    ApiDemoApp,
+    ApiDemoPage
+  ],
+  imports: [
+    IonicModule.forRoot(ApiDemoApp)
+  ],
+  bootstrap: [IonicApp],
+  entryComponents: [
+    ApiDemoPage
+  ]
+})
+export class AppModule {}
diff --git a/demos/src/events/main.ts b/demos/src/events/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/events/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/hide-when/AppModule.ts b/demos/src/hide-when/AppModule.ts
deleted file mode 100644
index b171cbda72..0000000000
--- a/demos/src/hide-when/AppModule.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-import { Component, NgModule } from '@angular/core';
-import { IonicApp, IonicModule } from 'ionic-angular';
-
-
-@Component({
-  templateUrl: 'main.html'
-})
-export class ApiDemoPage {}
-
-
-@Component({
-  template: '<ion-nav [root]="root"></ion-nav>'
-})
-export class ApiDemoApp {
-  root = ApiDemoPage;
-}
-
-@NgModule({
-  declarations: [
-    ApiDemoApp,
-    ApiDemoPage
-  ],
-  imports: [
-    IonicModule.forRoot(ApiDemoApp)
-  ],
-  bootstrap: [IonicApp],
-  entryComponents: [
-    ApiDemoPage
-  ]
-})
-export class AppModule {}
diff --git a/demos/src/hide-when/app.component.ts b/demos/src/hide-when/app.component.ts
new file mode 100644
index 0000000000..5e716e3d84
--- /dev/null
+++ b/demos/src/hide-when/app.component.ts
@@ -0,0 +1,14 @@
+import { Component } from '@angular/core';
+
+@Component({
+  templateUrl: 'page.html'
+})
+export class ApiDemoPage {}
+
+
+@Component({
+  template: '<ion-nav [root]="root"></ion-nav>'
+})
+export class ApiDemoApp {
+  root = ApiDemoPage;
+}
diff --git a/demos/src/hide-when/app.module.ts b/demos/src/hide-when/app.module.ts
new file mode 100644
index 0000000000..a291ef08d7
--- /dev/null
+++ b/demos/src/hide-when/app.module.ts
@@ -0,0 +1,18 @@
+import { NgModule } from '@angular/core';
+import { IonicApp, IonicModule } from 'ionic-angular';
+import { ApiDemoApp, ApiDemoPage } from './app.component';
+
+@NgModule({
+  declarations: [
+    ApiDemoApp,
+    ApiDemoPage
+  ],
+  imports: [
+    IonicModule.forRoot(ApiDemoApp)
+  ],
+  bootstrap: [IonicApp],
+  entryComponents: [
+    ApiDemoPage
+  ]
+})
+export class AppModule {}
diff --git a/demos/src/hide-when/main.ts b/demos/src/hide-when/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/hide-when/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/hide-when/main.html b/demos/src/hide-when/page.html
similarity index 100%
rename from demos/src/hide-when/main.html
rename to demos/src/hide-when/page.html
diff --git a/demos/src/icon/app.component.ts b/demos/src/icon/app.component.ts
new file mode 100644
index 0000000000..5e716e3d84
--- /dev/null
+++ b/demos/src/icon/app.component.ts
@@ -0,0 +1,14 @@
+import { Component } from '@angular/core';
+
+@Component({
+  templateUrl: 'page.html'
+})
+export class ApiDemoPage {}
+
+
+@Component({
+  template: '<ion-nav [root]="root"></ion-nav>'
+})
+export class ApiDemoApp {
+  root = ApiDemoPage;
+}
diff --git a/demos/src/icon/app.module.ts b/demos/src/icon/app.module.ts
new file mode 100644
index 0000000000..a291ef08d7
--- /dev/null
+++ b/demos/src/icon/app.module.ts
@@ -0,0 +1,18 @@
+import { NgModule } from '@angular/core';
+import { IonicApp, IonicModule } from 'ionic-angular';
+import { ApiDemoApp, ApiDemoPage } from './app.component';
+
+@NgModule({
+  declarations: [
+    ApiDemoApp,
+    ApiDemoPage
+  ],
+  imports: [
+    IonicModule.forRoot(ApiDemoApp)
+  ],
+  bootstrap: [IonicApp],
+  entryComponents: [
+    ApiDemoPage
+  ]
+})
+export class AppModule {}
diff --git a/demos/src/icon/main.ts b/demos/src/icon/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/icon/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/icon/main.html b/demos/src/icon/page.html
similarity index 100%
rename from demos/src/icon/main.html
rename to demos/src/icon/page.html
diff --git a/demos/src/infinite-scroll/AppModule.ts b/demos/src/infinite-scroll/app.component.ts
similarity index 81%
rename from demos/src/infinite-scroll/AppModule.ts
rename to demos/src/infinite-scroll/app.component.ts
index b23be77de4..7df5efc3bc 100644
--- a/demos/src/infinite-scroll/AppModule.ts
+++ b/demos/src/infinite-scroll/app.component.ts
@@ -1,5 +1,5 @@
-import { Component, NgModule, Injectable } from '@angular/core';
-import { IonicApp, IonicModule, InfiniteScroll } from 'ionic-angular';
+import { Component, Injectable } from '@angular/core';
+import { InfiniteScroll } from 'ionic-angular';
 
 /**
  * Mock Data Access Object
@@ -63,7 +63,7 @@ export class MockProvider {
 
 
 @Component({
-  templateUrl: 'main.html',
+  templateUrl: 'page.html',
   providers: [MockProvider]
 })
 export class ApiDemoApp {
@@ -88,18 +88,3 @@ export class ApiDemoApp {
   }
 
 }
-
-@NgModule({
-  declarations: [
-    ApiDemoApp,
-    MockProvider
-  ],
-  imports: [
-    IonicModule.forRoot(ApiDemoApp)
-  ],
-  bootstrap: [IonicApp],
-  entryComponents: [
-    ApiDemoApp
-  ]
-})
-export class AppModule {}
diff --git a/demos/src/infinite-scroll/app.module.ts b/demos/src/infinite-scroll/app.module.ts
new file mode 100644
index 0000000000..6465038926
--- /dev/null
+++ b/demos/src/infinite-scroll/app.module.ts
@@ -0,0 +1,17 @@
+import { NgModule } from '@angular/core';
+import { IonicApp, IonicModule } from 'ionic-angular';
+import { ApiDemoApp } from './app.component';
+
+@NgModule({
+  declarations: [
+    ApiDemoApp
+  ],
+  imports: [
+    IonicModule.forRoot(ApiDemoApp)
+  ],
+  bootstrap: [IonicApp],
+  entryComponents: [
+    ApiDemoApp
+  ]
+})
+export class AppModule {}
diff --git a/demos/src/infinite-scroll/main.ts b/demos/src/infinite-scroll/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/infinite-scroll/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/infinite-scroll/main.html b/demos/src/infinite-scroll/page.html
similarity index 100%
rename from demos/src/infinite-scroll/main.html
rename to demos/src/infinite-scroll/page.html
diff --git a/demos/src/input/AppModule.ts b/demos/src/input/AppModule.ts
deleted file mode 100644
index b171cbda72..0000000000
--- a/demos/src/input/AppModule.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-import { Component, NgModule } from '@angular/core';
-import { IonicApp, IonicModule } from 'ionic-angular';
-
-
-@Component({
-  templateUrl: 'main.html'
-})
-export class ApiDemoPage {}
-
-
-@Component({
-  template: '<ion-nav [root]="root"></ion-nav>'
-})
-export class ApiDemoApp {
-  root = ApiDemoPage;
-}
-
-@NgModule({
-  declarations: [
-    ApiDemoApp,
-    ApiDemoPage
-  ],
-  imports: [
-    IonicModule.forRoot(ApiDemoApp)
-  ],
-  bootstrap: [IonicApp],
-  entryComponents: [
-    ApiDemoPage
-  ]
-})
-export class AppModule {}
diff --git a/demos/src/input/app.component.ts b/demos/src/input/app.component.ts
new file mode 100644
index 0000000000..9aa4cb3a13
--- /dev/null
+++ b/demos/src/input/app.component.ts
@@ -0,0 +1,15 @@
+import { Component } from '@angular/core';
+
+
+@Component({
+  templateUrl: 'main.html'
+})
+export class ApiDemoPage {}
+
+
+@Component({
+  template: '<ion-nav [root]="root"></ion-nav>'
+})
+export class ApiDemoApp {
+  root = ApiDemoPage;
+}
diff --git a/demos/src/input/app.module.ts b/demos/src/input/app.module.ts
new file mode 100644
index 0000000000..a291ef08d7
--- /dev/null
+++ b/demos/src/input/app.module.ts
@@ -0,0 +1,18 @@
+import { NgModule } from '@angular/core';
+import { IonicApp, IonicModule } from 'ionic-angular';
+import { ApiDemoApp, ApiDemoPage } from './app.component';
+
+@NgModule({
+  declarations: [
+    ApiDemoApp,
+    ApiDemoPage
+  ],
+  imports: [
+    IonicModule.forRoot(ApiDemoApp)
+  ],
+  bootstrap: [IonicApp],
+  entryComponents: [
+    ApiDemoPage
+  ]
+})
+export class AppModule {}
diff --git a/demos/src/input/main.ts b/demos/src/input/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/input/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/input/main.html b/demos/src/input/page.html
similarity index 100%
rename from demos/src/input/main.html
rename to demos/src/input/page.html
diff --git a/demos/src/item-reorder/AppModule.ts b/demos/src/item-reorder/app.component.ts
similarity index 78%
rename from demos/src/item-reorder/AppModule.ts
rename to demos/src/item-reorder/app.component.ts
index b62a969109..f7a76ec52e 100644
--- a/demos/src/item-reorder/AppModule.ts
+++ b/demos/src/item-reorder/app.component.ts
@@ -1,8 +1,8 @@
-import { Component, NgModule, ViewEncapsulation } from '@angular/core';
-import { IonicApp, IonicModule, NavController, reorderArray } from 'ionic-angular';
+import { Component,ViewEncapsulation } from '@angular/core';
+import { NavController, reorderArray } from 'ionic-angular';
 
 @Component({
-  templateUrl: 'main.html',
+  templateUrl: 'page.html',
   encapsulation: ViewEncapsulation.None
 })
 export class ApiDemoPage {
@@ -80,18 +80,3 @@ export class ApiDemoPage {
 export class ApiDemoApp {
   root = ApiDemoPage;
 }
-
-@NgModule({
-  declarations: [
-    ApiDemoApp,
-    ApiDemoPage
-  ],
-  imports: [
-    IonicModule.forRoot(ApiDemoApp)
-  ],
-  bootstrap: [IonicApp],
-  entryComponents: [
-    ApiDemoPage
-  ]
-})
-export class AppModule {}
diff --git a/demos/src/item-reorder/app.module.ts b/demos/src/item-reorder/app.module.ts
new file mode 100644
index 0000000000..a291ef08d7
--- /dev/null
+++ b/demos/src/item-reorder/app.module.ts
@@ -0,0 +1,18 @@
+import { NgModule } from '@angular/core';
+import { IonicApp, IonicModule } from 'ionic-angular';
+import { ApiDemoApp, ApiDemoPage } from './app.component';
+
+@NgModule({
+  declarations: [
+    ApiDemoApp,
+    ApiDemoPage
+  ],
+  imports: [
+    IonicModule.forRoot(ApiDemoApp)
+  ],
+  bootstrap: [IonicApp],
+  entryComponents: [
+    ApiDemoPage
+  ]
+})
+export class AppModule {}
diff --git a/demos/src/item-reorder/main.ts b/demos/src/item-reorder/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/item-reorder/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/item-reorder/main.html b/demos/src/item-reorder/page.html
similarity index 100%
rename from demos/src/item-reorder/main.html
rename to demos/src/item-reorder/page.html
diff --git a/demos/src/item-sliding/AppModule.ts b/demos/src/item-sliding/app.component.ts
similarity index 82%
rename from demos/src/item-sliding/AppModule.ts
rename to demos/src/item-sliding/app.component.ts
index bf424199cb..4056e0eaaf 100644
--- a/demos/src/item-sliding/AppModule.ts
+++ b/demos/src/item-sliding/app.component.ts
@@ -1,9 +1,9 @@
-import { Component, NgModule, ViewEncapsulation } from '@angular/core';
-import { IonicApp, IonicModule, ItemSliding, ToastController } from 'ionic-angular';
+import { Component, ViewEncapsulation } from '@angular/core';
+import { ItemSliding, ToastController } from 'ionic-angular';
 
 
 @Component({
-  templateUrl: 'main.html',
+  templateUrl: 'page.html',
   encapsulation: ViewEncapsulation.None
 })
 export class ApiDemoPage {
@@ -95,18 +95,3 @@ export class ApiDemoPage {
 export class ApiDemoApp {
   root = ApiDemoPage;
 }
-
-@NgModule({
-  declarations: [
-    ApiDemoApp,
-    ApiDemoPage
-  ],
-  imports: [
-    IonicModule.forRoot(ApiDemoApp)
-  ],
-  bootstrap: [IonicApp],
-  entryComponents: [
-    ApiDemoPage
-  ]
-})
-export class AppModule {}
diff --git a/demos/src/item-sliding/app.module.ts b/demos/src/item-sliding/app.module.ts
new file mode 100644
index 0000000000..a291ef08d7
--- /dev/null
+++ b/demos/src/item-sliding/app.module.ts
@@ -0,0 +1,18 @@
+import { NgModule } from '@angular/core';
+import { IonicApp, IonicModule } from 'ionic-angular';
+import { ApiDemoApp, ApiDemoPage } from './app.component';
+
+@NgModule({
+  declarations: [
+    ApiDemoApp,
+    ApiDemoPage
+  ],
+  imports: [
+    IonicModule.forRoot(ApiDemoApp)
+  ],
+  bootstrap: [IonicApp],
+  entryComponents: [
+    ApiDemoPage
+  ]
+})
+export class AppModule {}
diff --git a/demos/src/item-sliding/main.ts b/demos/src/item-sliding/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/item-sliding/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/item-sliding/main.html b/demos/src/item-sliding/page.html
similarity index 100%
rename from demos/src/item-sliding/main.html
rename to demos/src/item-sliding/page.html
diff --git a/demos/src/item/AppModule.ts b/demos/src/item/AppModule.ts
deleted file mode 100644
index b171cbda72..0000000000
--- a/demos/src/item/AppModule.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-import { Component, NgModule } from '@angular/core';
-import { IonicApp, IonicModule } from 'ionic-angular';
-
-
-@Component({
-  templateUrl: 'main.html'
-})
-export class ApiDemoPage {}
-
-
-@Component({
-  template: '<ion-nav [root]="root"></ion-nav>'
-})
-export class ApiDemoApp {
-  root = ApiDemoPage;
-}
-
-@NgModule({
-  declarations: [
-    ApiDemoApp,
-    ApiDemoPage
-  ],
-  imports: [
-    IonicModule.forRoot(ApiDemoApp)
-  ],
-  bootstrap: [IonicApp],
-  entryComponents: [
-    ApiDemoPage
-  ]
-})
-export class AppModule {}
diff --git a/demos/src/item/app.component.ts b/demos/src/item/app.component.ts
new file mode 100644
index 0000000000..248e96fa2a
--- /dev/null
+++ b/demos/src/item/app.component.ts
@@ -0,0 +1,15 @@
+import { Component } from '@angular/core';
+
+
+@Component({
+  templateUrl: 'page.html'
+})
+export class ApiDemoPage {}
+
+
+@Component({
+  template: '<ion-nav [root]="root"></ion-nav>'
+})
+export class ApiDemoApp {
+  root = ApiDemoPage;
+}
diff --git a/demos/src/item/app.module.ts b/demos/src/item/app.module.ts
new file mode 100644
index 0000000000..a291ef08d7
--- /dev/null
+++ b/demos/src/item/app.module.ts
@@ -0,0 +1,18 @@
+import { NgModule } from '@angular/core';
+import { IonicApp, IonicModule } from 'ionic-angular';
+import { ApiDemoApp, ApiDemoPage } from './app.component';
+
+@NgModule({
+  declarations: [
+    ApiDemoApp,
+    ApiDemoPage
+  ],
+  imports: [
+    IonicModule.forRoot(ApiDemoApp)
+  ],
+  bootstrap: [IonicApp],
+  entryComponents: [
+    ApiDemoPage
+  ]
+})
+export class AppModule {}
diff --git a/demos/src/item/main.ts b/demos/src/item/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/item/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/item/main.html b/demos/src/item/page.html
similarity index 100%
rename from demos/src/item/main.html
rename to demos/src/item/page.html
diff --git a/demos/src/label/AppModule.ts b/demos/src/label/AppModule.ts
deleted file mode 100644
index 739a83c887..0000000000
--- a/demos/src/label/AppModule.ts
+++ /dev/null
@@ -1,32 +0,0 @@
-import { Component, NgModule } from '@angular/core';
-
-import { IonicApp, IonicModule } from 'ionic-angular';
-
-
-@Component({
-  templateUrl: 'main.html'
-})
-export class ApiDemoPage {}
-
-
-@Component({
-  template: '<ion-nav [root]="root"></ion-nav>'
-})
-export class ApiDemoApp {
-  root = ApiDemoPage;
-}
-
-@NgModule({
-  declarations: [
-    ApiDemoApp,
-    ApiDemoPage
-  ],
-  imports: [
-    IonicModule.forRoot(ApiDemoApp)
-  ],
-  bootstrap: [IonicApp],
-  entryComponents: [
-    ApiDemoPage
-  ]
-})
-export class AppModule {}
diff --git a/demos/src/label/app.component.ts b/demos/src/label/app.component.ts
new file mode 100644
index 0000000000..5e716e3d84
--- /dev/null
+++ b/demos/src/label/app.component.ts
@@ -0,0 +1,14 @@
+import { Component } from '@angular/core';
+
+@Component({
+  templateUrl: 'page.html'
+})
+export class ApiDemoPage {}
+
+
+@Component({
+  template: '<ion-nav [root]="root"></ion-nav>'
+})
+export class ApiDemoApp {
+  root = ApiDemoPage;
+}
diff --git a/demos/src/label/app.module.ts b/demos/src/label/app.module.ts
new file mode 100644
index 0000000000..a291ef08d7
--- /dev/null
+++ b/demos/src/label/app.module.ts
@@ -0,0 +1,18 @@
+import { NgModule } from '@angular/core';
+import { IonicApp, IonicModule } from 'ionic-angular';
+import { ApiDemoApp, ApiDemoPage } from './app.component';
+
+@NgModule({
+  declarations: [
+    ApiDemoApp,
+    ApiDemoPage
+  ],
+  imports: [
+    IonicModule.forRoot(ApiDemoApp)
+  ],
+  bootstrap: [IonicApp],
+  entryComponents: [
+    ApiDemoPage
+  ]
+})
+export class AppModule {}
diff --git a/demos/src/label/main.ts b/demos/src/label/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/label/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/label/main.html b/demos/src/label/page.html
similarity index 100%
rename from demos/src/label/main.html
rename to demos/src/label/page.html
diff --git a/demos/src/list/AppModule.ts b/demos/src/list/AppModule.ts
deleted file mode 100644
index 919511ce26..0000000000
--- a/demos/src/list/AppModule.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-import { Component, NgModule } from '@angular/core';
-
-import { IonicApp, IonicModule } from 'ionic-angular';
-
-@Component({
-  templateUrl: 'main.html'
-})
-export class ApiDemoPage {}
-
-
-@Component({
-  template: '<ion-nav [root]="root"></ion-nav>'
-})
-export class ApiDemoApp {
-  root = ApiDemoPage;
-}
-
-@NgModule({
-  declarations: [
-    ApiDemoApp,
-    ApiDemoPage
-  ],
-  imports: [
-    IonicModule.forRoot(ApiDemoApp)
-  ],
-  bootstrap: [IonicApp],
-  entryComponents: [
-    ApiDemoPage
-  ]
-})
-export class AppModule {}
diff --git a/demos/src/list/app.component.ts b/demos/src/list/app.component.ts
new file mode 100644
index 0000000000..76a8f07066
--- /dev/null
+++ b/demos/src/list/app.component.ts
@@ -0,0 +1,15 @@
+import { Component } from '@angular/core';
+
+@Component({
+  templateUrl: 'page.html'
+})
+export class ApiDemoPage {}
+
+
+@Component({
+  template: '<ion-nav [root]="root"></ion-nav>'
+})
+export class ApiDemoApp {
+  root = ApiDemoPage;
+}
+
diff --git a/demos/src/list/app.module.ts b/demos/src/list/app.module.ts
new file mode 100644
index 0000000000..a291ef08d7
--- /dev/null
+++ b/demos/src/list/app.module.ts
@@ -0,0 +1,18 @@
+import { NgModule } from '@angular/core';
+import { IonicApp, IonicModule } from 'ionic-angular';
+import { ApiDemoApp, ApiDemoPage } from './app.component';
+
+@NgModule({
+  declarations: [
+    ApiDemoApp,
+    ApiDemoPage
+  ],
+  imports: [
+    IonicModule.forRoot(ApiDemoApp)
+  ],
+  bootstrap: [IonicApp],
+  entryComponents: [
+    ApiDemoPage
+  ]
+})
+export class AppModule {}
diff --git a/demos/src/list/main.ts b/demos/src/list/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/list/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/list/main.html b/demos/src/list/page.html
similarity index 100%
rename from demos/src/list/main.html
rename to demos/src/list/page.html
diff --git a/demos/src/loading/AppModule.ts b/demos/src/loading/app.component.ts
similarity index 88%
rename from demos/src/loading/AppModule.ts
rename to demos/src/loading/app.component.ts
index 7d6b1d5a29..a18f97caa1 100644
--- a/demos/src/loading/AppModule.ts
+++ b/demos/src/loading/app.component.ts
@@ -1,7 +1,5 @@
-import { Component, NgModule, ViewEncapsulation } from '@angular/core';
-
-import { IonicApp, IonicModule, LoadingController, NavController } from 'ionic-angular';
-
+import { Component, ViewEncapsulation } from '@angular/core';
+import { LoadingController, NavController } from 'ionic-angular';
 
 @Component({
   templateUrl: 'main.html'
@@ -131,20 +129,3 @@ export class Page2 {}
 export class ApiDemoApp {
   root = Page1;
 }
-
-@NgModule({
-  declarations: [
-    ApiDemoApp,
-    Page1,
-    Page2
-  ],
-  imports: [
-    IonicModule.forRoot(ApiDemoApp)
-  ],
-  bootstrap: [IonicApp],
-  entryComponents: [
-    Page1,
-    Page2
-  ]
-})
-export class AppModule {}
diff --git a/demos/src/loading/app.module.ts b/demos/src/loading/app.module.ts
new file mode 100644
index 0000000000..a291ef08d7
--- /dev/null
+++ b/demos/src/loading/app.module.ts
@@ -0,0 +1,18 @@
+import { NgModule } from '@angular/core';
+import { IonicApp, IonicModule } from 'ionic-angular';
+import { ApiDemoApp, ApiDemoPage } from './app.component';
+
+@NgModule({
+  declarations: [
+    ApiDemoApp,
+    ApiDemoPage
+  ],
+  imports: [
+    IonicModule.forRoot(ApiDemoApp)
+  ],
+  bootstrap: [IonicApp],
+  entryComponents: [
+    ApiDemoPage
+  ]
+})
+export class AppModule {}
diff --git a/demos/src/loading/main.ts b/demos/src/loading/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/loading/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/loading/main.html b/demos/src/loading/page.html
similarity index 100%
rename from demos/src/loading/main.html
rename to demos/src/loading/page.html
diff --git a/demos/src/local-storage/AppModule.ts b/demos/src/local-storage/app.component.ts
similarity index 82%
rename from demos/src/local-storage/AppModule.ts
rename to demos/src/local-storage/app.component.ts
index 4ad12b1964..6d4957855e 100644
--- a/demos/src/local-storage/AppModule.ts
+++ b/demos/src/local-storage/app.component.ts
@@ -1,5 +1,5 @@
-import { Component, NgModule, Injectable, Pipe, PipeTransform } from '@angular/core';
-import { IonicApp, IonicModule, LocalStorage, Storage } from 'ionic-angular';
+import { Component, Injectable, Pipe, PipeTransform } from '@angular/core';
+import { LocalStorage, Storage } from 'ionic-angular';
 
 @Pipe({
   name: 'cleanLocalData'
@@ -85,18 +85,3 @@ export class ApiDemoApp {
   root = ApiDemoPage;
 }
 
-@NgModule({
-  declarations: [
-    ApiDemoApp,
-    ApiDemoPage,
-    CleanLocalDataPipe
-  ],
-  imports: [
-    IonicModule.forRoot(ApiDemoApp)
-  ],
-  bootstrap: [IonicApp],
-  entryComponents: [
-    ApiDemoPage
-  ]
-})
-export class AppModule {}
diff --git a/demos/src/local-storage/app.module.ts b/demos/src/local-storage/app.module.ts
new file mode 100644
index 0000000000..a291ef08d7
--- /dev/null
+++ b/demos/src/local-storage/app.module.ts
@@ -0,0 +1,18 @@
+import { NgModule } from '@angular/core';
+import { IonicApp, IonicModule } from 'ionic-angular';
+import { ApiDemoApp, ApiDemoPage } from './app.component';
+
+@NgModule({
+  declarations: [
+    ApiDemoApp,
+    ApiDemoPage
+  ],
+  imports: [
+    IonicModule.forRoot(ApiDemoApp)
+  ],
+  bootstrap: [IonicApp],
+  entryComponents: [
+    ApiDemoPage
+  ]
+})
+export class AppModule {}
diff --git a/demos/src/local-storage/main.ts b/demos/src/local-storage/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/local-storage/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/local-storage/main.html b/demos/src/local-storage/page.html
similarity index 100%
rename from demos/src/local-storage/main.html
rename to demos/src/local-storage/page.html
diff --git a/demos/src/menu/AppModule.ts b/demos/src/menu/app.component.ts
similarity index 57%
rename from demos/src/menu/AppModule.ts
rename to demos/src/menu/app.component.ts
index c265509efa..072c93a16e 100644
--- a/demos/src/menu/AppModule.ts
+++ b/demos/src/menu/app.component.ts
@@ -1,10 +1,10 @@
-import { Component, NgModule } from '@angular/core';
+import { Component } from '@angular/core';
 
-import { IonicApp, IonicModule, MenuController } from 'ionic-angular';
+import { MenuController } from 'ionic-angular';
 
 
 @Component({
-  templateUrl: 'main.html'
+  templateUrl: 'page.html'
 })
 export class ApiDemoPage {
   activeMenu: string;
@@ -31,18 +31,3 @@ export class ApiDemoPage {
 export class ApiDemoApp {
   root = ApiDemoPage;
 }
-
-@NgModule({
-  declarations: [
-    ApiDemoApp,
-    ApiDemoPage
-  ],
-  imports: [
-    IonicModule.forRoot(ApiDemoApp)
-  ],
-  bootstrap: [IonicApp],
-  entryComponents: [
-    ApiDemoPage
-  ]
-})
-export class AppModule {}
diff --git a/demos/src/menu/app.module.ts b/demos/src/menu/app.module.ts
new file mode 100644
index 0000000000..a291ef08d7
--- /dev/null
+++ b/demos/src/menu/app.module.ts
@@ -0,0 +1,18 @@
+import { NgModule } from '@angular/core';
+import { IonicApp, IonicModule } from 'ionic-angular';
+import { ApiDemoApp, ApiDemoPage } from './app.component';
+
+@NgModule({
+  declarations: [
+    ApiDemoApp,
+    ApiDemoPage
+  ],
+  imports: [
+    IonicModule.forRoot(ApiDemoApp)
+  ],
+  bootstrap: [IonicApp],
+  entryComponents: [
+    ApiDemoPage
+  ]
+})
+export class AppModule {}
diff --git a/demos/src/menu/main.ts b/demos/src/menu/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/menu/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/menu/main.html b/demos/src/menu/page.html
similarity index 100%
rename from demos/src/menu/main.html
rename to demos/src/menu/page.html
diff --git a/demos/src/modal/AppModule.ts b/demos/src/modal/app.component.ts
similarity index 78%
rename from demos/src/modal/AppModule.ts
rename to demos/src/modal/app.component.ts
index cf33342a62..262a90830f 100644
--- a/demos/src/modal/AppModule.ts
+++ b/demos/src/modal/app.component.ts
@@ -1,10 +1,10 @@
-import { Component, NgModule } from '@angular/core';
+import { Component } from '@angular/core';
 
-import { Animation, IonicApp, IonicModule, ModalController, NavParams, ViewController } from 'ionic-angular';
+import { Animation, ModalController, NavParams, ViewController } from 'ionic-angular';
 
 
 @Component({
-  templateUrl: 'main.html'
+  templateUrl: 'page.html'
 })
 export class ModalFirstPage {
   myParam = '';
@@ -54,23 +54,6 @@ export class ApiDemoApp {
   root = ModalFirstPage;
 }
 
-@NgModule({
-  declarations: [
-    ApiDemoApp,
-    ModalFirstPage,
-    ModalContentPage
-  ],
-  imports: [
-    IonicModule.forRoot(ApiDemoApp)
-  ],
-  bootstrap: [IonicApp],
-  entryComponents: [
-    ModalFirstPage
-  ]
-})
-export class AppModule {}
-
-
 export class FadeIn extends Animation {
   constructor(enteringView: ViewController, leavingView: ViewController) {
     super(enteringView.pageRef());
diff --git a/demos/src/modal/app.module.ts b/demos/src/modal/app.module.ts
new file mode 100644
index 0000000000..a291ef08d7
--- /dev/null
+++ b/demos/src/modal/app.module.ts
@@ -0,0 +1,18 @@
+import { NgModule } from '@angular/core';
+import { IonicApp, IonicModule } from 'ionic-angular';
+import { ApiDemoApp, ApiDemoPage } from './app.component';
+
+@NgModule({
+  declarations: [
+    ApiDemoApp,
+    ApiDemoPage
+  ],
+  imports: [
+    IonicModule.forRoot(ApiDemoApp)
+  ],
+  bootstrap: [IonicApp],
+  entryComponents: [
+    ApiDemoPage
+  ]
+})
+export class AppModule {}
diff --git a/demos/src/modal/main.ts b/demos/src/modal/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/modal/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/modal/main.html b/demos/src/modal/page.html
similarity index 100%
rename from demos/src/modal/main.html
rename to demos/src/modal/page.html
diff --git a/demos/src/nav-params/AppModule.ts b/demos/src/nav-params/app.component.ts
similarity index 55%
rename from demos/src/nav-params/AppModule.ts
rename to demos/src/nav-params/app.component.ts
index 6b6041eed4..0b82fbab9a 100644
--- a/demos/src/nav-params/AppModule.ts
+++ b/demos/src/nav-params/app.component.ts
@@ -1,10 +1,8 @@
-import { Component, NgModule } from '@angular/core';
-
-import { IonicApp, IonicModule, NavController, NavParams } from 'ionic-angular';
-
+import { Component } from '@angular/core';
+import { NavController, NavParams } from 'ionic-angular';
 
 @Component({
-  templateUrl: 'main.html'
+  templateUrl: 'page.html'
 })
 export class ApiDemoPage {
   myParam: string = '';
@@ -16,9 +14,8 @@ export class ApiDemoPage {
   }
 }
 
-
 @Component({
-  templateUrl: 'page.html'
+  templateUrl: 'push-page.html'
 })
 export class PushPage {
   myParam: string;
@@ -36,18 +33,3 @@ export class ApiDemoApp {
   root = ApiDemoPage;
 }
 
-@NgModule({
-  declarations: [
-    ApiDemoApp,
-    ApiDemoPage,
-    PushPage
-  ],
-  imports: [
-    IonicModule.forRoot(ApiDemoApp)
-  ],
-  bootstrap: [IonicApp],
-  entryComponents: [
-    ApiDemoPage
-  ]
-})
-export class AppModule {}
diff --git a/demos/src/nav-params/app.module.ts b/demos/src/nav-params/app.module.ts
new file mode 100644
index 0000000000..a291ef08d7
--- /dev/null
+++ b/demos/src/nav-params/app.module.ts
@@ -0,0 +1,18 @@
+import { NgModule } from '@angular/core';
+import { IonicApp, IonicModule } from 'ionic-angular';
+import { ApiDemoApp, ApiDemoPage } from './app.component';
+
+@NgModule({
+  declarations: [
+    ApiDemoApp,
+    ApiDemoPage
+  ],
+  imports: [
+    IonicModule.forRoot(ApiDemoApp)
+  ],
+  bootstrap: [IonicApp],
+  entryComponents: [
+    ApiDemoPage
+  ]
+})
+export class AppModule {}
diff --git a/demos/src/nav-params/main.ts b/demos/src/nav-params/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/nav-params/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/nav-params/page.html b/demos/src/nav-params/push-page.html
similarity index 100%
rename from demos/src/nav-params/page.html
rename to demos/src/nav-params/push-page.html
diff --git a/demos/src/navbar/AppModule.ts b/demos/src/navbar/AppModule.ts
deleted file mode 100644
index 4a385837d8..0000000000
--- a/demos/src/navbar/AppModule.ts
+++ /dev/null
@@ -1,35 +0,0 @@
-import { Component, NgModule } from '@angular/core';
-import { IonicApp, IonicModule } from 'ionic-angular';
-
-// Use the toolbar demo but pass in the demo name to change the title
-@Component({
-  templateUrl: '../toolbar/main.html'
-})
-export class ApiDemoPage {
-  demo = 'Navbar';
-  favorites = 'recent';
-  apps = 'free';
-}
-
-
-@Component({
-  template: '<ion-nav [root]="root"></ion-nav>'
-})
-export class ApiDemoApp {
-  root = ApiDemoPage;
-}
-
-@NgModule({
-  declarations: [
-    ApiDemoApp,
-    ApiDemoPage
-  ],
-  imports: [
-    IonicModule.forRoot(ApiDemoApp)
-  ],
-  bootstrap: [IonicApp],
-  entryComponents: [
-    ApiDemoPage
-  ]
-})
-export class AppModule {}
diff --git a/demos/src/navbar/app.component.ts b/demos/src/navbar/app.component.ts
new file mode 100644
index 0000000000..eeaf4cf051
--- /dev/null
+++ b/demos/src/navbar/app.component.ts
@@ -0,0 +1,19 @@
+import { Component } from '@angular/core';
+
+// Use the toolbar demo but pass in the demo name to change the title
+@Component({
+  templateUrl: 'page.html'
+})
+export class ApiDemoPage {
+  demo = 'Navbar';
+  favorites = 'recent';
+  apps = 'free';
+}
+
+
+@Component({
+  template: '<ion-nav [root]="root"></ion-nav>'
+})
+export class ApiDemoApp {
+  root = ApiDemoPage;
+}
diff --git a/demos/src/navbar/app.module.ts b/demos/src/navbar/app.module.ts
new file mode 100644
index 0000000000..a291ef08d7
--- /dev/null
+++ b/demos/src/navbar/app.module.ts
@@ -0,0 +1,18 @@
+import { NgModule } from '@angular/core';
+import { IonicApp, IonicModule } from 'ionic-angular';
+import { ApiDemoApp, ApiDemoPage } from './app.component';
+
+@NgModule({
+  declarations: [
+    ApiDemoApp,
+    ApiDemoPage
+  ],
+  imports: [
+    IonicModule.forRoot(ApiDemoApp)
+  ],
+  bootstrap: [IonicApp],
+  entryComponents: [
+    ApiDemoPage
+  ]
+})
+export class AppModule {}
diff --git a/demos/src/navbar/main.ts b/demos/src/navbar/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/navbar/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/toolbar/main.html b/demos/src/navbar/page.html
similarity index 100%
rename from demos/src/toolbar/main.html
rename to demos/src/navbar/page.html
diff --git a/demos/src/navigation/AppModule.ts b/demos/src/navigation/app.component.ts
similarity index 59%
rename from demos/src/navigation/AppModule.ts
rename to demos/src/navigation/app.component.ts
index 957542a079..8db7cb8736 100644
--- a/demos/src/navigation/AppModule.ts
+++ b/demos/src/navigation/app.component.ts
@@ -1,10 +1,10 @@
-import { Component, NgModule } from '@angular/core';
-import { IonicApp, IonicModule, NavController } from 'ionic-angular';
+import { Component } from '@angular/core';
+import { NavController } from 'ionic-angular';
 
 let pageNum = 2;
 
 @Component({
-  templateUrl: 'main.html'
+  templateUrl: 'page.html'
 })
 export class ApiDemoPage {
   constructor(public navCtrl: NavController) {}
@@ -15,7 +15,7 @@ export class ApiDemoPage {
 }
 
 @Component({
-  templateUrl: 'page.html'
+  templateUrl: 'page-page.html'
 })
 export class PushPage {
   pageNum = pageNum;
@@ -42,19 +42,3 @@ export class PushPage {
 export class ApiDemoApp {
   root = ApiDemoPage;
 }
-
-@NgModule({
-  declarations: [
-    PushPage,
-    ApiDemoApp,
-    ApiDemoPage
-  ],
-  imports: [
-    IonicModule.forRoot(ApiDemoApp)
-  ],
-  bootstrap: [IonicApp],
-  entryComponents: [
-    ApiDemoPage
-  ]
-})
-export class AppModule {}
diff --git a/demos/src/navigation/app.module.ts b/demos/src/navigation/app.module.ts
new file mode 100644
index 0000000000..a291ef08d7
--- /dev/null
+++ b/demos/src/navigation/app.module.ts
@@ -0,0 +1,18 @@
+import { NgModule } from '@angular/core';
+import { IonicApp, IonicModule } from 'ionic-angular';
+import { ApiDemoApp, ApiDemoPage } from './app.component';
+
+@NgModule({
+  declarations: [
+    ApiDemoApp,
+    ApiDemoPage
+  ],
+  imports: [
+    IonicModule.forRoot(ApiDemoApp)
+  ],
+  bootstrap: [IonicApp],
+  entryComponents: [
+    ApiDemoPage
+  ]
+})
+export class AppModule {}
diff --git a/demos/src/navigation/main.html b/demos/src/navigation/main.html
deleted file mode 100644
index cb98e9776a..0000000000
--- a/demos/src/navigation/main.html
+++ /dev/null
@@ -1,14 +0,0 @@
-<ion-header>
-
-  <ion-navbar>
-    <ion-title>Navigation</ion-title>
-  </ion-navbar>
-
-</ion-header>
-
-
-<ion-content padding>
-
-  <button ion-button block (click)="push()">Push New Page</button>
-
-</ion-content>
diff --git a/demos/src/navigation/main.ts b/demos/src/navigation/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/navigation/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/navigation/page.html b/demos/src/navigation/page.html
index 05d551f9f2..cb98e9776a 100644
--- a/demos/src/navigation/page.html
+++ b/demos/src/navigation/page.html
@@ -1,7 +1,7 @@
 <ion-header>
 
   <ion-navbar>
-    <ion-title>Page {{pageNum}}</ion-title>
+    <ion-title>Navigation</ion-title>
   </ion-navbar>
 
 </ion-header>
@@ -9,7 +9,6 @@
 
 <ion-content padding>
 
-  <button ion-button block (click)="push()">Push Another Page</button>
-  <button ion-button color="secondary" block (click)="pop()">Pop This Page</button>
+  <button ion-button block (click)="push()">Push New Page</button>
 
 </ion-content>
diff --git a/demos/src/navigation/push-page.html b/demos/src/navigation/push-page.html
new file mode 100644
index 0000000000..05d551f9f2
--- /dev/null
+++ b/demos/src/navigation/push-page.html
@@ -0,0 +1,15 @@
+<ion-header>
+
+  <ion-navbar>
+    <ion-title>Page {{pageNum}}</ion-title>
+  </ion-navbar>
+
+</ion-header>
+
+
+<ion-content padding>
+
+  <button ion-button block (click)="push()">Push Another Page</button>
+  <button ion-button color="secondary" block (click)="pop()">Pop This Page</button>
+
+</ion-content>
diff --git a/demos/src/platform/AppModule.ts b/demos/src/platform/app.component.ts
similarity index 51%
rename from demos/src/platform/AppModule.ts
rename to demos/src/platform/app.component.ts
index 73eb87a822..814fa29f45 100644
--- a/demos/src/platform/AppModule.ts
+++ b/demos/src/platform/app.component.ts
@@ -1,9 +1,9 @@
-import { Component, NgModule } from '@angular/core';
-import { IonicApp, IonicModule, Platform } from 'ionic-angular';
+import { Component } from '@angular/core';
+import { Platform } from 'ionic-angular';
 
 
 @Component({
-  templateUrl: 'main.html'
+  templateUrl: 'page.html'
 })
 export class ApiDemoPage {
   isIos: boolean;
@@ -23,18 +23,3 @@ export class ApiDemoPage {
 export class ApiDemoApp {
   root = ApiDemoPage;
 }
-
-@NgModule({
-  declarations: [
-    ApiDemoApp,
-    ApiDemoPage
-  ],
-  imports: [
-    IonicModule.forRoot(ApiDemoApp)
-  ],
-  bootstrap: [IonicApp],
-  entryComponents: [
-    ApiDemoPage
-  ]
-})
-export class AppModule {}
diff --git a/demos/src/platform/app.module.ts b/demos/src/platform/app.module.ts
new file mode 100644
index 0000000000..a291ef08d7
--- /dev/null
+++ b/demos/src/platform/app.module.ts
@@ -0,0 +1,18 @@
+import { NgModule } from '@angular/core';
+import { IonicApp, IonicModule } from 'ionic-angular';
+import { ApiDemoApp, ApiDemoPage } from './app.component';
+
+@NgModule({
+  declarations: [
+    ApiDemoApp,
+    ApiDemoPage
+  ],
+  imports: [
+    IonicModule.forRoot(ApiDemoApp)
+  ],
+  bootstrap: [IonicApp],
+  entryComponents: [
+    ApiDemoPage
+  ]
+})
+export class AppModule {}
diff --git a/demos/src/platform/main.ts b/demos/src/platform/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/platform/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/platform/main.html b/demos/src/platform/page.html
similarity index 100%
rename from demos/src/platform/main.html
rename to demos/src/platform/page.html
diff --git a/demos/src/popover/AppModule.ts b/demos/src/popover/app.component.ts
similarity index 90%
rename from demos/src/popover/AppModule.ts
rename to demos/src/popover/app.component.ts
index 313c0d4533..a002ae9999 100644
--- a/demos/src/popover/AppModule.ts
+++ b/demos/src/popover/app.component.ts
@@ -1,5 +1,5 @@
-import { Component, NgModule, ElementRef, ViewChild, ViewEncapsulation } from '@angular/core';
-import { IonicApp, IonicModule, NavParams, PopoverController } from 'ionic-angular';
+import { Component, ElementRef, ViewChild, ViewEncapsulation } from '@angular/core';
+import { NavParams, PopoverController } from 'ionic-angular';
 
 
 @Component({
@@ -132,9 +132,8 @@ export class PopoverRadioPage {
   }
 }
 
-
 @Component({
-  templateUrl: 'main.html'
+  templateUrl: 'page.html'
 })
 export class ApiDemoPage {
   @ViewChild('popoverContent', {read: ElementRef}) content: ElementRef;
@@ -155,7 +154,6 @@ export class ApiDemoPage {
 
 }
 
-
 @Component({
   template: '<ion-nav [root]="root"></ion-nav>',
   styleUrls: ['style.css'],
@@ -164,19 +162,3 @@ export class ApiDemoPage {
 export class ApiDemoApp {
   root = ApiDemoPage;
 }
-
-@NgModule({
-  declarations: [
-    PopoverRadioPage,
-    ApiDemoApp,
-    ApiDemoPage
-  ],
-  imports: [
-    IonicModule.forRoot(ApiDemoApp)
-  ],
-  bootstrap: [IonicApp],
-  entryComponents: [
-    ApiDemoPage
-  ]
-})
-export class AppModule {}
diff --git a/demos/src/popover/app.module.ts b/demos/src/popover/app.module.ts
new file mode 100644
index 0000000000..a291ef08d7
--- /dev/null
+++ b/demos/src/popover/app.module.ts
@@ -0,0 +1,18 @@
+import { NgModule } from '@angular/core';
+import { IonicApp, IonicModule } from 'ionic-angular';
+import { ApiDemoApp, ApiDemoPage } from './app.component';
+
+@NgModule({
+  declarations: [
+    ApiDemoApp,
+    ApiDemoPage
+  ],
+  imports: [
+    IonicModule.forRoot(ApiDemoApp)
+  ],
+  bootstrap: [IonicApp],
+  entryComponents: [
+    ApiDemoPage
+  ]
+})
+export class AppModule {}
diff --git a/demos/src/popover/main.ts b/demos/src/popover/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/popover/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/popover/main.html b/demos/src/popover/page.html
similarity index 100%
rename from demos/src/popover/main.html
rename to demos/src/popover/page.html
diff --git a/demos/src/radio/AppModule.ts b/demos/src/radio/AppModule.ts
deleted file mode 100644
index 7480f8c10f..0000000000
--- a/demos/src/radio/AppModule.ts
+++ /dev/null
@@ -1,32 +0,0 @@
-import { Component, NgModule } from '@angular/core';
-import { IonicApp, IonicModule } from 'ionic-angular';
-
-
-@Component({
-  templateUrl: 'main.html'
-})
-export class ApiDemoPage {
-  isDisabled = true;
-}
-
-@Component({
-  template: '<ion-nav [root]="root"></ion-nav>'
-})
-export class ApiDemoApp {
-  root = ApiDemoPage;
-}
-
-@NgModule({
-  declarations: [
-    ApiDemoApp,
-    ApiDemoPage
-  ],
-  imports: [
-    IonicModule.forRoot(ApiDemoApp)
-  ],
-  bootstrap: [IonicApp],
-  entryComponents: [
-    ApiDemoPage
-  ]
-})
-export class AppModule {}
diff --git a/demos/src/radio/app.component.ts b/demos/src/radio/app.component.ts
new file mode 100644
index 0000000000..7d68954d34
--- /dev/null
+++ b/demos/src/radio/app.component.ts
@@ -0,0 +1,16 @@
+import { Component } from '@angular/core';
+
+
+@Component({
+  templateUrl: 'page.html'
+})
+export class ApiDemoPage {
+  isDisabled = true;
+}
+
+@Component({
+  template: '<ion-nav [root]="root"></ion-nav>'
+})
+export class ApiDemoApp {
+  root = ApiDemoPage;
+}
diff --git a/demos/src/radio/app.module.ts b/demos/src/radio/app.module.ts
new file mode 100644
index 0000000000..a291ef08d7
--- /dev/null
+++ b/demos/src/radio/app.module.ts
@@ -0,0 +1,18 @@
+import { NgModule } from '@angular/core';
+import { IonicApp, IonicModule } from 'ionic-angular';
+import { ApiDemoApp, ApiDemoPage } from './app.component';
+
+@NgModule({
+  declarations: [
+    ApiDemoApp,
+    ApiDemoPage
+  ],
+  imports: [
+    IonicModule.forRoot(ApiDemoApp)
+  ],
+  bootstrap: [IonicApp],
+  entryComponents: [
+    ApiDemoPage
+  ]
+})
+export class AppModule {}
diff --git a/demos/src/radio/main.ts b/demos/src/radio/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/radio/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/radio/main.html b/demos/src/radio/page.html
similarity index 100%
rename from demos/src/radio/main.html
rename to demos/src/radio/page.html
diff --git a/demos/src/range/AppModule.ts b/demos/src/range/AppModule.ts
deleted file mode 100644
index 694ecf2462..0000000000
--- a/demos/src/range/AppModule.ts
+++ /dev/null
@@ -1,39 +0,0 @@
-import { Component, NgModule } from '@angular/core';
-import { IonicApp, IonicModule } from 'ionic-angular';
-
-@Component({
-  templateUrl: 'main.html'
-})
-export class ApiDemoPage {
-  brightness: number = 20;
-  saturation: number = 0;
-  warmth: number = 1300;
-  structure: any = {lower: 33, upper: 60};
-
-  onChange(ev) {
-    console.log('Changed', ev);
-  }
-}
-
-
-@Component({
-  template: '<ion-nav [root]="root"></ion-nav>'
-})
-export class ApiDemoApp {
-  root = ApiDemoPage;
-}
-
-@NgModule({
-  declarations: [
-    ApiDemoApp,
-    ApiDemoPage
-  ],
-  imports: [
-    IonicModule.forRoot(ApiDemoApp)
-  ],
-  bootstrap: [IonicApp],
-  entryComponents: [
-    ApiDemoPage
-  ]
-})
-export class AppModule {}
diff --git a/demos/src/range/app.component.ts b/demos/src/range/app.component.ts
new file mode 100644
index 0000000000..2a21c4269a
--- /dev/null
+++ b/demos/src/range/app.component.ts
@@ -0,0 +1,22 @@
+import { Component } from '@angular/core';
+
+@Component({
+  templateUrl: 'page.html'
+})
+export class ApiDemoPage {
+  brightness: number = 20;
+  saturation: number = 0;
+  warmth: number = 1300;
+  structure: any = {lower: 33, upper: 60};
+
+  onChange(ev) {
+    console.log('Changed', ev);
+  }
+}
+
+@Component({
+  template: '<ion-nav [root]="root"></ion-nav>'
+})
+export class ApiDemoApp {
+  root = ApiDemoPage;
+}
diff --git a/demos/src/range/app.module.ts b/demos/src/range/app.module.ts
new file mode 100644
index 0000000000..a291ef08d7
--- /dev/null
+++ b/demos/src/range/app.module.ts
@@ -0,0 +1,18 @@
+import { NgModule } from '@angular/core';
+import { IonicApp, IonicModule } from 'ionic-angular';
+import { ApiDemoApp, ApiDemoPage } from './app.component';
+
+@NgModule({
+  declarations: [
+    ApiDemoApp,
+    ApiDemoPage
+  ],
+  imports: [
+    IonicModule.forRoot(ApiDemoApp)
+  ],
+  bootstrap: [IonicApp],
+  entryComponents: [
+    ApiDemoPage
+  ]
+})
+export class AppModule {}
diff --git a/demos/src/range/main.ts b/demos/src/range/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/range/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/range/main.html b/demos/src/range/page.html
similarity index 100%
rename from demos/src/range/main.html
rename to demos/src/range/page.html
diff --git a/demos/src/refresher/AppModule.ts b/demos/src/refresher/app.component.ts
similarity index 82%
rename from demos/src/refresher/AppModule.ts
rename to demos/src/refresher/app.component.ts
index d19c6876da..4aab873f70 100644
--- a/demos/src/refresher/AppModule.ts
+++ b/demos/src/refresher/app.component.ts
@@ -1,6 +1,6 @@
-import { Component, NgModule, Injectable } from '@angular/core';
+import { Component, Injectable } from '@angular/core';
 
-import { IonicApp, IonicModule, Refresher } from 'ionic-angular';
+import { Refresher } from 'ionic-angular';
 
 
 /**
@@ -65,7 +65,7 @@ export class MockProvider {
 
 
 @Component({
-  templateUrl: 'main.html',
+  templateUrl: 'page.html',
   providers: [MockProvider]
 })
 export class ApiDemoPage {
@@ -99,19 +99,3 @@ export class ApiDemoPage {
 export class ApiDemoApp {
   root = ApiDemoPage;
 }
-
-@NgModule({
-  declarations: [
-    ApiDemoApp,
-    ApiDemoPage,
-    MockProvider
-  ],
-  imports: [
-    IonicModule.forRoot(ApiDemoApp)
-  ],
-  bootstrap: [IonicApp],
-  entryComponents: [
-    ApiDemoPage
-  ]
-})
-export class AppModule {}
diff --git a/demos/src/refresher/app.module.ts b/demos/src/refresher/app.module.ts
new file mode 100644
index 0000000000..a291ef08d7
--- /dev/null
+++ b/demos/src/refresher/app.module.ts
@@ -0,0 +1,18 @@
+import { NgModule } from '@angular/core';
+import { IonicApp, IonicModule } from 'ionic-angular';
+import { ApiDemoApp, ApiDemoPage } from './app.component';
+
+@NgModule({
+  declarations: [
+    ApiDemoApp,
+    ApiDemoPage
+  ],
+  imports: [
+    IonicModule.forRoot(ApiDemoApp)
+  ],
+  bootstrap: [IonicApp],
+  entryComponents: [
+    ApiDemoPage
+  ]
+})
+export class AppModule {}
diff --git a/demos/src/refresher/main.ts b/demos/src/refresher/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/refresher/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/refresher/main.html b/demos/src/refresher/page.html
similarity index 100%
rename from demos/src/refresher/main.html
rename to demos/src/refresher/page.html
diff --git a/demos/src/scroll/AppModule.ts b/demos/src/scroll/AppModule.ts
deleted file mode 100644
index 739a83c887..0000000000
--- a/demos/src/scroll/AppModule.ts
+++ /dev/null
@@ -1,32 +0,0 @@
-import { Component, NgModule } from '@angular/core';
-
-import { IonicApp, IonicModule } from 'ionic-angular';
-
-
-@Component({
-  templateUrl: 'main.html'
-})
-export class ApiDemoPage {}
-
-
-@Component({
-  template: '<ion-nav [root]="root"></ion-nav>'
-})
-export class ApiDemoApp {
-  root = ApiDemoPage;
-}
-
-@NgModule({
-  declarations: [
-    ApiDemoApp,
-    ApiDemoPage
-  ],
-  imports: [
-    IonicModule.forRoot(ApiDemoApp)
-  ],
-  bootstrap: [IonicApp],
-  entryComponents: [
-    ApiDemoPage
-  ]
-})
-export class AppModule {}
diff --git a/demos/src/scroll/app.component.ts b/demos/src/scroll/app.component.ts
new file mode 100644
index 0000000000..76a8f07066
--- /dev/null
+++ b/demos/src/scroll/app.component.ts
@@ -0,0 +1,15 @@
+import { Component } from '@angular/core';
+
+@Component({
+  templateUrl: 'page.html'
+})
+export class ApiDemoPage {}
+
+
+@Component({
+  template: '<ion-nav [root]="root"></ion-nav>'
+})
+export class ApiDemoApp {
+  root = ApiDemoPage;
+}
+
diff --git a/demos/src/scroll/app.module.ts b/demos/src/scroll/app.module.ts
new file mode 100644
index 0000000000..a291ef08d7
--- /dev/null
+++ b/demos/src/scroll/app.module.ts
@@ -0,0 +1,18 @@
+import { NgModule } from '@angular/core';
+import { IonicApp, IonicModule } from 'ionic-angular';
+import { ApiDemoApp, ApiDemoPage } from './app.component';
+
+@NgModule({
+  declarations: [
+    ApiDemoApp,
+    ApiDemoPage
+  ],
+  imports: [
+    IonicModule.forRoot(ApiDemoApp)
+  ],
+  bootstrap: [IonicApp],
+  entryComponents: [
+    ApiDemoPage
+  ]
+})
+export class AppModule {}
diff --git a/demos/src/scroll/main.ts b/demos/src/scroll/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/scroll/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/scroll/main.html b/demos/src/scroll/page.html
similarity index 100%
rename from demos/src/scroll/main.html
rename to demos/src/scroll/page.html
diff --git a/demos/src/searchbar/AppModule.ts b/demos/src/searchbar/app.component.ts
similarity index 64%
rename from demos/src/searchbar/AppModule.ts
rename to demos/src/searchbar/app.component.ts
index bf51ed793d..fbc0efd51b 100644
--- a/demos/src/searchbar/AppModule.ts
+++ b/demos/src/searchbar/app.component.ts
@@ -1,10 +1,7 @@
-import { Component, NgModule } from '@angular/core';
-
-import { IonicApp, IonicModule } from 'ionic-angular';
-
+import { Component } from '@angular/core';
 
 @Component({
-  templateUrl: 'main.html'
+  templateUrl: 'page.html'
 })
 export class ApiDemoPage {
   items: Array<string>;
@@ -29,25 +26,9 @@ export class ApiDemoPage {
   }
 }
 
-
 @Component({
   template: '<ion-nav [root]="root"></ion-nav>'
 })
 export class ApiDemoApp {
   root = ApiDemoPage;
 }
-
-@NgModule({
-  declarations: [
-    ApiDemoApp,
-    ApiDemoPage
-  ],
-  imports: [
-    IonicModule.forRoot(ApiDemoApp)
-  ],
-  bootstrap: [IonicApp],
-  entryComponents: [
-    ApiDemoPage
-  ]
-})
-export class AppModule {}
diff --git a/demos/src/searchbar/app.module.ts b/demos/src/searchbar/app.module.ts
new file mode 100644
index 0000000000..a291ef08d7
--- /dev/null
+++ b/demos/src/searchbar/app.module.ts
@@ -0,0 +1,18 @@
+import { NgModule } from '@angular/core';
+import { IonicApp, IonicModule } from 'ionic-angular';
+import { ApiDemoApp, ApiDemoPage } from './app.component';
+
+@NgModule({
+  declarations: [
+    ApiDemoApp,
+    ApiDemoPage
+  ],
+  imports: [
+    IonicModule.forRoot(ApiDemoApp)
+  ],
+  bootstrap: [IonicApp],
+  entryComponents: [
+    ApiDemoPage
+  ]
+})
+export class AppModule {}
diff --git a/demos/src/searchbar/main.ts b/demos/src/searchbar/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/searchbar/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/searchbar/main.html b/demos/src/searchbar/page.html
similarity index 100%
rename from demos/src/searchbar/main.html
rename to demos/src/searchbar/page.html
diff --git a/demos/src/segment/AppModule.ts b/demos/src/segment/app.component.ts
similarity index 79%
rename from demos/src/segment/AppModule.ts
rename to demos/src/segment/app.component.ts
index d38fb013dc..1c810291bf 100644
--- a/demos/src/segment/AppModule.ts
+++ b/demos/src/segment/app.component.ts
@@ -1,10 +1,7 @@
-import { Component, NgModule } from '@angular/core';
-
-import { IonicApp, IonicModule } from 'ionic-angular';
-
+import { Component } from '@angular/core';
 
 @Component({
-  templateUrl: 'main.html'
+  templateUrl: 'page.html'
 })
 export class ApiDemoPage {
   appType = 'Paid';
@@ -93,19 +90,3 @@ export class ApiDemoPage {
 export class ApiDemoApp {
   root = ApiDemoPage;
 }
-
-@NgModule({
-  declarations: [
-    ApiDemoApp,
-    ApiDemoPage
-  ],
-  imports: [
-    IonicModule.forRoot(ApiDemoApp)
-  ],
-  bootstrap: [IonicApp],
-  entryComponents: [
-    ApiDemoPage
-  ]
-})
-export class AppModule {}
-
diff --git a/demos/src/segment/app.module.ts b/demos/src/segment/app.module.ts
new file mode 100644
index 0000000000..a291ef08d7
--- /dev/null
+++ b/demos/src/segment/app.module.ts
@@ -0,0 +1,18 @@
+import { NgModule } from '@angular/core';
+import { IonicApp, IonicModule } from 'ionic-angular';
+import { ApiDemoApp, ApiDemoPage } from './app.component';
+
+@NgModule({
+  declarations: [
+    ApiDemoApp,
+    ApiDemoPage
+  ],
+  imports: [
+    IonicModule.forRoot(ApiDemoApp)
+  ],
+  bootstrap: [IonicApp],
+  entryComponents: [
+    ApiDemoPage
+  ]
+})
+export class AppModule {}
diff --git a/demos/src/segment/main.ts b/demos/src/segment/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/segment/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/segment/main.html b/demos/src/segment/page.html
similarity index 100%
rename from demos/src/segment/main.html
rename to demos/src/segment/page.html
diff --git a/demos/src/select/AppModule.ts b/demos/src/select/app.component.ts
similarity index 71%
rename from demos/src/select/AppModule.ts
rename to demos/src/select/app.component.ts
index bf1c43b6ae..5187ee51e7 100644
--- a/demos/src/select/AppModule.ts
+++ b/demos/src/select/app.component.ts
@@ -1,8 +1,7 @@
-import { Component, NgModule } from '@angular/core';
-import { IonicApp, IonicModule } from 'ionic-angular';
+import { Component } from '@angular/core';
 
 @Component({
-  templateUrl: 'main.html'
+  templateUrl: 'page.html'
 })
 export class ApiDemoPage {
   gender: string;
@@ -51,18 +50,3 @@ export class ApiDemoPage {
 export class ApiDemoApp {
   root = ApiDemoPage;
 }
-
-@NgModule({
-  declarations: [
-    ApiDemoApp,
-    ApiDemoPage
-  ],
-  imports: [
-    IonicModule.forRoot(ApiDemoApp)
-  ],
-  bootstrap: [IonicApp],
-  entryComponents: [
-    ApiDemoPage
-  ]
-})
-export class AppModule {}
diff --git a/demos/src/select/app.module.ts b/demos/src/select/app.module.ts
new file mode 100644
index 0000000000..a291ef08d7
--- /dev/null
+++ b/demos/src/select/app.module.ts
@@ -0,0 +1,18 @@
+import { NgModule } from '@angular/core';
+import { IonicApp, IonicModule } from 'ionic-angular';
+import { ApiDemoApp, ApiDemoPage } from './app.component';
+
+@NgModule({
+  declarations: [
+    ApiDemoApp,
+    ApiDemoPage
+  ],
+  imports: [
+    IonicModule.forRoot(ApiDemoApp)
+  ],
+  bootstrap: [IonicApp],
+  entryComponents: [
+    ApiDemoPage
+  ]
+})
+export class AppModule {}
diff --git a/demos/src/select/main.ts b/demos/src/select/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/select/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/select/main.html b/demos/src/select/page.html
similarity index 100%
rename from demos/src/select/main.html
rename to demos/src/select/page.html
diff --git a/demos/src/show-when/app.component.ts b/demos/src/show-when/app.component.ts
new file mode 100644
index 0000000000..5e716e3d84
--- /dev/null
+++ b/demos/src/show-when/app.component.ts
@@ -0,0 +1,14 @@
+import { Component } from '@angular/core';
+
+@Component({
+  templateUrl: 'page.html'
+})
+export class ApiDemoPage {}
+
+
+@Component({
+  template: '<ion-nav [root]="root"></ion-nav>'
+})
+export class ApiDemoApp {
+  root = ApiDemoPage;
+}
diff --git a/demos/src/show-when/app.module.ts b/demos/src/show-when/app.module.ts
new file mode 100644
index 0000000000..a291ef08d7
--- /dev/null
+++ b/demos/src/show-when/app.module.ts
@@ -0,0 +1,18 @@
+import { NgModule } from '@angular/core';
+import { IonicApp, IonicModule } from 'ionic-angular';
+import { ApiDemoApp, ApiDemoPage } from './app.component';
+
+@NgModule({
+  declarations: [
+    ApiDemoApp,
+    ApiDemoPage
+  ],
+  imports: [
+    IonicModule.forRoot(ApiDemoApp)
+  ],
+  bootstrap: [IonicApp],
+  entryComponents: [
+    ApiDemoPage
+  ]
+})
+export class AppModule {}
diff --git a/demos/src/show-when/main.ts b/demos/src/show-when/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/show-when/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/show-when/main.html b/demos/src/show-when/page.html
similarity index 100%
rename from demos/src/show-when/main.html
rename to demos/src/show-when/page.html
diff --git a/demos/src/slides/app.component.ts b/demos/src/slides/app.component.ts
new file mode 100644
index 0000000000..5e716e3d84
--- /dev/null
+++ b/demos/src/slides/app.component.ts
@@ -0,0 +1,14 @@
+import { Component } from '@angular/core';
+
+@Component({
+  templateUrl: 'page.html'
+})
+export class ApiDemoPage {}
+
+
+@Component({
+  template: '<ion-nav [root]="root"></ion-nav>'
+})
+export class ApiDemoApp {
+  root = ApiDemoPage;
+}
diff --git a/demos/src/slides/app.module.ts b/demos/src/slides/app.module.ts
new file mode 100644
index 0000000000..a291ef08d7
--- /dev/null
+++ b/demos/src/slides/app.module.ts
@@ -0,0 +1,18 @@
+import { NgModule } from '@angular/core';
+import { IonicApp, IonicModule } from 'ionic-angular';
+import { ApiDemoApp, ApiDemoPage } from './app.component';
+
+@NgModule({
+  declarations: [
+    ApiDemoApp,
+    ApiDemoPage
+  ],
+  imports: [
+    IonicModule.forRoot(ApiDemoApp)
+  ],
+  bootstrap: [IonicApp],
+  entryComponents: [
+    ApiDemoPage
+  ]
+})
+export class AppModule {}
diff --git a/demos/src/slides/main.ts b/demos/src/slides/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/slides/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/slides/main.html b/demos/src/slides/page.html
similarity index 100%
rename from demos/src/slides/main.html
rename to demos/src/slides/page.html
diff --git a/demos/src/tabs/AppModule.ts b/demos/src/tabs/app.component.ts
similarity index 62%
rename from demos/src/tabs/AppModule.ts
rename to demos/src/tabs/app.component.ts
index 9e78a03b8e..fa2f9d4df8 100644
--- a/demos/src/tabs/AppModule.ts
+++ b/demos/src/tabs/app.component.ts
@@ -8,7 +8,7 @@ export class TabPage {}
 
 
 @Component({
-  templateUrl: 'main.html',
+  templateUrl: 'page.html',
   styleUrls: ['style.css'],
   encapsulation: ViewEncapsulation.None
 })
@@ -24,18 +24,3 @@ export class ApiDemoApp {
   root = ApiDemoPage;
 }
 
-@NgModule({
-  declarations: [
-    ApiDemoApp,
-    ApiDemoPage,
-    TabPage
-  ],
-  imports: [
-    IonicModule.forRoot(ApiDemoApp)
-  ],
-  bootstrap: [IonicApp],
-  entryComponents: [
-    ApiDemoPage
-  ]
-})
-export class AppModule {}
diff --git a/demos/src/tabs/app.module.ts b/demos/src/tabs/app.module.ts
new file mode 100644
index 0000000000..0d00ef6563
--- /dev/null
+++ b/demos/src/tabs/app.module.ts
@@ -0,0 +1,19 @@
+import { NgModule } from '@angular/core';
+import { IonicApp, IonicModule } from 'ionic-angular';
+import { ApiDemoApp, ApiDemoPage, TabPage } from './app.component';
+
+@NgModule({
+  declarations: [
+    ApiDemoApp,
+    ApiDemoPage,
+    TabPage
+  ],
+  imports: [
+    IonicModule.forRoot(ApiDemoApp)
+  ],
+  bootstrap: [IonicApp],
+  entryComponents: [
+    ApiDemoPage
+  ]
+})
+export class AppModule {}
\ No newline at end of file
diff --git a/demos/src/tabs/main.ts b/demos/src/tabs/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/tabs/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/tabs/main.html b/demos/src/tabs/page.html
similarity index 100%
rename from demos/src/tabs/main.html
rename to demos/src/tabs/page.html
diff --git a/demos/src/textarea/app.component.ts b/demos/src/textarea/app.component.ts
new file mode 100644
index 0000000000..5e716e3d84
--- /dev/null
+++ b/demos/src/textarea/app.component.ts
@@ -0,0 +1,14 @@
+import { Component } from '@angular/core';
+
+@Component({
+  templateUrl: 'page.html'
+})
+export class ApiDemoPage {}
+
+
+@Component({
+  template: '<ion-nav [root]="root"></ion-nav>'
+})
+export class ApiDemoApp {
+  root = ApiDemoPage;
+}
diff --git a/demos/src/textarea/app.module.ts b/demos/src/textarea/app.module.ts
new file mode 100644
index 0000000000..0d00ef6563
--- /dev/null
+++ b/demos/src/textarea/app.module.ts
@@ -0,0 +1,19 @@
+import { NgModule } from '@angular/core';
+import { IonicApp, IonicModule } from 'ionic-angular';
+import { ApiDemoApp, ApiDemoPage, TabPage } from './app.component';
+
+@NgModule({
+  declarations: [
+    ApiDemoApp,
+    ApiDemoPage,
+    TabPage
+  ],
+  imports: [
+    IonicModule.forRoot(ApiDemoApp)
+  ],
+  bootstrap: [IonicApp],
+  entryComponents: [
+    ApiDemoPage
+  ]
+})
+export class AppModule {}
\ No newline at end of file
diff --git a/demos/src/textarea/main.ts b/demos/src/textarea/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/textarea/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/textarea/main.html b/demos/src/textarea/page.html
similarity index 100%
rename from demos/src/textarea/main.html
rename to demos/src/textarea/page.html
diff --git a/demos/src/title/AppModule.ts b/demos/src/title/AppModule.ts
deleted file mode 100644
index 15a7e3fb8b..0000000000
--- a/demos/src/title/AppModule.ts
+++ /dev/null
@@ -1,36 +0,0 @@
-import { Component, NgModule } from '@angular/core';
-import { IonicApp, IonicModule } from 'ionic-angular';
-
-// Use the toolbar demo but pass in the demo name to change the title
-// this will also hide some of the toolbars that don't use `ion-title`
-@Component({
-  templateUrl: '../toolbar/main.html'
-})
-export class ApiDemoPage {
-  demo = 'Title';
-  favorites = 'recent';
-  apps = 'free';
-}
-
-
-@Component({
-  template: '<ion-nav [root]="root"></ion-nav>'
-})
-export class ApiDemoApp {
-  root = ApiDemoPage;
-}
-
-@NgModule({
-  declarations: [
-    ApiDemoApp,
-    ApiDemoPage
-  ],
-  imports: [
-    IonicModule.forRoot(ApiDemoApp)
-  ],
-  bootstrap: [IonicApp],
-  entryComponents: [
-    ApiDemoPage
-  ]
-})
-export class AppModule {}
diff --git a/demos/src/title/app.component.ts b/demos/src/title/app.component.ts
new file mode 100644
index 0000000000..444d82fc34
--- /dev/null
+++ b/demos/src/title/app.component.ts
@@ -0,0 +1,20 @@
+import { Component } from '@angular/core';
+
+// Use the toolbar demo but pass in the demo name to change the title
+// this will also hide some of the toolbars that don't use `ion-title`
+@Component({
+  templateUrl: 'page.html'
+})
+export class ApiDemoPage {
+  demo = 'Title';
+  favorites = 'recent';
+  apps = 'free';
+}
+
+
+@Component({
+  template: '<ion-nav [root]="root"></ion-nav>'
+})
+export class ApiDemoApp {
+  root = ApiDemoPage;
+}
diff --git a/demos/src/title/app.module.ts b/demos/src/title/app.module.ts
new file mode 100644
index 0000000000..0d00ef6563
--- /dev/null
+++ b/demos/src/title/app.module.ts
@@ -0,0 +1,19 @@
+import { NgModule } from '@angular/core';
+import { IonicApp, IonicModule } from 'ionic-angular';
+import { ApiDemoApp, ApiDemoPage, TabPage } from './app.component';
+
+@NgModule({
+  declarations: [
+    ApiDemoApp,
+    ApiDemoPage,
+    TabPage
+  ],
+  imports: [
+    IonicModule.forRoot(ApiDemoApp)
+  ],
+  bootstrap: [IonicApp],
+  entryComponents: [
+    ApiDemoPage
+  ]
+})
+export class AppModule {}
\ No newline at end of file
diff --git a/demos/src/title/main.ts b/demos/src/title/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/title/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/title/page.html b/demos/src/title/page.html
new file mode 100644
index 0000000000..1359b1b6c8
--- /dev/null
+++ b/demos/src/title/page.html
@@ -0,0 +1,132 @@
+<ion-header>
+
+  <ion-navbar>
+    <ion-title>{{demo}}</ion-title>
+  </ion-navbar>
+
+</ion-header>
+
+
+<ion-content>
+
+  <ion-toolbar no-border-top>
+    <ion-title>Long title that never ends. It just goes on and on my friend.</ion-title>
+  </ion-toolbar>
+
+  <ion-toolbar no-border-top>
+    <ion-buttons start>
+      <button ion-button icon-only>
+        <ion-icon name="contact"></ion-icon>
+      </button>
+      <button ion-button icon-only>
+        <ion-icon name="search"></ion-icon>
+      </button>
+    </ion-buttons>
+    <ion-buttons end>
+      <button ion-button icon-only>
+        <ion-icon name="more"></ion-icon>
+      </button>
+    </ion-buttons>
+    <ion-title>Default Buttons</ion-title>
+  </ion-toolbar>
+
+  <ion-toolbar no-border-top>
+    <ion-buttons start>
+      <button ion-button icon-only color="danger">
+        <ion-icon name="contact"></ion-icon>
+      </button>
+      <button ion-button icon-only color="secondary">
+        <ion-icon name="search"></ion-icon>
+      </button>
+    </ion-buttons>
+    <ion-buttons end>
+      <button ion-button icon-only color="dark">
+        <ion-icon name="more"></ion-icon>
+      </button>
+    </ion-buttons>
+    <ion-title>Colored Buttons</ion-title>
+  </ion-toolbar>
+
+  <ion-toolbar no-border-top>
+    <ion-buttons start>
+      <button  ion-button icon-only solid>
+        <ion-icon name="contact"></ion-icon>
+      </button>
+    </ion-buttons>
+    <ion-title>Solid</ion-title>
+    <ion-buttons end>
+      <button  ion-button icon-right solid color="secondary">
+        Help
+        <ion-icon name="help-circle"></ion-icon>
+      </button>
+    </ion-buttons>
+  </ion-toolbar>
+
+  <ion-toolbar no-border-top>
+    <ion-buttons start>
+      <button  ion-button icon-only outline>
+        <ion-icon name="contact"></ion-icon>
+      </button>
+    </ion-buttons>
+    <ion-buttons end>
+      <button  ion-button icon-right outline color="secondary">
+        Help
+        <ion-icon name="help-circle"></ion-icon>
+      </button>
+    </ion-buttons>
+    <ion-title>Outline</ion-title>
+  </ion-toolbar>
+
+  <ion-toolbar no-border-top>
+    <button  ion-button icon-only menuToggle>
+      <ion-icon name="menu"></ion-icon>
+    </button>
+    <ion-title>Left Menu</ion-title>
+  </ion-toolbar>
+
+  <ion-toolbar no-border-top>
+    <ion-title>Right Menu</ion-title>
+    <button  ion-button menuToggle right>
+      <ion-icon name="menu"></ion-icon>
+    </button>
+  </ion-toolbar>
+
+  <ion-toolbar no-border-top *ngIf="demo != 'Title'">
+    <ion-buttons end>
+      <button  ion-button icon-only #button2 (click)="buttonClick(button2)">
+        <ion-icon name="search"></ion-icon>
+      </button>
+    </ion-buttons>
+    <ion-segment color="danger" [(ngModel)]="favorites">
+      <ion-segment-button value="featured">
+        Featured
+      </ion-segment-button>
+      <ion-segment-button value="recent">
+        Recent
+      </ion-segment-button>
+    </ion-segment>
+  </ion-toolbar>
+
+  <ion-toolbar no-border-top *ngIf="demo != 'Title'">
+    <ion-segment [(ngModel)]="apps">
+      <ion-segment-button value="paid">
+        Paid
+      </ion-segment-button>
+      <ion-segment-button value="free">
+        Free
+      </ion-segment-button>
+      <ion-segment-button value="top">
+        Top
+      </ion-segment-button>
+    </ion-segment>
+  </ion-toolbar>
+
+  <ion-toolbar no-border-top *ngIf="demo != 'Title'">
+    <ion-searchbar></ion-searchbar>
+  </ion-toolbar>
+
+  <ion-toolbar no-border-top color="primary" *ngIf="demo != 'Title'">
+    <ion-searchbar></ion-searchbar>
+  </ion-toolbar>
+
+</ion-content>
diff --git a/demos/src/toast/AppModule.ts b/demos/src/toast/app.component.ts
similarity index 80%
rename from demos/src/toast/AppModule.ts
rename to demos/src/toast/app.component.ts
index 1d2f753785..d0d1367598 100644
--- a/demos/src/toast/AppModule.ts
+++ b/demos/src/toast/app.component.ts
@@ -1,8 +1,8 @@
-import { Component, NgModule } from '@angular/core';
-import { IonicApp, IonicModule, ToastController } from 'ionic-angular';
+import { Component } from '@angular/core';
+import { ToastController } from 'ionic-angular';
 
 @Component({
-  templateUrl: 'main.html'
+  templateUrl: 'page.html'
 })
 export class ApiDemoPage {
   constructor(private toastCtrl: ToastController) { }
@@ -60,18 +60,3 @@ export class ApiDemoPage {
 export class ApiDemoApp {
   root = ApiDemoPage;
 }
-
-@NgModule({
-  declarations: [
-    ApiDemoApp,
-    ApiDemoPage
-  ],
-  imports: [
-    IonicModule.forRoot(ApiDemoApp)
-  ],
-  bootstrap: [IonicApp],
-  entryComponents: [
-    ApiDemoPage
-  ]
-})
-export class AppModule {}
diff --git a/demos/src/toast/app.module.ts b/demos/src/toast/app.module.ts
new file mode 100644
index 0000000000..0d00ef6563
--- /dev/null
+++ b/demos/src/toast/app.module.ts
@@ -0,0 +1,19 @@
+import { NgModule } from '@angular/core';
+import { IonicApp, IonicModule } from 'ionic-angular';
+import { ApiDemoApp, ApiDemoPage, TabPage } from './app.component';
+
+@NgModule({
+  declarations: [
+    ApiDemoApp,
+    ApiDemoPage,
+    TabPage
+  ],
+  imports: [
+    IonicModule.forRoot(ApiDemoApp)
+  ],
+  bootstrap: [IonicApp],
+  entryComponents: [
+    ApiDemoPage
+  ]
+})
+export class AppModule {}
\ No newline at end of file
diff --git a/demos/src/toast/main.ts b/demos/src/toast/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/toast/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/toast/main.html b/demos/src/toast/page.html
similarity index 100%
rename from demos/src/toast/main.html
rename to demos/src/toast/page.html
diff --git a/demos/src/toggle/AppModule.ts b/demos/src/toggle/app.component.ts
similarity index 51%
rename from demos/src/toggle/AppModule.ts
rename to demos/src/toggle/app.component.ts
index 7db4a3153e..aee8b3ddb2 100644
--- a/demos/src/toggle/AppModule.ts
+++ b/demos/src/toggle/app.component.ts
@@ -1,8 +1,7 @@
-import { Component, NgModule } from '@angular/core';
-import { IonicApp, IonicModule } from 'ionic-angular';
+import { Component } from '@angular/core';
 
 @Component({
-  templateUrl: 'main.html'
+  templateUrl: 'page.html'
 })
 export class ApiDemoPage {
   data = {
@@ -27,18 +26,3 @@ export class ApiDemoPage {
 export class ApiDemoApp {
   root = ApiDemoPage;
 }
-
-@NgModule({
-  declarations: [
-    ApiDemoApp,
-    ApiDemoPage
-  ],
-  imports: [
-    IonicModule.forRoot(ApiDemoApp)
-  ],
-  bootstrap: [IonicApp],
-  entryComponents: [
-    ApiDemoPage
-  ]
-})
-export class AppModule {}
diff --git a/demos/src/toggle/app.module.ts b/demos/src/toggle/app.module.ts
new file mode 100644
index 0000000000..0d00ef6563
--- /dev/null
+++ b/demos/src/toggle/app.module.ts
@@ -0,0 +1,19 @@
+import { NgModule } from '@angular/core';
+import { IonicApp, IonicModule } from 'ionic-angular';
+import { ApiDemoApp, ApiDemoPage, TabPage } from './app.component';
+
+@NgModule({
+  declarations: [
+    ApiDemoApp,
+    ApiDemoPage,
+    TabPage
+  ],
+  imports: [
+    IonicModule.forRoot(ApiDemoApp)
+  ],
+  bootstrap: [IonicApp],
+  entryComponents: [
+    ApiDemoPage
+  ]
+})
+export class AppModule {}
\ No newline at end of file
diff --git a/demos/src/toggle/main.ts b/demos/src/toggle/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/toggle/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/toggle/main.html b/demos/src/toggle/page.html
similarity index 100%
rename from demos/src/toggle/main.html
rename to demos/src/toggle/page.html
diff --git a/demos/src/toolbar/AppModule.ts b/demos/src/toolbar/AppModule.ts
deleted file mode 100644
index 79abca60c5..0000000000
--- a/demos/src/toolbar/AppModule.ts
+++ /dev/null
@@ -1,33 +0,0 @@
-import { Component, NgModule } from '@angular/core';
-import { IonicApp, IonicModule } from 'ionic-angular';
-
-@Component({
-  templateUrl: 'main.html'
-})
-export class ApiDemoPage {
-  demo = 'Toolbar';
-  favorites = 'recent';
-  apps = 'free';
-}
-
-@Component({
-  template: '<ion-nav [root]="root"></ion-nav>'
-})
-export class ApiDemoApp {
-  root = ApiDemoPage;
-}
-
-@NgModule({
-  declarations: [
-    ApiDemoApp,
-    ApiDemoPage
-  ],
-  imports: [
-    IonicModule.forRoot(ApiDemoApp)
-  ],
-  bootstrap: [IonicApp],
-  entryComponents: [
-    ApiDemoPage
-  ]
-})
-export class AppModule {}
diff --git a/demos/src/toolbar/app.component.ts b/demos/src/toolbar/app.component.ts
new file mode 100644
index 0000000000..e086c36e4a
--- /dev/null
+++ b/demos/src/toolbar/app.component.ts
@@ -0,0 +1,17 @@
+import { Component } from '@angular/core';
+
+@Component({
+  templateUrl: 'page.html'
+})
+export class ApiDemoPage {
+  demo = 'Toolbar';
+  favorites = 'recent';
+  apps = 'free';
+}
+
+@Component({
+  template: '<ion-nav [root]="root"></ion-nav>'
+})
+export class ApiDemoApp {
+  root = ApiDemoPage;
+}
diff --git a/demos/src/toolbar/app.module.ts b/demos/src/toolbar/app.module.ts
new file mode 100644
index 0000000000..0d00ef6563
--- /dev/null
+++ b/demos/src/toolbar/app.module.ts
@@ -0,0 +1,19 @@
+import { NgModule } from '@angular/core';
+import { IonicApp, IonicModule } from 'ionic-angular';
+import { ApiDemoApp, ApiDemoPage, TabPage } from './app.component';
+
+@NgModule({
+  declarations: [
+    ApiDemoApp,
+    ApiDemoPage,
+    TabPage
+  ],
+  imports: [
+    IonicModule.forRoot(ApiDemoApp)
+  ],
+  bootstrap: [IonicApp],
+  entryComponents: [
+    ApiDemoPage
+  ]
+})
+export class AppModule {}
\ No newline at end of file
diff --git a/demos/src/toolbar/main.ts b/demos/src/toolbar/main.ts
new file mode 100644
index 0000000000..3129863a84
--- /dev/null
+++ b/demos/src/toolbar/main.ts
@@ -0,0 +1,6 @@
+import { platformBrowser } from '@angular/platform-browser';
+import { enableProdMode } from '@angular/core';
+import { AppModuleNgFactory } from './app.module.ngfactory';
+
+enableProdMode();
+platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/demos/src/toolbar/page.html b/demos/src/toolbar/page.html
new file mode 100644
index 0000000000..1359b1b6c8
--- /dev/null
+++ b/demos/src/toolbar/page.html
@@ -0,0 +1,132 @@
+<ion-header>
+
+  <ion-navbar>
+    <ion-title>{{demo}}</ion-title>
+  </ion-navbar>
+
+</ion-header>
+
+
+<ion-content>
+
+  <ion-toolbar no-border-top>
+    <ion-title>Long title that never ends. It just goes on and on my friend.</ion-title>
+  </ion-toolbar>
+
+  <ion-toolbar no-border-top>
+    <ion-buttons start>
+      <button ion-button icon-only>
+        <ion-icon name="contact"></ion-icon>
+      </button>
+      <button ion-button icon-only>
+        <ion-icon name="search"></ion-icon>
+      </button>
+    </ion-buttons>
+    <ion-buttons end>
+      <button ion-button icon-only>
+        <ion-icon name="more"></ion-icon>
+      </button>
+    </ion-buttons>
+    <ion-title>Default Buttons</ion-title>
+  </ion-toolbar>
+
+  <ion-toolbar no-border-top>
+    <ion-buttons start>
+      <button ion-button icon-only color="danger">
+        <ion-icon name="contact"></ion-icon>
+      </button>
+      <button ion-button icon-only color="secondary">
+        <ion-icon name="search"></ion-icon>
+      </button>
+    </ion-buttons>
+    <ion-buttons end>
+      <button ion-button icon-only color="dark">
+        <ion-icon name="more"></ion-icon>
+      </button>
+    </ion-buttons>
+    <ion-title>Colored Buttons</ion-title>
+  </ion-toolbar>
+
+  <ion-toolbar no-border-top>
+    <ion-buttons start>
+      <button  ion-button icon-only solid>
+        <ion-icon name="contact"></ion-icon>
+      </button>
+    </ion-buttons>
+    <ion-title>Solid</ion-title>
+    <ion-buttons end>
+      <button  ion-button icon-right solid color="secondary">
+        Help
+        <ion-icon name="help-circle"></ion-icon>
+      </button>
+    </ion-buttons>
+  </ion-toolbar>
+
+  <ion-toolbar no-border-top>
+    <ion-buttons start>
+      <button  ion-button icon-only outline>
+        <ion-icon name="contact"></ion-icon>
+      </button>
+    </ion-buttons>
+    <ion-buttons end>
+      <button  ion-button icon-right outline color="secondary">
+        Help
+        <ion-icon name="help-circle"></ion-icon>
+      </button>
+    </ion-buttons>
+    <ion-title>Outline</ion-title>
+  </ion-toolbar>
+
+  <ion-toolbar no-border-top>
+    <button  ion-button icon-only menuToggle>
+      <ion-icon name="menu"></ion-icon>
+    </button>
+    <ion-title>Left Menu</ion-title>
+  </ion-toolbar>
+
+  <ion-toolbar no-border-top>
+    <ion-title>Right Menu</ion-title>
+    <button  ion-button menuToggle right>
+      <ion-icon name="menu"></ion-icon>
+    </button>
+  </ion-toolbar>
+
+  <ion-toolbar no-border-top *ngIf="demo != 'Title'">
+    <ion-buttons end>
+      <button  ion-button icon-only #button2 (click)="buttonClick(button2)">
+        <ion-icon name="search"></ion-icon>
+      </button>
+    </ion-buttons>
+    <ion-segment color="danger" [(ngModel)]="favorites">
+      <ion-segment-button value="featured">
+        Featured
+      </ion-segment-button>
+      <ion-segment-button value="recent">
+        Recent
+      </ion-segment-button>
+    </ion-segment>
+  </ion-toolbar>
+
+  <ion-toolbar no-border-top *ngIf="demo != 'Title'">
+    <ion-segment [(ngModel)]="apps">
+      <ion-segment-button value="paid">
+        Paid
+      </ion-segment-button>
+      <ion-segment-button value="free">
+        Free
+      </ion-segment-button>
+      <ion-segment-button value="top">
+        Top
+      </ion-segment-button>
+    </ion-segment>
+  </ion-toolbar>
+
+  <ion-toolbar no-border-top *ngIf="demo != 'Title'">
+    <ion-searchbar></ion-searchbar>
+  </ion-toolbar>
+
+  <ion-toolbar no-border-top color="primary" *ngIf="demo != 'Title'">
+    <ion-searchbar></ion-searchbar>
+  </ion-toolbar>
+
+</ion-content>
diff --git a/scripts/gulp/tasks/demos.ts b/scripts/gulp/tasks/demos.ts
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/tsconfig.json b/tsconfig.json
index e63f488a2a..64eae7b242 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -13,7 +13,8 @@
     "types": ["jasmine", "protractor"]
   },
   "include": [
-    "./src/**/*.ts"
+    "./src/**/*.ts",
+    "./demos/src/**/*.ts"
   ],
   "compileOnSave": false,
   "buildOnSave": false,