diff --git a/app/app.component.html b/app/app.component.html
index f69bb09..07375e7 100644
--- a/app/app.component.html
+++ b/app/app.component.html
@@ -1 +1,12 @@
 <h1>Hello!</h1>
+<div>
+    <div>
+        <label>id:</label>
+        {{ duck.id }}
+    </div>
+    <div>
+        <label>color:</label>
+        <input [(ngModel)]="duck.color" placeholder="Color">
+    </div>
+</div>
+{{ duck.color }}
diff --git a/app/app.component.ts b/app/app.component.ts
index c530bc2..367d117 100644
--- a/app/app.component.ts
+++ b/app/app.component.ts
@@ -1,7 +1,14 @@
 import { Component } from "@angular/core";
 
+import { Duck } from "./models";
+
 @Component({
     selector: "duckbook-front",
     templateUrl: "/app/app.component.html"
 })
-export class AppComponent {}
+export class AppComponent {
+    duck: Duck = {
+        id: 1,
+        color: 'yellow'
+    };
+}
diff --git a/app/app.module.ts b/app/app.module.ts
index e9e04cc..be11127 100644
--- a/app/app.module.ts
+++ b/app/app.module.ts
@@ -1,10 +1,14 @@
 import { NgModule } from "@angular/core";
 import { BrowserModule } from "@angular/platform-browser";
+import { FormsModule } from "@angular/forms";
 
 import { AppComponent } from "./app.component";
 
 @NgModule({
-    imports: [ BrowserModule ],
+    imports: [
+        BrowserModule,
+        FormsModule
+    ],
     declarations: [ AppComponent ],
     bootstrap: [ AppComponent ]
 })
diff --git a/app/models.ts b/app/models.ts
new file mode 100644
index 0000000..269807c
--- /dev/null
+++ b/app/models.ts
@@ -0,0 +1,4 @@
+export class Duck {
+    id: number;
+    color: string;
+}