diff --git a/src/app/components/post-form/post-form.component.css b/src/app/components/post-form/post-form.component.css
index e69de29..5157b40 100644
--- a/src/app/components/post-form/post-form.component.css
+++ b/src/app/components/post-form/post-form.component.css
@@ -0,0 +1,18 @@
+div {
+  margin-top: 2em;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+form {
+  width: 100%;
+  max-width: 50em;
+  display: flex;
+  flex-direction: column;
+  gap:1em;
+}
+
+.send-button {
+  align-self: center;
+}
diff --git a/src/app/components/post-form/post-form.component.html b/src/app/components/post-form/post-form.component.html
index 397f182..b57e603 100644
--- a/src/app/components/post-form/post-form.component.html
+++ b/src/app/components/post-form/post-form.component.html
@@ -1 +1,27 @@
-<p>post-form works!</p>
+<div>
+  <form [formGroup]="form" (ngSubmit)="onSubmit()">
+    <label for="title">Titre du post</label>
+    <input [(ngModel)]="title" id="title" type="text" pInputText formControlName="title"/>
+    <label for="category">Catégorie du post</label>
+    <input [(ngModel)]="category" pInputText id="category" formControlName="category" type="text"/>
+    <label for="desc">Description du post</label>
+    <textarea [(ngModel)]="description" formControlName="description" id="desc" pInputTextarea></textarea>
+    <label>Image descriptive du post</label>
+    <p-fileUpload accept="image/*"
+                  maxFileSize="1000000"
+                  [showUploadButton]="false"
+                  [showCancelButton]="false"
+                  chooseLabel="Sélectionner une image"
+                  (onSelect)="onSelected($event)">
+      <ng-template pTemplate="content">
+      </ng-template>
+    </p-fileUpload>
+    <label>Contenu du post</label>
+    <p-editor [(ngModel)]="body" formControlName="body" [style]="{ height: '320px' }"/>
+    @if (isUpdateMode) {
+      <p-button class="send-button" type="submit" label="Mettre à jour"></p-button>
+    } @else {
+      <p-button class="send-button" type="submit" label="Ajouter"></p-button>
+    }
+  </form>
+</div>
diff --git a/src/app/components/post-form/post-form.component.ts b/src/app/components/post-form/post-form.component.ts
index d029999..1342102 100644
--- a/src/app/components/post-form/post-form.component.ts
+++ b/src/app/components/post-form/post-form.component.ts
@@ -1,13 +1,155 @@
-import { Component } from '@angular/core';
+import { Component, Input, OnDestroy } from '@angular/core';
+import { HeaderComponent } from '../../components/header/header.component';
+import { FormBuilder, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms';
+import { InputTextModule } from 'primeng/inputtext';
+import { InputTextareaModule } from 'primeng/inputtextarea';
+import { FileSelectEvent, FileUploadModule } from 'primeng/fileupload';
+import {mergeMap, Subscription} from 'rxjs';
+import { PostService } from '../../services/post.service';
+import { CookieService } from 'ngx-cookie-service';
+import { MessageService } from 'primeng/api';
+import { EditorModule } from 'primeng/editor';
+import { Router } from '@angular/router';
+import {Author} from '../../models/author';
+import {AuthorService} from '../../services/author.service';
 
 @Component({
   selector: 'app-post-form',
   standalone: true,
-  imports: [],
+  imports: [
+    ReactiveFormsModule,
+    InputTextModule,
+    InputTextareaModule,
+    FileUploadModule,
+    EditorModule,
+    HeaderComponent
+  ],
   templateUrl: './post-form.component.html',
-  styleUrl: './post-form.component.css'
+  styleUrls: ['./post-form.component.css']
 })
-export class PostFormComponent {
+export class PostFormComponent implements OnDestroy {
+  @Input() postId: bigint | undefined;
+  @Input() isUpdateMode: boolean = false;
+  @Input() actualAuthor: Author | undefined;
+  @Input() title: string = '';
+  @Input() category: string = '';
+  @Input() description: string = '';
+  @Input() body: string = '';
+  subs: Subscription[] = [];
+  form: FormGroup;
+  uploadedFile: File | undefined;
 
+  constructor(
+    private formBuilder: FormBuilder,
+    private postService: PostService,
+    private authorService: AuthorService,
+    private cookieService: CookieService,
+    private messageService: MessageService,
+    private router: Router
+  ) {
+    this.form = this.formBuilder.group({
+      description: ['', [Validators.required, Validators.maxLength(512)]],
+      title: ['', [Validators.required, Validators.maxLength(50)]],
+      body: ['', [Validators.required]],
+      category: ['', [Validators.required, Validators.maxLength(50)]],
+    });
 
+    if (this.isUpdateMode && this.postId) {
+      this.loadPostData();
+    }
+  }
+
+  loadPostData(): void {
+    if (this.postId) {
+      this.subs.push(
+        this.postService.getPost(this.postId).subscribe({
+          next: (post) => {
+            this.form.patchValue({
+              title: post.title,
+              description: post.description,
+              body: post.body,
+              category: post.category
+            });
+          },
+          error: (err) => {
+            this.failureMessage('Erreur', `Impossible de charger le post : ${err.message}`);
+          }
+        })
+      );
+    }
+  }
+
+  onSelected(event: FileSelectEvent): void {
+    if (event.currentFiles && event.currentFiles.length > 0) {
+      this.uploadedFile = event.currentFiles[0];
+    }
+  }
+
+  onSubmit(): void {
+    if (this.form.valid && this.uploadedFile) {
+      const formData = this.form.value;
+      const postData: any = {
+        title: formData.title,
+        description: formData.description,
+        body: formData.body,
+        category: formData.category
+      };
+
+      if (this.isUpdateMode && this.postId) {
+        this.subs.push(
+          this.postService.updatePost(this.postId, postData, this.cookieService.get('token')).pipe(
+            mergeMap((_) => {
+              return this.postService.changeIllustration(this.postId, this.uploadedFile, this.cookieService.get('token'));
+            })
+          ).subscribe({
+            next: (_) => this.successMessage('Succès', 'Post créé avec succès'),
+            error: (err) => this.failureMessage('Erreur', err.message)
+          })
+        );
+      } else {
+        this.subs.push(
+          this.postService.createPost(postData, this.cookieService.get("token")).pipe(
+            mergeMap(post =>
+              this.authorService.attributePost(this.actualAuthor?.id, post.id, this.cookieService.get("token")).pipe(
+                mergeMap((_) =>
+                  this.postService.changeIllustration(post.id, this.uploadedFile, this.cookieService.get("token"))
+                )
+              )
+            )
+          ).subscribe({
+            next: () => {
+              this.router.navigate(['/']).then(() => {
+                this.successMessage('Succès', 'Post créé avec succès')
+              });
+            },
+            error: (err) => this.failureMessage('Erreur', err.message)
+          })
+        );
+      }
+    }
+  }
+
+  successMessage(summary: string, detail: string): void {
+    this.messageService.add({
+      severity: 'success',
+      summary,
+      detail,
+      life: 3000,
+      closable: false
+    });
+  }
+
+  failureMessage(summary: string, detail: string): void {
+    this.messageService.add({
+      severity: 'error',
+      summary,
+      detail,
+      life: 3000,
+      closable: false
+    });
+  }
+
+  ngOnDestroy(): void {
+    this.subs.forEach((sub) => sub.unsubscribe());
+  }
 }
diff --git a/src/app/pages/home/home.component.html b/src/app/pages/home/home.component.html
index a682e04..fcb7cfe 100644
--- a/src/app/pages/home/home.component.html
+++ b/src/app/pages/home/home.component.html
@@ -1,12 +1,16 @@
 <app-header></app-header>
 <div class="main-content">
-  @for (post of posts; track post.id) {
-  <app-post-home [illustration]="post.illustration"
-                 [date]="post.publicationDate"
-                 [postId]="post.id"
-                 [category]="post.category"
-                 [title]="post.title"
-                 [username]="'Guams'"
-                 [description]="post.description" />
+  @if (posts.length) {
+    @for (post of posts; track post.id) {
+      <app-post-home [illustration]="post.illustration"
+                     [date]="post.publicationDate"
+                     [postId]="post.id"
+                     [category]="post.category"
+                     [title]="post.title"
+                     [username]="'Guams'"
+                     [description]="post.description"/>
+    }
+  } @else {
+    <h1>Aucun post n'a été créé pour l'instant</h1>
   }
 </div>
diff --git a/src/app/pages/login/login.component.css b/src/app/pages/login/login.component.css
new file mode 100644
index 0000000..ce9d921
--- /dev/null
+++ b/src/app/pages/login/login.component.css
@@ -0,0 +1,18 @@
+.form-container {
+  margin-top: 2em;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+.form {
+  width: 100%;
+  max-width: 50em;
+  display: flex;
+  flex-direction: column;
+  gap:1em;
+}
+
+.send-button {
+  align-self: center;
+}
diff --git a/src/app/pages/login/login.component.html b/src/app/pages/login/login.component.html
index 47d7ad7..76e243f 100644
--- a/src/app/pages/login/login.component.html
+++ b/src/app/pages/login/login.component.html
@@ -1,14 +1,18 @@
 <app-header></app-header>
-<label for="username">Nom d'utilisateur</label>
-<input type="text" id="username" placeholder="Jean Zay" pInputText [(ngModel)]="name"/>
-<label for="password">Mot de passe</label>
-<input type="password" id="password" placeholder="motDePasseTrèsSecret" pInputText [(ngModel)]="password"/>
-<label for="confirm-password">Confirmez le mot de passe</label>
-<input type="password" id="confirm-password" placeholder="motDePasseTrèsSecret" pInputText [(ngModel)]="confirmPassword" (keyup.enter)="sendLogins()" />
-<p-button
-  label="Se connecter"
-  icon="pi pi-check"
-  (onClick)="sendLogins()"
-/>
-
-{{ actualAuthor | json }}
+<div class="form-container">
+  <div class="form">
+    <label for="username">Nom d'utilisateur</label>
+    <input type="text" id="username" placeholder="Jean Zay" pInputText [(ngModel)]="name"/>
+    <label for="password">Mot de passe</label>
+    <input type="password" id="password" placeholder="motDePasseTrèsSecret" pInputText [(ngModel)]="password"/>
+    <label for="confirm-password">Confirmez le mot de passe</label>
+    <input type="password" id="confirm-password" placeholder="motDePasseTrèsSecret" pInputText
+           [(ngModel)]="confirmPassword" (keyup.enter)="sendLogins()"/>
+    <p-button
+      class="send-button"
+      label="Se connecter"
+      icon="pi pi-check"
+      (onClick)="sendLogins()"
+    />
+  </div>
+</div>
diff --git a/src/app/logout/logout.component.css b/src/app/pages/logout/logout.component.css
similarity index 100%
rename from src/app/logout/logout.component.css
rename to src/app/pages/logout/logout.component.css
diff --git a/src/app/pages/my-posts/my-posts.component.css b/src/app/pages/my-posts/my-posts.component.css
index e69de29..9b14747 100644
--- a/src/app/pages/my-posts/my-posts.component.css
+++ b/src/app/pages/my-posts/my-posts.component.css
@@ -0,0 +1,10 @@
+:host ::ng-deep .p-dialog {
+  width: 800px;
+}
+
+.delete-dialog {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  gap: 3em;
+}
diff --git a/src/app/pages/my-posts/my-posts.component.html b/src/app/pages/my-posts/my-posts.component.html
index 918f98e..cde8d1f 100644
--- a/src/app/pages/my-posts/my-posts.component.html
+++ b/src/app/pages/my-posts/my-posts.component.html
@@ -25,7 +25,7 @@
       <td>
         <p-button icon="pi pi-eye" (click)="openDialog(previewDialogVisibility, rowIndex)" severity="info"
                   label="Prévisualiser"/>
-        <p-dialog header='Prévisualisation de "{{ post.title }}"' [modal]="true"
+        <p-dialog class="preview-dialog" header='Prévisualisation de "{{ post.title }}"' [modal]="true"
                   [(visible)]="previewDialogVisibility[rowIndex]">
           <app-post-home [title]="post.title"
                          [description]="post.description"
@@ -38,6 +38,13 @@
         <p-button icon="pi pi-pencil" (click)="openDialog(updateDialogVisibility, rowIndex)" severity="warning"
                   label="Modifier"/>
         <p-dialog header='Modifier "{{ post.title }}"' [modal]="true" [(visible)]="updateDialogVisibility[rowIndex]">
+          <app-post-form [actualAuthor]="actualAuthor"
+                         [postId]="post.id"
+                         [isUpdateMode]="true"
+                         [title]="post.title"
+                         [category]="post.category"
+                         [description]="post.description"
+                         [body]="post.body"/>
         </p-dialog>
       </td>
       <td>
@@ -45,13 +52,15 @@
                   label="Supprimer"/>
         <p-dialog header='Êtes-vous sur de bien vouloir supprimer "{{ post.title }}"' [modal]="true"
                   [(visible)]="deleteDialogVisibility[rowIndex]">
-          <p-button label="Annuler"
-                    icon="pi pi-times"
-                    severity="info"
-                    (click)="closeDialog(deleteDialogVisibility, rowIndex)"/>
-          <p-button (click)="deletePost(post.id, rowIndex)"
-                    label="Oui" icon="pi pi-trash"
-                    severity="danger"/>
+          <div class="delete-dialog">
+            <p-button label="Annuler"
+                      icon="pi pi-times"
+                      severity="info"
+                      (click)="closeDialog(deleteDialogVisibility, rowIndex)"/>
+            <p-button (click)="deletePost(post.id, rowIndex)"
+                      label="Oui" icon="pi pi-trash"
+                      severity="danger"/>
+          </div>
         </p-dialog>
       </td>
     </tr>
diff --git a/src/app/pages/my-posts/my-posts.component.ts b/src/app/pages/my-posts/my-posts.component.ts
index cd44b80..871dd0e 100644
--- a/src/app/pages/my-posts/my-posts.component.ts
+++ b/src/app/pages/my-posts/my-posts.component.ts
@@ -13,19 +13,21 @@ import {DialogModule} from 'primeng/dialog';
 import {InputTextModule} from 'primeng/inputtext';
 import {PostHomeComponent} from '../../components/post-home/post-home.component';
 import {PostService} from '../../services/post.service';
+import {PostFormComponent} from "../../components/post-form/post-form.component";
 
 @Component({
   selector: 'app-my-posts',
   standalone: true,
-  imports: [
-    HeaderComponent,
-    TableModule,
-    Button,
-    DatePipe,
-    DialogModule,
-    InputTextModule,
-    PostHomeComponent
-  ],
+    imports: [
+        HeaderComponent,
+        TableModule,
+        Button,
+        DatePipe,
+        DialogModule,
+        InputTextModule,
+        PostHomeComponent,
+        PostFormComponent
+    ],
   templateUrl: './my-posts.component.html',
   styleUrl: './my-posts.component.css'
 })
@@ -35,14 +37,14 @@ export class MyPostsComponent implements OnDestroy {
   updateDialogVisibility: boolean[] = [];
   deleteDialogVisibility: boolean[] = [];
   posts: Post[] = [];
-  concernedAuthor: Author | undefined;
+  actualAuthor: Author | undefined;
 
 
   constructor(private cookieService: CookieService,
               private postService: PostService,
               private authorService: AuthorService,
               private messageService: MessageService) {
-    this.concernedAuthor = this.cookieService.get('author') ? JSON.parse(this.cookieService.get('author')) : undefined;
+    this.actualAuthor = this.cookieService.get('author') ? JSON.parse(this.cookieService.get('author')) : undefined;
     this.updatePosts();
   }
 
@@ -58,7 +60,7 @@ export class MyPostsComponent implements OnDestroy {
 
   updatePosts(): void {
     if (this.cookieService.get('token')) {
-      this.authorService.getAuthorsPosts(this.concernedAuthor?.id, this.cookieService.get('token')).subscribe({
+      this.authorService.getAuthorsPosts(this.actualAuthor?.id, this.cookieService.get('token')).subscribe({
           next: posts => this.posts = posts,
           error: error => this.failureMessage("Erreur", error.message),
         }
diff --git a/src/app/new-post/new-post.component.css b/src/app/pages/new-post/new-post.component.css
similarity index 100%
rename from src/app/new-post/new-post.component.css
rename to src/app/pages/new-post/new-post.component.css
diff --git a/src/app/pages/new-post/new-post.component.html b/src/app/pages/new-post/new-post.component.html
index 7fd49d3..affd9f4 100644
--- a/src/app/pages/new-post/new-post.component.html
+++ b/src/app/pages/new-post/new-post.component.html
@@ -1,21 +1,2 @@
 <app-header></app-header>
-<form [formGroup]="form" (ngSubmit)="onSubmit()">
-  <label for="title">Titre du post</label>
-  <input id="title" type="text" pInputText formControlName="title"/>
-  <label for="category">Catégorie du post</label>
-  <input pInputText id="category" formControlName="category" type="text"/>
-  <label for="desc">Description du post</label>
-  <textarea formControlName="description" id="desc" pInputTextarea></textarea>
-  <label>Image descriptive du post</label>
-  <p-fileUpload accept="image/*"
-                maxFileSize="1000000"
-                [showUploadButton]="false"
-                [showCancelButton]="false"
-                chooseLabel="Sélectionner une image"
-                (onSelect)="onSelected($event)">
-    <ng-template pTemplate="content">
-    </ng-template>
-  </p-fileUpload>
-  <p-editor formControlName="body" [style]="{ height: '320px' }"/>
-  <p-button type="submit" label="envoyer" ></p-button>
-</form>
+<app-post-form [actualAuthor]="actualAuthor"/>
diff --git a/src/app/pages/new-post/new-post.component.ts b/src/app/pages/new-post/new-post.component.ts
index 646b5d1..5c0d207 100644
--- a/src/app/pages/new-post/new-post.component.ts
+++ b/src/app/pages/new-post/new-post.component.ts
@@ -13,6 +13,7 @@ import {EditorModule} from 'primeng/editor';
 import {AuthorService} from '../../services/author.service';
 import {Author} from '../../models/author';
 import {Router} from '@angular/router';
+import {PostFormComponent} from '../../components/post-form/post-form.component';
 
 @Component({
   selector: 'app-new-post',
@@ -23,7 +24,8 @@ import {Router} from '@angular/router';
     InputTextModule,
     InputTextareaModule,
     FileUploadModule,
-    EditorModule
+    EditorModule,
+    PostFormComponent
   ],
   templateUrl: './new-post.component.html',
   styleUrl: './new-post.component.css'
diff --git a/src/app/post/post.component.css b/src/app/pages/not-found/not-found.component.css
similarity index 100%
rename from src/app/post/post.component.css
rename to src/app/pages/not-found/not-found.component.css
diff --git a/src/app/profile/profile.component.css b/src/app/pages/post/post.component.css
similarity index 100%
rename from src/app/profile/profile.component.css
rename to src/app/pages/post/post.component.css
diff --git a/src/app/register/register.component.css b/src/app/pages/profile/profile.component.css
similarity index 100%
rename from src/app/register/register.component.css
rename to src/app/pages/profile/profile.component.css
diff --git a/src/app/pages/register/register.component.css b/src/app/pages/register/register.component.css
new file mode 100644
index 0000000..e69de29
diff --git a/src/app/services/post.service.ts b/src/app/services/post.service.ts
index 3bd54c8..d3c4226 100644
--- a/src/app/services/post.service.ts
+++ b/src/app/services/post.service.ts
@@ -27,6 +27,16 @@ export class PostService {
     return this.httpClient.delete(`${this.url}/${id}`, httpOptions);
   }
 
+  updatePost(postId: bigint, postData: any, token: string) {
+    const httpOptions = {
+      headers: new HttpHeaders({
+        'Authorization': `Bearer ${token}`
+      })
+    };
+    return this.httpClient.put(`${this.url}/${postId}`, postData, httpOptions);
+
+  }
+
   createPost(post: any, token: string | undefined): Observable<Post> {
     const httpOptions = {
       headers: new HttpHeaders({
@@ -36,7 +46,7 @@ export class PostService {
     return this.httpClient.post<Post>(this.url, post, httpOptions);
   }
 
-  changeIllustration(id: bigint, image: File | undefined, token: string): Observable<Post> {
+  changeIllustration(id: bigint | undefined, image: File | undefined, token: string): Observable<Post> {
     if (image) {
       const formData: FormData = new FormData();
       formData.append('illustration', image);