diff --git a/project-manager-reactive/src/app/app.component.html b/project-manager-reactive/src/app/app.component.html
index 4d68587..10b7a87 100644
--- a/project-manager-reactive/src/app/app.component.html
+++ b/project-manager-reactive/src/app/app.component.html
@@ -28,6 +28,9 @@
           <li routerLinkActive="active">
             <a routerLink='/rxdemo' class="link">RxJS Demo</a>
           </li>
+          <li routerLinkActive="active">
+            <a routerLink='/blog' class="link">Blog</a>
+          </li>
           <!--
           <li routerLinkActive="active">
             <a routerLink='/tasks/new' class="link">Neue Aufgabe anlegen</a>
@@ -81,4 +84,4 @@
     <div id="right">
       <router-outlet name="right"></router-outlet>
     </div>
-</div>
\ No newline at end of file
+</div>
diff --git a/project-manager-reactive/src/app/app.routing.ts b/project-manager-reactive/src/app/app.routing.ts
index d50db44..29e5481 100644
--- a/project-manager-reactive/src/app/app.routing.ts
+++ b/project-manager-reactive/src/app/app.routing.ts
@@ -4,8 +4,9 @@ import {DashboardComponent} from './dashboard/dashboard.component';
 import {SettingsComponent} from './settings/settings.component';
 import {AboutComponent} from './about/about.component';
 import {LoginComponent} from './login/index';
+import {BlogComponent} from  './blog/blog.component';
 import {NotFoundComponent} from './not-found/not-found.component';
-import {tasksRoutes, tasksRoutingComponents, tasksRoutingProviders} from './tasks/tasks.routing';
+import {tasksRoutes, tasksRoutingComponents, tasksRoutingProviders, blogComponents} from './tasks/tasks.routing';
 import {RxDemoComponent} from './rxdemo/rxdemo.component';
 import {LoginGuard} from './login/login.guard';
 
@@ -16,6 +17,8 @@ export const appRoutes: Routes = [
   },
   {path: 'about', component: AboutComponent, data: {title: 'Über uns'}},
   {path: 'rxdemo', component: RxDemoComponent, data: {title: 'RxJS Demo'}},
+  {path: 'blog', component: BlogComponent, data: {title: 'Blog'}},
+
   {path: 'login', component: LoginComponent},
 
   {path: 'tasks', canActivate: [LoginGuard], children: tasksRoutes},
@@ -30,7 +33,7 @@ export const appRoutes: Routes = [
 export const appRouting = RouterModule.forRoot(appRoutes);
 
 export const routingComponents = [DashboardComponent, SettingsComponent, AboutComponent, LoginComponent, NotFoundComponent,
-  RxDemoComponent,  ...tasksRoutingComponents];
+  RxDemoComponent, ...blogComponents,  ...tasksRoutingComponents];
 
 export const routingProviders = [LoginGuard,
-  ...tasksRoutingProviders];
\ No newline at end of file
+  ...tasksRoutingProviders];
diff --git a/project-manager-reactive/src/app/blog/blog-entry.component.html b/project-manager-reactive/src/app/blog/blog-entry.component.html
new file mode 100644
index 0000000..7e03b48
--- /dev/null
+++ b/project-manager-reactive/src/app/blog/blog-entry.component.html
@@ -0,0 +1,12 @@
+<div class="blog-entry">
+    <div class="blog-image">
+        <img [src]="entry.image" [alt]="entry.title"/>
+    </div>
+    <div class="blog-summary">
+        <span class="title">{{entry.title}}</span>
+        <p> {{entry.text}}</p>
+    </div>
+    <div class="blog-delete">
+        <button (click)="deleteBlogEntry(entry.id)">delete</button>
+    </div>
+</div>
\ No newline at end of file
diff --git a/project-manager-reactive/src/app/blog/blog-entry.component.ts b/project-manager-reactive/src/app/blog/blog-entry.component.ts
new file mode 100644
index 0000000..5bd3ee6
--- /dev/null
+++ b/project-manager-reactive/src/app/blog/blog-entry.component.ts
@@ -0,0 +1,17 @@
+import {Component, Input } from '@angular/core';
+import {BlogEntry} from './blog-entry';
+import {BlogComponent} from "./blog.component";
+
+@Component({
+  selector: 'blog-entry',
+  templateUrl: 'blog-entry.component.html'
+})
+export class BlogEntryComponent {
+  @Input() blogComponent: BlogComponent;
+  @Input() entry: BlogEntry;
+
+  deleteBlogEntry(id:number) {
+    this.blogComponent.deleteBlogEntry(id);
+  }
+
+}
diff --git a/project-manager-reactive/src/app/blog/blog-entry.ts b/project-manager-reactive/src/app/blog/blog-entry.ts
new file mode 100644
index 0000000..087336f
--- /dev/null
+++ b/project-manager-reactive/src/app/blog/blog-entry.ts
@@ -0,0 +1,6 @@
+export class BlogEntry {
+  id :number;
+  title: string;
+  text: string;
+  image: string;
+}
diff --git a/project-manager-reactive/src/app/blog/blog.component.css b/project-manager-reactive/src/app/blog/blog.component.css
new file mode 100644
index 0000000..0aa72d4
--- /dev/null
+++ b/project-manager-reactive/src/app/blog/blog.component.css
@@ -0,0 +1,65 @@
+body {
+  font-family: Helvetica;
+  padding-left: 15px;
+}
+
+.form {
+  background-color: #eee;
+  width: 580px; /* Breite des Formulars */
+  padding: 20px;
+  border: 1px solid #8c8c8c;
+  position: absolute;
+  margin-bottom: 25px;
+}
+
+.control {
+  display: flex;
+}
+
+label {
+  width: 100px;
+  cursor: pointer;
+}
+
+input,
+textarea {
+  width: 550px;
+  border: 1px solid #8c8c8c;
+  margin-bottom: 1em;
+}
+
+span.title {
+  font-size: x-large;
+}
+
+.clear-fix {
+  clear: both;
+}
+
+.blog-entry {
+  width: 600px;
+  display: flex;
+  padding-bottom: 30px;
+}
+
+button {
+  float: right;
+  padding-right: 20px;
+}
+
+.blog-image {
+  width: 30%;
+}
+
+img {
+  max-width: 90%;
+  max-height: 100px;
+}
+
+.blog-summary {
+  width: 70%;
+}
+
+textarea {
+  height: 7em;
+}
\ No newline at end of file
diff --git a/project-manager-reactive/src/app/blog/blog.component.html b/project-manager-reactive/src/app/blog/blog.component.html
new file mode 100644
index 0000000..622fd07
--- /dev/null
+++ b/project-manager-reactive/src/app/blog/blog.component.html
@@ -0,0 +1,25 @@
+<h1>Mein Angular-Blog</h1>
+<blog-entry *ngFor="let entry of entries" [entry]="entry" [blogComponent]="this"></blog-entry>
+<h2>Neuen Blog-Eintrag erstellen</h2>
+
+<div class="form">
+
+  <div class="control">
+    <label for="title">Titel:</label>
+    <input type="text" id="title" #title />
+  </div>
+  <div class="control">
+    <label for="title">Bild-URL:</label>
+    <input type="text" id="image" #image />
+  </div>
+  <div class="control">
+    <label for="text">Text:</label>
+    <textarea id="text" cols="20" rows="3" #text>
+    </textarea>
+  </div>
+  <div>
+    <button (click)="createBlogEntry(title.value, image.value, text.value)">
+      Blog-Eintrag anlegen
+    </button>
+  </div>
+</div>
diff --git a/project-manager-reactive/src/app/blog/blog.component.ts b/project-manager-reactive/src/app/blog/blog.component.ts
new file mode 100644
index 0000000..1433195
--- /dev/null
+++ b/project-manager-reactive/src/app/blog/blog.component.ts
@@ -0,0 +1,44 @@
+import {Component} from '@angular/core';
+import {ActivatedRoute, ActivatedRouteSnapshot, Router, RouterStateSnapshot} from '@angular/router';
+import {Title} from '@angular/platform-browser';
+import {initialEntries} from './initialEntries';
+import {BlogEntry} from './blog-entry';
+
+@Component({
+  selector: 'blog',
+  templateUrl: 'blog.component.html',
+  styleUrls: ['blog.component.css']
+})
+
+export class BlogComponent {
+
+  entries: BlogEntry[] = [];
+  id = 0;
+
+  constructor(r: ActivatedRoute, private router: Router, private titleService: Title) {
+    this.entries = [];
+    this.entries = initialEntries;
+    this.id = this.entries[this.entries.length-1].id;
+  }
+
+  createBlogEntry(title:string, image:string, text:string) {
+    this.id++;
+    console.log(this.id, title, image, text);
+    let entry = new BlogEntry();
+    entry.id = this.id;
+    entry.title = title;
+    entry.image = image;
+    entry.text = text;
+
+    this.entries.push(entry);
+  }
+
+  deleteBlogEntry(id:number) {
+    let entryIndex = this.entries.findIndex(entry => entry.id === id);
+    if (entryIndex > -1) {
+      this.entries.splice(entryIndex, 1);
+    }
+  }
+
+}
+
diff --git a/project-manager-reactive/src/app/blog/index.ts b/project-manager-reactive/src/app/blog/index.ts
new file mode 100644
index 0000000..8e13f14
--- /dev/null
+++ b/project-manager-reactive/src/app/blog/index.ts
@@ -0,0 +1 @@
+export * from './blog.component';
diff --git a/project-manager-reactive/src/app/blog/initialEntries.ts b/project-manager-reactive/src/app/blog/initialEntries.ts
new file mode 100644
index 0000000..07dcb67
--- /dev/null
+++ b/project-manager-reactive/src/app/blog/initialEntries.ts
@@ -0,0 +1,14 @@
+export var initialEntries = [
+  {
+    id: 1,
+    title: "Angular 2 erschienen",
+    image: "data:image/png;base64,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",
+    text: "Endlich ist die finale Version von Angular 2 erschienen. Nach langer Beta-Phase ..."
+  },
+  {
+    id: 2,
+    title: "Neue Vorschläge für die kommende Module-Loader-Syntax",
+    image: "https://cdn-images-1.medium.com/max/1000/1*RQFLsbQumE-iNrXzs_Oz8g.jpeg",
+    text: "Nachdem im ES2015-Standard bereits die Module-API verabschiedet wurde, hat das zuständige Konsortium nun neue Vorschläge für die Module-Loader-Syntax bekannt gegeben..."
+  }
+]
\ No newline at end of file
diff --git a/project-manager-reactive/src/app/tasks/tasks.routing.ts b/project-manager-reactive/src/app/tasks/tasks.routing.ts
index 8dbfe87..bb94aba 100644
--- a/project-manager-reactive/src/app/tasks/tasks.routing.ts
+++ b/project-manager-reactive/src/app/tasks/tasks.routing.ts
@@ -5,6 +5,8 @@ import {EditTaskGuard} from './edit-task/edit-task.guard';
 import {TaskOverviewComponent} from './task-overview/task-overview.component';
 import {TasksComponent} from './tasks.component';
 import {LoginGuard} from '../login/login.guard';
+import {BlogComponent} from "../blog/blog.component";
+import {BlogEntryComponent} from "../blog/blog-entry.component";
 
 export const tasksRoutes: Routes = [{
   path: '', component: TasksComponent,
@@ -32,4 +34,5 @@ export const tasksRoutes: Routes = [{
   }];
 
 export const tasksRoutingComponents = [TasksComponent, TaskListComponent, EditTaskComponent, TaskOverviewComponent];
-export const tasksRoutingProviders = [EditTaskGuard];
\ No newline at end of file
+export const tasksRoutingProviders = [EditTaskGuard];
+export const blogComponents = [BlogComponent, BlogEntryComponent];