diff --git a/src/app/components/poi-list/poi-list.component.ts b/src/app/components/poi-list/poi-list.component.ts
new file mode 100644
index 0000000..07c6548
--- /dev/null
+++ b/src/app/components/poi-list/poi-list.component.ts
@@ -0,0 +1,101 @@
+import { Component, OnInit } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+import { POIService } from '../../services/poi.service';
+import { POI } from '../../model/POI';
+
+@Component({
+  selector: 'app-poi-list',
+  standalone: true,
+  imports: [CommonModule, FormsModule],
+  templateUrl: './poi-list.component.html',
+  styleUrl: './poi-list.component.css'
+})
+export class PoiListComponent implements OnInit {
+  pois: POI[] = [];
+  selectedPoi: POI | null = null;
+  isEditing = false;
+  isAdding = false;
+
+  constructor(private poiService: POIService) {}
+
+  ngOnInit(): void {
+    this.loadPOIs();
+  }
+
+  loadPOIs(): void {
+    this.poiService.getPOIs().subscribe({
+      next: (response: POI[]) => {
+        this.pois = response;
+      },
+      error: (error: any) => {
+        console.error('Erreur lors du chargement des POIs:', error);
+      }
+    });
+  }
+
+  addPoi(): void {
+    this.selectedPoi = {
+      id: '',
+      title: '',
+      description: '',
+      complete_address: '',
+      location: [0, 0],
+      files: [],
+      user_id: null,
+      is_poi: true
+    };
+    this.isAdding = true;
+  }
+
+  editPoi(poi: POI): void {
+    console.log('Édition du POI:', poi); // Pour le débogage
+    this.selectedPoi = { ...poi };
+    this.isEditing = true;
+  }
+
+  savePoi(): void {
+    if (this.selectedPoi) {
+      if (this.isAdding) {
+        this.poiService.addPOI(this.selectedPoi).subscribe({
+          next: () => {
+            this.loadPOIs();
+            this.cancelEdit();
+          },
+          error: (error: any) => {
+            console.error('Erreur lors de l\'ajout du POI:', error);
+          }
+        });
+      } else if (this.selectedPoi.id) {
+        this.poiService.updatePOI(this.selectedPoi.id, this.selectedPoi).subscribe({
+          next: () => {
+            this.loadPOIs();
+            this.cancelEdit();
+          },
+          error: (error: any) => {
+            console.error('Erreur lors de la mise à jour du POI:', error);
+          }
+        });
+      }
+    }
+  }
+
+  deletePoi(id: string): void {
+    if (confirm('Êtes-vous sûr de vouloir supprimer ce POI ?')) {
+      this.poiService.deletePOI(id).subscribe({
+        next: () => {
+          this.loadPOIs();
+        },
+        error: (error: any) => {
+          console.error('Erreur lors de la suppression du POI:', error);
+        }
+      });
+    }
+  }
+
+  cancelEdit(): void {
+    this.selectedPoi = null;
+    this.isEditing = false;
+    this.isAdding = false;
+  }
+}