diff --git a/Frontend Angular 4/src/app/layout/layout.component.ts b/Frontend Angular 4/src/app/layout/layout.component.ts
index b81e4b8d12417f6fd627094fc7105f75cf784224..d2220813e06643d2f57b1ed042ffe59b25475de2 100755
--- a/Frontend Angular 4/src/app/layout/layout.component.ts	
+++ b/Frontend Angular 4/src/app/layout/layout.component.ts	
@@ -2,6 +2,8 @@ import { Component, OnInit } from '@angular/core';
 import { Router } from '@angular/router';
 import { GHCIService } from '../shared/services/ghci.service';
 import { NotificacionService } from '../shared/services/notificacion.service';
+import { TranslateService } from '@ngx-translate/core';
+
 @Component({
     selector: 'app-layout',
     templateUrl: './layout.component.html',
@@ -9,7 +11,7 @@ import { NotificacionService } from '../shared/services/notificacion.service';
     providers: [GHCIService]
 })
 export class LayoutComponent implements OnInit {
-    constructor(public router: Router) { }
+    constructor(public router: Router, public translate: TranslateService) { }
     ngOnInit() {
         if (this.router.url === '/') {
             this.router.navigate(['/login']);
diff --git a/Frontend Angular 4/src/app/layout/layout.module.ts b/Frontend Angular 4/src/app/layout/layout.module.ts
index ab31a0b0ed8846dc4d4c027eafd5e409384201e8..e3c702bac67b0a8e94ff043842f73b5ba0e8147b 100755
--- a/Frontend Angular 4/src/app/layout/layout.module.ts	
+++ b/Frontend Angular 4/src/app/layout/layout.module.ts	
@@ -9,7 +9,9 @@ import { HeaderComponent, SidebarComponent } from '../shared';
 import { AuthenticationService } from '../shared/services/authentication.service';
 import { HaskellService } from '../shared/services/haskell.service';
 import { CodemirrorModule } from 'ng2-codemirror';
-import { NotificacionModule } from '../notificacion/notificacion.module'; 
+import { NotificacionModule } from '../notificacion/notificacion.module';
+import { I18nModule } from '../shared/modules/translate/i18n.module';
+import { TitleCaseModule } from '../shared/modules/titlecase.module';
 
 @NgModule({
     imports: [
@@ -18,12 +20,14 @@ import { NotificacionModule } from '../notificacion/notificacion.module';
         NgbModule.forRoot(),
         LayoutRoutingModule,
         CodemirrorModule,
-        NotificacionModule
+        NotificacionModule,
+        I18nModule,
+        TitleCaseModule
     ],
     declarations: [
         LayoutComponent,
         HeaderComponent,
-        SidebarComponent        
+        SidebarComponent
     ],
     providers: [AuthenticationService, HaskellService]
 })
diff --git a/Frontend Angular 4/src/app/shared/components/header/header.component.html b/Frontend Angular 4/src/app/shared/components/header/header.component.html
index 7b31ad18af849aed73310ab4aeb0a518445af2dd..3a577396be6bb8591c8df859227f2680da07c6b8 100755
--- a/Frontend Angular 4/src/app/shared/components/header/header.component.html	
+++ b/Frontend Angular 4/src/app/shared/components/header/header.component.html	
@@ -11,7 +11,9 @@
                         <i class="fa fa-user"></i> {{usuario.nombre+' '+usuario.apellido}}<b class="caret"></b>
                     </a>
                     <div class="dropdown-menu dropdown-menu-right">
-                        <a class="dropdown-item" style="cursor: pointer;" (click)=logout() ><i class="fa fa-fw fa-power-off"></i> Salir</a>
+                        <a class="dropdown-item" style="cursor: pointer;" (click)=logout() ><i class="fa fa-fw fa-power-off"></i>
+                            {{ "i18n.action.exit" | translate | titleCase }}
+                        </a>
                     </div>
                 </div>
             </ul>
diff --git a/Frontend Angular 4/src/app/shared/components/sidebar/sidebar.component.html b/Frontend Angular 4/src/app/shared/components/sidebar/sidebar.component.html
index 15938e99fab4aeef75a15cc4fb010439a41b3594..8b7f5eac89481b5f9cafb9c453f0378631df6796 100755
--- a/Frontend Angular 4/src/app/shared/components/sidebar/sidebar.component.html	
+++ b/Frontend Angular 4/src/app/shared/components/sidebar/sidebar.component.html	
@@ -1,13 +1,13 @@
  <nav class="sidebar" #sidebarNav [ngClass]="{sidebarPushRight: isActive}" style="background: #036b9a !important;">
     <ul class="list-group">
         <a [routerLink]="['/matefun']" (click)=toggleSidebar() [routerLinkActive]="['router-link-active']" class="list-group-item" style="color: white;">
-            <i class="fa fa-fw fa-desktop"></i>&nbsp;Programa
+            <i class="fa fa-fw fa-desktop"></i>&nbsp;{{ "i18n.object.program" | translate | titleCase }}
         </a>
         <a [routerLink]="['/archivos']" (click)=toggleSidebar() [routerLinkActive]="['router-link-active']" class="list-group-item" style="color: white;">
-            <i class="fa fa-fw fa-file-o"></i>&nbsp;Archivos
+            <i class="fa fa-fw fa-file-o"></i>&nbsp;{{ "i18n.object.files" | translate | titleCase }}
         </a>
         <a *ngIf="esDocente()" [routerLink]="['/grupos']" (click)=toggleSidebar() [routerLinkActive]="['router-link-active']" class="list-group-item" style="color: white;">
-            <i class="fa fa-fw fa-users"></i>&nbsp;Grupos
+            <i class="fa fa-fw fa-users"></i>&nbsp;{{ "i18n.object.groups" | translate | titleCase }}
         </a>
         
     </ul>