diff --git a/Front/skydivelogs-app/src/app/app.component.html b/Front/skydivelogs-app/src/app/app.component.html
index bd02e3a..abe0d39 100644
--- a/Front/skydivelogs-app/src/app/app.component.html
+++ b/Front/skydivelogs-app/src/app/app.component.html
@@ -27,6 +27,7 @@
             gears</a></li>
         <li><a routerLink="/newjump" routerLinkActive="active" (click)="toggleMenu()" skipLocationChange>Add a new
             jump</a></li>
+        <li *ngIf="currentUser"><a class="nav-item nav-link" (click)="logout()">Logout</a></li>
       </ul>
     </nav>
   </header>
diff --git a/Front/skydivelogs-app/src/app/app.component.ts b/Front/skydivelogs-app/src/app/app.component.ts
index 5cd9283..194e3fa 100644
--- a/Front/skydivelogs-app/src/app/app.component.ts
+++ b/Front/skydivelogs-app/src/app/app.component.ts
@@ -1,5 +1,8 @@
 import { Component, OnInit } from '@angular/core';
 import { ServiceComm } from '../services/service-comm.service';
+import { Router } from '@angular/router';
+import { AuthenticationService } from '../services/authentication.service';
+import { User } from '../models/user';
 
 @Component({
   selector: 'app-root',
@@ -9,8 +12,15 @@ import { ServiceComm } from '../services/service-comm.service';
 export class AppComponent implements OnInit {
   title = 'app';
   showMenu = false;
+  currentUser: User;
 
-  constructor(private serviceComm: ServiceComm) { }
+  constructor(
+    private router: Router,
+    private authenticationService: AuthenticationService,
+    private serviceComm: ServiceComm
+  ) {
+    this.authenticationService.currentUser.subscribe(x => this.currentUser = x);
+  }
 
   ngOnInit() {
     this.serviceComm.componentTitle.subscribe(title => (this.title = title));
@@ -19,4 +29,10 @@ export class AppComponent implements OnInit {
   toggleMenu() {
     this.showMenu = !this.showMenu;
   }
+
+  logout() {
+    this.authenticationService.logout();
+    this.showMenu = !this.showMenu;
+    this.router.navigate(['/login']);
+  }
 }