Mr.tech Veikko

Mr.tech Veikko

Share

04/03/2026

Je lis les commentaires 👇👇

28/02/2026

16/02/2026

Salut Les gars, Vous vous êtes déjà demandé comment d'autres sites ou application Web communiquer avec le serveur sans recharger ?

C'est grâce à JavaScript avec Fetch suivons l'explication plus bas

👇🏾👇🏾👇🏾

1️⃣ C’est quoi Fetch ?

Fetch est une API JavaScript intégrée aux navigateurs qui permet d’envoyer des requêtes HTTP (GET, POST, PUT, DELETE…) vers un serveur et de récupérer des données (souvent en JSON).

👉 En clair :
Fetch = le moyen moderne pour que ton JavaScript parle à une API backend (PHP, Node, Laravel, etc.)

2️⃣ Pourquoi on utilise Fetch ?

Avant, on utilisait surtout XMLHttpRequest (lourd et compliqué).
Fetch est :

✅ Plus simple à lire

✅ Basé sur les promises

✅ Parfait pour les API REST

✅ Natif (pas besoin de librairie)

3️⃣ Comment ça fonctionne ?

Le schéma est simple :

Navigateur (JS) → Fetch → API Backend → Réponse (JSON)

Exemple :

Le front demande : “Donne-moi la liste des produits”

Le serveur répond : “Voilà les produits en JSON”

Le JS affiche les données à l’écran

4️⃣ Exemple simple (GET)

fetch("https://monapi.com/produits")
.then(response => response.json())
.then(data => {
console.log(data);
})
.catch(error => {
console.error("Erreur :", error);
});

🔎 Explication :

fetch() envoie la requête

response.json() transforme la réponse en objet JS

data contient les données du serveur

5️⃣ Exemple avec envoi de données (POST)

fetch("https://monapi.com/produits", {
method: "POST",
headers: {
"Content-Type": "application/json"
},
body: JSON.stringify({
nom: "Chaussures",
prix: 50
})
})then(res => res.json())then(data => console.log(data));

👉 Ici, le front envoie des données au serveur.

6️⃣ Fetch et API REST

Fetch est souvent utilisé avec une API REST :

GET : lire des données

POST: créer

PUT / PATCH : modifier

DELETE : supprimer

7️⃣ En résumé

Fetch est une API JavaScript côté front

Elle sert à communiquer avec un serveur

Elle fonctionne avec des promises

Elle est idéale pour les applications modernes (SPA, dashboards, e-commerce…)

14/02/2026

Just learn linux

Want your business to be the top-listed Engineering Company in Bujumbura?
Click here to claim your Sponsored Listing.

Telephone

Address

Brisbane
Bujumbura
00