diff --git a/src/app/components/logout/logout.component.ts b/src/app/components/logout/logout.component.ts
new file mode 100644
index 0000000..199cc10
--- /dev/null
+++ b/src/app/components/logout/logout.component.ts
@@ -0,0 +1,33 @@
+/// <reference path="../../../../typings/index.d.ts"/>
+import {Component, OnInit} from '@angular/core';
+import {Router} from '@angular/router';
+import {AuthService} from '../../services/rest/auth.service';
+
+@Component({
+  selector: 'xos-logout',
+  template: `
+    <button *ngIf="show" (click)="logout()">Logout</button>
+    `,
+  providers: [AuthService],
+})
+export class LogoutComponent implements OnInit {
+  public show: boolean = false;
+  constructor(private AuthService: AuthService, private router: Router) {
+  }
+
+  ngOnInit() {
+    if (this.AuthService.isAuthenticated()) {
+      this.show = true;
+    }
+  }
+
+  logout() {
+    this.AuthService.logout()
+      .subscribe(
+        () => {
+          this.router.navigate(['/login']);
+        }
+      );
+  }
+}
+
diff --git a/src/app/hello.html b/src/app/hello.html
index 089199c..44631ae 100644
--- a/src/app/hello.html
+++ b/src/app/hello.html
@@ -2,4 +2,6 @@
 
 <h1>{{ hello }}</h1>
 
+<xos-logout></xos-logout>
+
 <pre>{{ endpoints | json }}</pre>
diff --git a/src/app/hello.spec.ts b/src/app/hello.spec.ts
index 91b3f1a..30e8e79 100644
--- a/src/app/hello.spec.ts
+++ b/src/app/hello.spec.ts
@@ -1,16 +1,20 @@
 /// <reference path="../../typings/index.d.ts"/>
 
 import {HelloComponent} from './hello';
+import {LogoutComponent} from './components/logout/logout.component';
 import {TestBed, async} from '@angular/core/testing';
 import {StyleConfig} from './config/style.config';
 import { Http, BaseRequestOptions } from '@angular/http';
 import { MockBackend } from '@angular/http/testing';
+import {CookieService} from 'angular2-cookie/services/cookies.service';
+import {Router} from '@angular/router';
 
 describe('hello component', () => {
   beforeEach(async(() => {
     TestBed.configureTestingModule({
       declarations: [
-        HelloComponent
+        HelloComponent,
+        LogoutComponent
       ],
       providers: [
         {
@@ -21,7 +25,12 @@
           deps: [MockBackend, BaseRequestOptions]
         },
         MockBackend,
-        BaseRequestOptions
+        BaseRequestOptions,
+        CookieService,
+        {
+          provide: Router,
+          useClass: class { navigate = jasmine.createSpy('navigate'); }
+        }
       ]
     });
     TestBed.compileComponents();
diff --git a/src/app/index.ts b/src/app/index.ts
index 4e93275..af804d3 100644
--- a/src/app/index.ts
+++ b/src/app/index.ts
@@ -9,6 +9,7 @@
 import {HelloComponent} from './hello';
 import {LoginComponent} from './components/login/login.component';
 import {ProtectedDirective} from './directives/protected.directive';
+import {LogoutComponent} from './components/logout/logout.component.ts';
 
 @NgModule({
   imports: [
@@ -21,6 +22,7 @@
     RootComponent,
     HelloComponent,
     LoginComponent,
+    LogoutComponent,
     ProtectedDirective
   ],
   providers: [CookieService],
diff --git a/src/app/services/rest/auth.service.ts b/src/app/services/rest/auth.service.ts
index 7c73c28..c53e3f4 100644
--- a/src/app/services/rest/auth.service.ts
+++ b/src/app/services/rest/auth.service.ts
@@ -14,35 +14,51 @@
 
 @Injectable()
 export class AuthService {
-  private xosToken:string;
-  private xosSessionId:string;
-  // Resolve HTTP using the constructor
-  constructor (private http: Http, private cookieService:CookieService) {
+  private xosToken: string;
+  private xosSessionId: string;
+  // resolve HTTP using the constructor
+  constructor (private http: Http, private cookieService: CookieService) {
   }
 
   // check if the user is authenticated
-  isAuthenticated(){
+  isAuthenticated(): string {
     this.xosToken = this.cookieService.get('xoscsrftoken');
     this.xosSessionId = this.cookieService.get('xossessionid');
     return this.xosToken;
   }
 
   // save cookies
-  storeAuth(auth:IAuthResponse){
+  storeAuth(auth: IAuthResponse): void {
     this.cookieService.put('xoscsrftoken', auth.xoscsrftoken);
     this.cookieService.put('xossessionid', auth.xossessionid);
   }
 
-  // Log the user in
-  login(auth: IAuthRequest) : Observable<IAuthResponse> {
+  // remove cookies
+  removeAuth(): void {
+    this.cookieService.remove('xoscsrftoken');
+    this.cookieService.remove('xossessionid');
+  }
+
+  // log the user in
+  login(auth: IAuthRequest): Observable<IAuthResponse> {
     return this.http.post(`${AppConfig.apiEndpoint}/utility/login/`, auth)
-      .map((res:Response) => res.json())
-      .map((auth:IAuthResponse) => {
+      .map((res: Response) => res.json())
+      .map((auth: IAuthResponse) => {
         this.storeAuth(auth);
         auth.user = JSON.parse(auth.user);
         return auth;
       })
       .catch((error:any) => Observable.throw(error.json().error || 'Server error'));
   }
+
+  // logout the user
+  logout(): Observable<any> {
+    return this.http.post(`${AppConfig.apiEndpoint}/utility/logout/`, {xossessionid: this.xosSessionId})
+      .map((res: Response) => {
+        this.removeAuth();
+        return res.text();
+      })
+      .catch((error: any) => Observable.throw(error.json().error || 'Server error'));
+  }
 }
 
diff --git a/src/index.ts b/src/index.ts
index 4cf1437..baed6f9 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -13,7 +13,7 @@
 import {AppModule} from './app';
 
 declare var process: any;
-console.log(process.env.NODE_ENV);
+
 if (process.env.NODE_ENV === 'production') {
   enableProdMode();
 } else {