diff --git a/client/package.json b/client/package.json
index edf6b91..5ec072a 100644
--- a/client/package.json
+++ b/client/package.json
@@ -4,6 +4,7 @@
   "scripts": {
     "ng": "ng",
     "start": "ng serve",
+    "serve": "ng serve --host 0.0.0.0",
     "build": "ng build",
     "watch": "ng build --watch --configuration development",
     "test": "ng test"
diff --git a/client/src/app/app.html b/client/src/app/app.html
index aebbeaa..bd8c277 100644
--- a/client/src/app/app.html
+++ b/client/src/app/app.html
@@ -3,13 +3,13 @@
 </main>
 <nav>
   <ul ngbNav [(activeId)]="active" class="nav-tabs custom-navbar bg-body-secondary">
-    <li [ngbNavItem]="1" class="custom-navitem"><a ngbNavLink routerLink="/send">
+    <li ngbNavItem="/send" class="custom-navitem"><a ngbNavLink routerLink="/send">
         <i class="bi bi-cash"></i>
     </a></li>
-    <li [ngbNavItem]="2" class="custom-navitem"><a ngbNavLink routerLink="/receive">
+    <li ngbNavItem="/receive" class="custom-navitem"><a ngbNavLink routerLink="/receive">
         <i class="bi bi-piggy-bank"></i>
     </a></li>
-    <li [ngbNavItem]="3" class="custom-navitem"><a ngbNavLink routerLink="/profile">
+    <li ngbNavItem="/profile" class="custom-navitem"><a ngbNavLink routerLink="/profile">
         <i class="bi bi-person"></i>
     </a></li>
   </ul>
diff --git a/client/src/app/app.ts b/client/src/app/app.ts
index 4cfb7c7..1291ef7 100644
--- a/client/src/app/app.ts
+++ b/client/src/app/app.ts
@@ -1,5 +1,5 @@
-import { Component, signal } from '@angular/core';
-import { RouterOutlet, RouterLinkWithHref } from '@angular/router';
+import { Component, OnInit, signal } from '@angular/core';
+import { RouterOutlet, RouterLinkWithHref, Router, NavigationEnd } from '@angular/router';
 import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
 import {
 	NgbNav,
@@ -7,6 +7,7 @@ import {
 	NgbNavItemRole,
 	NgbNavLinkBase,
 } from '@ng-bootstrap/ng-bootstrap/nav';
+import { filter } from 'rxjs';
 
 @Component({
   selector: 'app-root',
@@ -14,8 +15,21 @@ import {
   templateUrl: './app.html',
   styleUrl: './app.less'
 })
-export class App {
+export class App implements OnInit{
   protected readonly title = signal('client');
-  //FIXME nav jumping back to 1 after reload
-  active = 1;
+  active = '/';
+
+  constructor(
+    private router: Router
+  ){}
+
+  ngOnInit(): void {
+    this.router.events
+    .pipe(filter(event => event instanceof NavigationEnd))
+    .subscribe(() =>{
+      this.active = this.router.url;
+      console.log(this.active);
+    });
+  }
+
 }
diff --git a/client/src/app/services/api.ts b/client/src/app/services/api.ts
index aacff03..27ea0df 100644
--- a/client/src/app/services/api.ts
+++ b/client/src/app/services/api.ts
@@ -3,6 +3,7 @@ import { Injectable } from '@angular/core';
 import { BehaviorSubject, catchError, map, Observable, of, tap } from 'rxjs';
 import Transaction from '@model/transaction'
 import { SendRequest, SendResponse } from '@message/Send';
+import { TransactionsRequest } from '@message/Transactions';
 
 @Injectable({
   providedIn: 'root',