diff --git a/src/app/components/businessunit/businessunit-edit/businessunit-edit.component.html b/src/app/components/businessunit/businessunit-edit/businessunit-edit.component.html
new file mode 100644
index 0000000..ea9e272
--- /dev/null
+++ b/src/app/components/businessunit/businessunit-edit/businessunit-edit.component.html
@@ -0,0 +1 @@
+<p>businessunit-edit works!</p>
diff --git a/src/app/components/businessunit/businessunit-edit/businessunit-edit.component.scss b/src/app/components/businessunit/businessunit-edit/businessunit-edit.component.scss
new file mode 100644
index 0000000..e69de29
diff --git a/src/app/components/businessunit/businessunit-edit/businessunit-edit.component.ts b/src/app/components/businessunit/businessunit-edit/businessunit-edit.component.ts
new file mode 100644
index 0000000..9665c1a
--- /dev/null
+++ b/src/app/components/businessunit/businessunit-edit/businessunit-edit.component.ts
@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-businessunit-edit',
+  templateUrl: './businessunit-edit.component.html',
+  styleUrls: ['./businessunit-edit.component.scss']
+})
+export class BusinessunitEditComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit(): void {
+  }
+
+}
diff --git a/src/app/components/businessunit/businessunit.component.html b/src/app/components/businessunit/businessunit.component.html
new file mode 100644
index 0000000..99075c3
--- /dev/null
+++ b/src/app/components/businessunit/businessunit.component.html
@@ -0,0 +1,32 @@
+<div xmlns="">
+  <h2 class = mb-4>Business Unit</h2>
+
+  <table class = mb-5>
+    <tr>
+      <th class="spaced">Name</th>
+    </tr>
+    <tr *ngFor="let businessunit of businessunits">
+      <td class="spaced"> {{businessunit.name}} </td>
+      <td class="spaced"> <a routerLink="{{businessunit.id}}"> Modifier </a></td>
+    </tr>
+  </table>
+
+  <h3>Ajouter une businessunit : </h3>
+
+  <div class = mb-3>
+    <table>
+      <tr>
+        <th>Name</th>
+      </tr>
+      <tr>
+        <td>
+          <input id="businessunit-name" [(ngModel)]="businessunit.name" placeholder="name">
+        </td>
+      </tr>
+    </table>
+  </div>
+
+  <button class="add-button" (click)="add(businessunit)">
+    Ajouter une businessunit
+  </button>
+</div>
diff --git a/src/app/components/businessunit/businessunit.component.scss b/src/app/components/businessunit/businessunit.component.scss
new file mode 100644
index 0000000..e69de29
diff --git a/src/app/components/businessunit/businessunit.component.ts b/src/app/components/businessunit/businessunit.component.ts
new file mode 100644
index 0000000..5f4816c
--- /dev/null
+++ b/src/app/components/businessunit/businessunit.component.ts
@@ -0,0 +1,37 @@
+import { Component, OnInit } from '@angular/core';
+import {Businessunit} from "../../interfaces/businessunit";
+import {HttpClient} from "@angular/common/http";
+import {BusinessunitService} from "../../services/businessunit.service";
+
+@Component({
+  selector: 'app-businessunit',
+  templateUrl: './businessunit.component.html',
+  styleUrls: ['./businessunit.component.scss']
+})
+export class BusinessunitComponent implements OnInit {
+
+  businessunits : Businessunit[] = [];
+  businessunit = {} as Businessunit ;
+
+  constructor(
+    private http : HttpClient,
+    private businessunitService: BusinessunitService,
+  ) { }
+
+  ngOnInit(): void {
+    this.getBusinessunits();
+  }
+
+  getBusinessunits():void {
+    this.businessunitService.getBusinessunits()
+      .subscribe(businessunits => this.businessunits = businessunits);
+  }
+
+  add(businessunit: Businessunit): void {
+    this.businessunitService.addBusinessunit(businessunit)
+      .subscribe(businessunit => {
+        this.businessunits.push(businessunit);
+      });
+  }
+
+}