diff --git a/src/content/docs/fr/guides/middleware.mdx b/src/content/docs/fr/guides/middleware.mdx
index 33ff029b848f4..96b27c895e39e 100644
--- a/src/content/docs/fr/guides/middleware.mdx
+++ b/src/content/docs/fr/guides/middleware.mdx
@@ -4,6 +4,7 @@ description: Apprendre à utiliser le middleware dans Astro.
 i18nReady: true
 ---
 import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro';
+import { Steps } from '@astrojs/starlight/components';
 
 **Middleware** vous permet d'intercepter les demandes et les réponses et d'injecter des comportements de manière dynamique chaque fois qu'une page ou un point de terminaison est sur le point d'être rendu. Ce rendu a lieu au moment de la construction pour toutes les pages pré-rendues, mais il a lieu lorsque la route est demandée pour les pages rendues à la demande.
 
@@ -11,19 +12,20 @@ Le middleware vous permet également de définir et de partager des informations
 
 ## Utilisation basique
 
+<Steps>
 1. Créez `src/middleware.js|ts` (Alternativement, vous pouvez créer `src/middleware/index.js|ts`.)
 
 2. Dans ce fichier, exportez une fonction [`onRequest()`](/fr/reference/api-reference/#onrequest) à laquelle on peut passer un objet [`context`](#objet-context) et une fonction `next()`. Il ne doit pas s'agir d'une exportation par défaut.
 
- ```js title="src/middleware.js"
- export function onRequest ({ locals, request }, next) {
-     // intercepter les données d'une requête
-     // optionnellement, modifie la propriété dans `locals`
-     locals.title = "Nouveau titre";
+    ```js title="src/middleware.js"
+    export function onRequest (context, next) {
+         // intercepter les données d'une requête
+         // optionnellement, modifie la propriété dans `locals`
+         context.locals.title = "Nouveau titre";
 
-     // renvoie une Réponse ou le résultat de l'appel à `next()`
-     return next();
- };
+         // renvoie une Réponse ou le résultat de l'appel à `next()`
+         return next();
+    };
     ```
 
 3. Dans n'importe quel fichier `.astro`, accédez aux données de réponse en utilisant `Astro.locals`.
@@ -35,6 +37,7 @@ Le middleware vous permet également de définir et de partager des informations
     <h1>{data.title}</h1>
     <p>This {data.property} provient du middleware.</p>
     ```
+</Steps>
 
 ### Objet `context`
 
@@ -55,11 +58,11 @@ Les [Integrations](/fr/guides/integrations-guide/) peuvent définir des proprié
 Vous pouvez stocker n'importe quel type de données dans `locals` : des chaînes, des nombres, et même des types de données complexes tels que des fonctions et des cartes.
 
 ```js title="src/middleware.js"
-export function onRequest ({ locals, request }, next) {
+export function onRequest (context, next) {
     // intercepter les données de réponse d'une requête
     // optionnellement, modifie la propriété dans `locals`
-    locals.user.name = "John Wick";
-    locals.welcomeTitle = () => {
+    context.locals.user.name = "John Wick";
+    context.locals.welcomeTitle = () => {
         return "Welcome back " + locals.user.name;
     };