ramzouille/notes
ramzouille/notes
1
0
Fork 0
mirror of https://github.com/buchtioof/notes.git synced 2026-05-02 17:43:28 +02:00
Code Issues Packages Projects Releases Wiki Activity

add 09/02

Browse Source
This commit is contained in:
squick 2026-02-09 14:34:20 +01:00
parent 9fbaa625ad
commit 97554712f1
17 changed files with 1070 additions and 223 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
docs/learn/javascript.md
View File

@ -3,4 +3,5 @@
## Sommaire
- [Cours 1 : ](javascript/2026-01-30.md)
- [Cours 2 : Asynchrone et Manip de fichiers](javascript/2026-02-06.md)
- [Cours 2 : Asynchrone et Manip de fichiers](javascript/2026-02-06.md)
- [Cours 3 : fetch des APIs et serveur HTTP](javascript/2026-02-09.md)

49
docs/learn/javascript/2026-02-09.md Normal file
View File

@ -0,0 +1,49 @@
<img src="https://pbs.twimg.com/media/HAtgMOZXUAAH0kD?format=jpg&name=medium" alt="tasty crousty goumin 67 doro">
# JS en gros pt.3 : fetch des APIs et serveur HTTP (09/02/26)
## Fetch et APIs
Dans le cadre d'un TP, on a fait des appels à des APIs externes comme celle du CNAM ou encore openweathermap pour intégrer les données actuelles dans un script JS.
Pour faire des appels, on utlise la méthode Asynchrone du cours précédent qui nous permettra de faire des appels des APIs sans arrêter le programme en attendant la réponse. Une fonction nous permet de faire cet appel : `fetch()`
### `fetch()` (Le coursier)
fetch à le rôle de coursier, c'est lui qui effectuera la requête HTTP (GET par défaut).
* **Ce que ça fait :** Ça envoie un ping à une URL pour aller chercher des data.
* Et ça renvoie une promesse en attendant la réponse de l'API
Pour traiter nos réponses proprement, on combine nos fetch avec le module json()
### `json()` (Le traducteur)
Quand `fetch` revient, il te ramène un gros paquet brut (un `Response object`).
* **Ce que ça fait :** Ça prend ce paquet et ça le transforme en **Objet JavaScript** utilisable (avec des accolades `{}` et tout).
* **Note :** C'est aussi asynchrone, donc il faut un `await` devant aussi.
### Exemple du TP
Dans une fonction async `fetchCityInfo()`, on essayera de fetch via cette fonction :
```javascript
// Attend de fetch les données d'une ville donnée par l'utilisateur via la variable cityName
const geoRes = await fetch(`https://geoservice.cnam.fr/api/cities?name=${encodeURIComponent(cityName)}`);
```
Puis on encode les données brutes reçues dans un joli tableau JSON :
```javascript
// La constante cities récupère le résultat geoRes et le range en JSON
const cities = await geoRes.json();
```
Plus tard, on refait un fetch de données avec une clé API pour openweathermap (cas concret en gros) :
```javascript
//Comme tout à l'heure, on fetch les données de l'API et on attend la réponse via await
const weatherRes = await fetch(`http://api.weatherapi.com/v1/current.json?q=${encodeURIComponent(cityName)}&key=****`);
```
Bravo, tu as fait un appel d'API et l'a rangé dans un beau tableau JSON.
## Serveur HTTP

10
site/404.html
View File

@ -19,7 +19,7 @@
<title>Les incroyables notes de ramzouille</title>
<title>Les incroyables notes de devops</title>
@ -153,7 +153,7 @@
<header class="md-header md-header--shadow" data-md-component="header">
<nav class="md-header__inner md-grid" aria-label="Header">
<a href="/" title="Les incroyables notes de ramzouille" class="md-header__button md-logo" aria-label="Les incroyables notes de ramzouille" data-md-component="logo">
<a href="/" title="Les incroyables notes de devops" class="md-header__button md-logo" aria-label="Les incroyables notes de devops" data-md-component="logo">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="lucide lucide-book-open" viewBox="0 0 24 24"><path d="M12 7v14M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z"/></svg>
@ -167,7 +167,7 @@
<div class="md-header__ellipsis">
<div class="md-header__topic">
<span class="md-ellipsis">
Les incroyables notes de ramzouille
Les incroyables notes de devops
</span>
</div>
<div class="md-header__topic" data-md-component="header-topic">
@ -272,13 +272,13 @@
<nav class="md-nav md-nav--primary" aria-label="Navigation" data-md-level="0">
<label class="md-nav__title" for="__drawer">
<a href="/" title="Les incroyables notes de ramzouille" class="md-nav__button md-logo" aria-label="Les incroyables notes de ramzouille" data-md-component="logo">
<a href="/" title="Les incroyables notes de devops" class="md-nav__button md-logo" aria-label="Les incroyables notes de devops" data-md-component="logo">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="lucide lucide-book-open" viewBox="0 0 24 24"><path d="M12 7v14M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z"/></svg>
</a>
Les incroyables notes de ramzouille
Les incroyables notes de devops
</label>
<div class="md-nav__source">

10
site/cheatsheets/2025-11-28/index.html
View File

@ -23,7 +23,7 @@
<title>Commandes *sh pour les idiots (28/11/25) - Les incroyables notes de ramzouille</title>
<title>Commandes *sh pour les idiots (28/11/25) - Les incroyables notes de devops</title>
@ -162,7 +162,7 @@
<header class="md-header md-header--shadow" data-md-component="header">
<nav class="md-header__inner md-grid" aria-label="Header">
<a href="../.." title="Les incroyables notes de ramzouille" class="md-header__button md-logo" aria-label="Les incroyables notes de ramzouille" data-md-component="logo">
<a href="../.." title="Les incroyables notes de devops" class="md-header__button md-logo" aria-label="Les incroyables notes de devops" data-md-component="logo">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="lucide lucide-book-open" viewBox="0 0 24 24"><path d="M12 7v14M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z"/></svg>
@ -176,7 +176,7 @@
<div class="md-header__ellipsis">
<div class="md-header__topic">
<span class="md-ellipsis">
Les incroyables notes de ramzouille
Les incroyables notes de devops
</span>
</div>
<div class="md-header__topic" data-md-component="header-topic">
@ -281,13 +281,13 @@
<nav class="md-nav md-nav--primary" aria-label="Navigation" data-md-level="0">
<label class="md-nav__title" for="__drawer">
<a href="../.." title="Les incroyables notes de ramzouille" class="md-nav__button md-logo" aria-label="Les incroyables notes de ramzouille" data-md-component="logo">
<a href="../.." title="Les incroyables notes de devops" class="md-nav__button md-logo" aria-label="Les incroyables notes de devops" data-md-component="logo">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="lucide lucide-book-open" viewBox="0 0 24 24"><path d="M12 7v14M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z"/></svg>
</a>
Les incroyables notes de ramzouille
Les incroyables notes de devops
</label>
<div class="md-nav__source">

10
site/cheatsheets/2025-12-12/index.html
View File

@ -23,7 +23,7 @@
<title>Git pour les neuilles (12/12/25) - Les incroyables notes de ramzouille</title>
<title>Git pour les neuilles (12/12/25) - Les incroyables notes de devops</title>
@ -162,7 +162,7 @@
<header class="md-header md-header--shadow" data-md-component="header">
<nav class="md-header__inner md-grid" aria-label="Header">
<a href="../.." title="Les incroyables notes de ramzouille" class="md-header__button md-logo" aria-label="Les incroyables notes de ramzouille" data-md-component="logo">
<a href="../.." title="Les incroyables notes de devops" class="md-header__button md-logo" aria-label="Les incroyables notes de devops" data-md-component="logo">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="lucide lucide-book-open" viewBox="0 0 24 24"><path d="M12 7v14M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z"/></svg>
@ -176,7 +176,7 @@
<div class="md-header__ellipsis">
<div class="md-header__topic">
<span class="md-ellipsis">
Les incroyables notes de ramzouille
Les incroyables notes de devops
</span>
</div>
<div class="md-header__topic" data-md-component="header-topic">
@ -281,13 +281,13 @@
<nav class="md-nav md-nav--primary" aria-label="Navigation" data-md-level="0">
<label class="md-nav__title" for="__drawer">
<a href="../.." title="Les incroyables notes de ramzouille" class="md-nav__button md-logo" aria-label="Les incroyables notes de ramzouille" data-md-component="logo">
<a href="../.." title="Les incroyables notes de devops" class="md-nav__button md-logo" aria-label="Les incroyables notes de devops" data-md-component="logo">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="lucide lucide-book-open" viewBox="0 0 24 24"><path d="M12 7v14M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z"/></svg>
</a>
Les incroyables notes de ramzouille
Les incroyables notes de devops
</label>
<div class="md-nav__source">

10
site/cheatsheets/2026-01-16/index.html
View File

@ -23,7 +23,7 @@
<title>pip et environnements virtuels pour les caca (16/01/26) - Les incroyables notes de ramzouille</title>
<title>pip et environnements virtuels pour les caca (16/01/26) - Les incroyables notes de devops</title>
@ -162,7 +162,7 @@
<header class="md-header md-header--shadow" data-md-component="header">
<nav class="md-header__inner md-grid" aria-label="Header">
<a href="../.." title="Les incroyables notes de ramzouille" class="md-header__button md-logo" aria-label="Les incroyables notes de ramzouille" data-md-component="logo">
<a href="../.." title="Les incroyables notes de devops" class="md-header__button md-logo" aria-label="Les incroyables notes de devops" data-md-component="logo">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="lucide lucide-book-open" viewBox="0 0 24 24"><path d="M12 7v14M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z"/></svg>
@ -176,7 +176,7 @@
<div class="md-header__ellipsis">
<div class="md-header__topic">
<span class="md-ellipsis">
Les incroyables notes de ramzouille
Les incroyables notes de devops
</span>
</div>
<div class="md-header__topic" data-md-component="header-topic">
@ -281,13 +281,13 @@
<nav class="md-nav md-nav--primary" aria-label="Navigation" data-md-level="0">
<label class="md-nav__title" for="__drawer">
<a href="../.." title="Les incroyables notes de ramzouille" class="md-nav__button md-logo" aria-label="Les incroyables notes de ramzouille" data-md-component="logo">
<a href="../.." title="Les incroyables notes de devops" class="md-nav__button md-logo" aria-label="Les incroyables notes de devops" data-md-component="logo">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="lucide lucide-book-open" viewBox="0 0 24 24"><path d="M12 7v14M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z"/></svg>
</a>
Les incroyables notes de ramzouille
Les incroyables notes de devops
</label>
<div class="md-nav__source">

10
site/cheatsheets/2026-01-22/index.html
View File

@ -23,7 +23,7 @@
<title>SQL pour les tung tung tung sahur (22/01/26) - Les incroyables notes de ramzouille</title>
<title>SQL pour les tung tung tung sahur (22/01/26) - Les incroyables notes de devops</title>
@ -162,7 +162,7 @@
<header class="md-header md-header--shadow" data-md-component="header">
<nav class="md-header__inner md-grid" aria-label="Header">
<a href="../.." title="Les incroyables notes de ramzouille" class="md-header__button md-logo" aria-label="Les incroyables notes de ramzouille" data-md-component="logo">
<a href="../.." title="Les incroyables notes de devops" class="md-header__button md-logo" aria-label="Les incroyables notes de devops" data-md-component="logo">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="lucide lucide-book-open" viewBox="0 0 24 24"><path d="M12 7v14M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z"/></svg>
@ -176,7 +176,7 @@
<div class="md-header__ellipsis">
<div class="md-header__topic">
<span class="md-ellipsis">
Les incroyables notes de ramzouille
Les incroyables notes de devops
</span>
</div>
<div class="md-header__topic" data-md-component="header-topic">
@ -281,13 +281,13 @@
<nav class="md-nav md-nav--primary" aria-label="Navigation" data-md-level="0">
<label class="md-nav__title" for="__drawer">
<a href="../.." title="Les incroyables notes de ramzouille" class="md-nav__button md-logo" aria-label="Les incroyables notes de ramzouille" data-md-component="logo">
<a href="../.." title="Les incroyables notes de devops" class="md-nav__button md-logo" aria-label="Les incroyables notes de devops" data-md-component="logo">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="lucide lucide-book-open" viewBox="0 0 24 24"><path d="M12 7v14M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z"/></svg>
</a>
Les incroyables notes de ramzouille
Les incroyables notes de devops
</label>
<div class="md-nav__source">

16
site/index.html
View File

@ -21,7 +21,7 @@
<title>Bienvenue dans les notes de ramzouille - Les incroyables notes de ramzouille</title>
<title>Bienvenue dans mes notes de devops - Les incroyables notes de devops</title>
@ -144,7 +144,7 @@
<div data-md-component="skip">
<a href="#bienvenue-dans-les-notes-de-ramzouille" class="md-skip">
<a href="#bienvenue-dans-mes-notes-de-devops" class="md-skip">
Skip to content
</a>
@ -160,7 +160,7 @@
<header class="md-header md-header--shadow" data-md-component="header">
<nav class="md-header__inner md-grid" aria-label="Header">
<a href="" title="Les incroyables notes de ramzouille" class="md-header__button md-logo" aria-label="Les incroyables notes de ramzouille" data-md-component="logo">
<a href="" title="Les incroyables notes de devops" class="md-header__button md-logo" aria-label="Les incroyables notes de devops" data-md-component="logo">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="lucide lucide-book-open" viewBox="0 0 24 24"><path d="M12 7v14M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z"/></svg>
@ -174,13 +174,13 @@
<div class="md-header__ellipsis">
<div class="md-header__topic">
<span class="md-ellipsis">
Les incroyables notes de ramzouille
Les incroyables notes de devops
</span>
</div>
<div class="md-header__topic" data-md-component="header-topic">
<span class="md-ellipsis">
Bienvenue dans les notes de ramzouille
Bienvenue dans mes notes de devops
</span>
</div>
@ -279,13 +279,13 @@
<nav class="md-nav md-nav--primary" aria-label="Navigation" data-md-level="0">
<label class="md-nav__title" for="__drawer">
<a href="" title="Les incroyables notes de ramzouille" class="md-nav__button md-logo" aria-label="Les incroyables notes de ramzouille" data-md-component="logo">
<a href="" title="Les incroyables notes de devops" class="md-nav__button md-logo" aria-label="Les incroyables notes de devops" data-md-component="logo">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="lucide lucide-book-open" viewBox="0 0 24 24"><path d="M12 7v14M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z"/></svg>
</a>
Les incroyables notes de ramzouille
Les incroyables notes de devops
</label>
<div class="md-nav__source">
@ -859,7 +859,7 @@
<p><img src="https://media1.tenor.com/m/ZTT94KgxLEUAAAAd/bassem-rire.gif" alt="tk completement sous frozen">
<em>avant le 28/11 y'a rien a gratter, j'installais linux pour la 9387e fois</em></p>
<h1 id="bienvenue-dans-les-notes-de-ramzouille">Bienvenue dans les notes de ramzouille</h1>
<h1 id="bienvenue-dans-mes-notes-de-devops">Bienvenue dans mes notes de devops</h1>
<h2 id="structure">Structure</h2>
<p>-&gt; cheatsheets (Notes sur les outils dev du quotidien)</p>
<p>-&gt; cours (Notes sur les cours)</p>

10
site/learn/2025-10-30/index.html
View File

@ -23,7 +23,7 @@
<title>C koi linux ? (30/10/25) - Les incroyables notes de ramzouille</title>
<title>C koi linux ? (30/10/25) - Les incroyables notes de devops</title>
@ -162,7 +162,7 @@
<header class="md-header md-header--shadow" data-md-component="header">
<nav class="md-header__inner md-grid" aria-label="Header">
<a href="../.." title="Les incroyables notes de ramzouille" class="md-header__button md-logo" aria-label="Les incroyables notes de ramzouille" data-md-component="logo">
<a href="../.." title="Les incroyables notes de devops" class="md-header__button md-logo" aria-label="Les incroyables notes de devops" data-md-component="logo">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="lucide lucide-book-open" viewBox="0 0 24 24"><path d="M12 7v14M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z"/></svg>
@ -176,7 +176,7 @@
<div class="md-header__ellipsis">
<div class="md-header__topic">
<span class="md-ellipsis">
Les incroyables notes de ramzouille
Les incroyables notes de devops
</span>
</div>
<div class="md-header__topic" data-md-component="header-topic">
@ -281,13 +281,13 @@
<nav class="md-nav md-nav--primary" aria-label="Navigation" data-md-level="0">
<label class="md-nav__title" for="__drawer">
<a href="../.." title="Les incroyables notes de ramzouille" class="md-nav__button md-logo" aria-label="Les incroyables notes de ramzouille" data-md-component="logo">
<a href="../.." title="Les incroyables notes de devops" class="md-nav__button md-logo" aria-label="Les incroyables notes de devops" data-md-component="logo">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="lucide lucide-book-open" viewBox="0 0 24 24"><path d="M12 7v14M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z"/></svg>
</a>
Les incroyables notes de ramzouille
Les incroyables notes de devops
</label>
<div class="md-nav__source">

10
site/learn/javascript/2026-01-30/index.html
View File

@ -19,7 +19,7 @@
<title>Javascript en gros pt.1 (30/01/26) - Les incroyables notes de ramzouille</title>
<title>Javascript en gros pt.1 (30/01/26) - Les incroyables notes de devops</title>
@ -158,7 +158,7 @@
<header class="md-header md-header--shadow" data-md-component="header">
<nav class="md-header__inner md-grid" aria-label="Header">
<a href="../../.." title="Les incroyables notes de ramzouille" class="md-header__button md-logo" aria-label="Les incroyables notes de ramzouille" data-md-component="logo">
<a href="../../.." title="Les incroyables notes de devops" class="md-header__button md-logo" aria-label="Les incroyables notes de devops" data-md-component="logo">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="lucide lucide-book-open" viewBox="0 0 24 24"><path d="M12 7v14M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z"/></svg>
@ -172,7 +172,7 @@
<div class="md-header__ellipsis">
<div class="md-header__topic">
<span class="md-ellipsis">
Les incroyables notes de ramzouille
Les incroyables notes de devops
</span>
</div>
<div class="md-header__topic" data-md-component="header-topic">
@ -277,13 +277,13 @@
<nav class="md-nav md-nav--primary" aria-label="Navigation" data-md-level="0">
<label class="md-nav__title" for="__drawer">
<a href="../../.." title="Les incroyables notes de ramzouille" class="md-nav__button md-logo" aria-label="Les incroyables notes de ramzouille" data-md-component="logo">
<a href="../../.." title="Les incroyables notes de devops" class="md-nav__button md-logo" aria-label="Les incroyables notes de devops" data-md-component="logo">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="lucide lucide-book-open" viewBox="0 0 24 24"><path d="M12 7v14M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z"/></svg>
</a>
Les incroyables notes de ramzouille
Les incroyables notes de devops
</label>
<div class="md-nav__source">

163
site/learn/javascript/2026-02-06/index.html
View File

@ -19,7 +19,7 @@
<title>JS en gros pt.2 : Asynchrone et promesses, Manip de fichiers (06/02/26) - Les incroyables notes de ramzouille</title>
<title>JS en gros pt.2 : Asynchrone et promesses, Manip de fichiers (06/02/26) - Les incroyables notes de devops</title>
@ -158,7 +158,7 @@
<header class="md-header md-header--shadow" data-md-component="header">
<nav class="md-header__inner md-grid" aria-label="Header">
<a href="../../.." title="Les incroyables notes de ramzouille" class="md-header__button md-logo" aria-label="Les incroyables notes de ramzouille" data-md-component="logo">
<a href="../../.." title="Les incroyables notes de devops" class="md-header__button md-logo" aria-label="Les incroyables notes de devops" data-md-component="logo">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="lucide lucide-book-open" viewBox="0 0 24 24"><path d="M12 7v14M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z"/></svg>
@ -172,7 +172,7 @@
<div class="md-header__ellipsis">
<div class="md-header__topic">
<span class="md-ellipsis">
Les incroyables notes de ramzouille
Les incroyables notes de devops
</span>
</div>
<div class="md-header__topic" data-md-component="header-topic">
@ -277,13 +277,13 @@
<nav class="md-nav md-nav--primary" aria-label="Navigation" data-md-level="0">
<label class="md-nav__title" for="__drawer">
<a href="../../.." title="Les incroyables notes de ramzouille" class="md-nav__button md-logo" aria-label="Les incroyables notes de ramzouille" data-md-component="logo">
<a href="../../.." title="Les incroyables notes de devops" class="md-nav__button md-logo" aria-label="Les incroyables notes de devops" data-md-component="logo">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="lucide lucide-book-open" viewBox="0 0 24 24"><path d="M12 7v14M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z"/></svg>
</a>
Les incroyables notes de ramzouille
Les incroyables notes de devops
</label>
<div class="md-nav__source">
@ -871,106 +871,6 @@
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="#manipulation-de-fichiers" class="md-nav__link">
<span class="md-ellipsis">
Manipulation de fichiers
</span>
</a>
</li>
<li class="md-nav__item">
<a href="#lecture-de-fichiers-fsreadfile" class="md-nav__link">
<span class="md-ellipsis">
Lecture de fichiers (fs.readFile)
</span>
</a>
<nav class="md-nav" aria-label="Lecture de fichiers (fs.readFile)">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#2-la-resolution-le-callback" class="md-nav__link">
<span class="md-ellipsis">
2. La Résolution (Le Callback)
</span>
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="#partie-2-le-traitement-sequentiel-le-modele-asyncawait" class="md-nav__link">
<span class="md-ellipsis">
PARTIE 2 : Le Traitement Séquentiel (Le modèle async/await)
</span>
</a>
<nav class="md-nav" aria-label="PARTIE 2 : Le Traitement Séquentiel (Le modèle async&#x2f;await)">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#1-la-suspension-de-lexecution-await" class="md-nav__link">
<span class="md-ellipsis">
1. La Suspension de l'Exécution (await)
</span>
</a>
</li>
<li class="md-nav__item">
<a href="#2-le-mode-decriture-appendfile-vs-writefile" class="md-nav__link">
<span class="md-ellipsis">
2. Le Mode d'Écriture (appendFile vs writeFile)
</span>
</a>
</li>
<li class="md-nav__item">
<a href="#3-literation-la-boucle" class="md-nav__link">
<span class="md-ellipsis">
3. L'Itération (La boucle)
</span>
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="#en-resume-technique" class="md-nav__link">
<span class="md-ellipsis">
📝 En Résumé Technique
</span>
</a>
</li>
</ul>
@ -1055,59 +955,6 @@
<li><strong>La Promise</strong> : On te promet un résultat dans <code>stats</code></li>
<li><code>**await**</code> : Tant que l'on a pas de résultat, on "fige" à cette ligne jusqu'à ce que la promesse est reçue.</li>
</ul>
<h2 id="manipulation-de-fichiers">Manipulation de fichiers</h2>
<p>Pour manipuler des fichiers avec Node.JS, il existe un module appelé <em>Node.JS fs</em>, fs pour fiché S. Avec cette librairie on peut manipuler de plusieurs manière nos fichiers, les lire, écrire ou réécrire, demander les infos d'un fichier, copier et pleinnn de choses encore !</p>
<p><strong>Ici on se concentrera sur les fonctions qu'on utilise dans le TP 2 de JS</strong></p>
<p>Avant tout, pour utiliser ce module, il faut l'appeler via une constante :
<div class="highlight"><pre><span></span><code><span class="kd">const</span><span class="w"> </span><span class="nx">fs</span><span class="w"> </span><span class="o">=</span><span class="w"> </span><span class="nx">require</span><span class="p">(</span><span class="s1">&#39;fs&#39;</span><span class="p">).</span><span class="nx">promises</span><span class="p">;</span><span class="w"> </span><span class="c1">// fs prendra l&#39;appel du module en utilisant les promesses de tout à l&#39;heure</span>
</code></pre></div></p>
<h2 id="lecture-de-fichiers-fsreadfile">Lecture de fichiers (<em>fs.readFile</em>)</h2>
<p>Pour lire des fichiers, on utilise la fonction <code>fs.readFile</code>. Lorsque cette commande est exécutée, le moteur JavaScript ne lit pas le fichier lui-même. Il envoie une requête au système d'exploitation (l'OS) pour qu'il s'en charge.</p>
<ul>
<li><strong>Concrètement :</strong> Le programme libère immédiatement la main. Il ne reste pas bloqué sur cette ligne et continue d'exécuter le code qui suit.</li>
</ul>
<h3 id="2-la-resolution-le-callback">2. La Résolution (Le Callback)</h3>
<p>Une fois que le système d'exploitation a fini de lire le fichier, il notifie le programme. La Promesse change d'état et déclenche l'une des deux fonctions suivantes :</p>
<ul>
<li>
<p><strong>Le Succès (<code>.then</code>)</strong> :
Déclenché si l'opération a réussi. Le système injecte les données lues (le contenu du fichier) dans la fonction définie ici. C'est ici que le traitement des données commence.</p>
</li>
<li>
<p><strong>L'Erreur (<code>.catch</code>)</strong> :
Déclenché si l'opération a échoué (fichier introuvable, permissions refusées). Le système injecte un objet <code>Error</code> contenant les détails du problème. Cela permet de capturer l'exception sans faire planter l'application.</p>
</li>
</ul>
<hr />
<h2 id="partie-2-le-traitement-sequentiel-le-modele-asyncawait">PARTIE 2 : Le Traitement Séquentiel (Le modèle <code>async/await</code>)</h2>
<p>Parfois, l'asynchronisme pur est difficile à gérer (besoin d'ordre précis). La syntaxe <code>async/await</code> permet de forcer un comportement séquentiel au sein d'une fonction asynchrone.</p>
<h3 id="1-la-suspension-de-lexecution-await">1. La Suspension de l'Exécution (<code>await</code>)</h3>
<p>Le mot-clé <code>await</code> placé devant une Promesse (comme <code>fs.readFile</code>) modifie le flux d'exécution.
* <strong>Concrètement :</strong> L'interpréteur met en <strong>pause</strong> uniquement l'exécution de la fonction actuelle. Il attend que la Promesse soit résolue (terminée) avant de passer à la ligne suivante.
* <strong>L'encodage (<code>utf8</code>)</strong> : Spécifie au système de convertir directement le flux binaire (Buffer) en chaîne de caractères lisible (String) avant de renvoyer le résultat.</p>
<h3 id="2-le-mode-decriture-appendfile-vs-writefile">2. Le Mode d'Écriture (<code>appendFile</code> vs <code>writeFile</code>)</h3>
<p>Lorsqu'il s'agit d'écrire des données sur le disque, le choix de la méthode détermine comment le fichier est manipulé au niveau basique :</p>
<ul>
<li>
<p><strong><code>fs.writeFile</code> (Écrasement)</strong> :
Cette méthode ouvre le fichier et place le curseur au tout début (index 0). Si le fichier contient déjà des données, elles sont <strong>tronquées</strong> (supprimées) et remplacées par le nouveau contenu.</p>
</li>
<li>
<p><strong><code>fs.appendFile</code> (Ajout)</strong> :
Cette méthode ouvre le fichier et place le curseur directement à la <strong>fin</strong> du fichier (EOF - End Of File). Les nouvelles données sont écrites à la suite des existantes, préservant ainsi l'historique.</p>
</li>
</ul>
<h3 id="3-literation-la-boucle">3. L'Itération (La boucle)</h3>
<p>Dans un contexte <code>async/await</code>, une boucle permet de traiter une liste d'éléments un par un.
* <strong>Concrètement :</strong> Le système traite le premier fichier, attend la fin complète de l'opération (lecture + écriture), et seulement ensuite passe à l'itération suivante. Cela garantit l'ordre des opérations.</p>
<hr />
<h2 id="en-resume-technique">📝 En Résumé Technique</h2>
<ol>
<li><strong>I/O Asynchrone</strong> : Permet de déléguer les opérations lentes (disque, réseau) au système pour ne pas bloquer le processeur.</li>
<li><strong>Promise</strong> : Objet représentant l'état futur d'une opération (En attente -&gt; Résolu ou Rejeté).</li>
<li><strong>Flux Séquentiel (<code>await</code>)</strong> : Force le code à attendre la résolution d'une promesse avant de continuer, simulant un code synchrone pour plus de lisibilité et de contrôle.</li>
<li><strong>Gestion d'erreur</strong> : Indispensable pour intercepter les exceptions systèmes (I/O) et éviter l'arrêt brutal du processus node.</li>
</ol>

949
site/learn/javascript/2026-02-09/index.html Normal file
View File

File diff suppressed because one or more lines are too long

11
site/learn/javascript/index.html
View File

@ -23,7 +23,7 @@
<title>Javascript en gros - Les incroyables notes de ramzouille</title>
<title>Javascript en gros - Les incroyables notes de devops</title>
@ -162,7 +162,7 @@
<header class="md-header md-header--shadow" data-md-component="header">
<nav class="md-header__inner md-grid" aria-label="Header">
<a href="../.." title="Les incroyables notes de ramzouille" class="md-header__button md-logo" aria-label="Les incroyables notes de ramzouille" data-md-component="logo">
<a href="../.." title="Les incroyables notes de devops" class="md-header__button md-logo" aria-label="Les incroyables notes de devops" data-md-component="logo">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="lucide lucide-book-open" viewBox="0 0 24 24"><path d="M12 7v14M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z"/></svg>
@ -176,7 +176,7 @@
<div class="md-header__ellipsis">
<div class="md-header__topic">
<span class="md-ellipsis">
Les incroyables notes de ramzouille
Les incroyables notes de devops
</span>
</div>
<div class="md-header__topic" data-md-component="header-topic">
@ -281,13 +281,13 @@
<nav class="md-nav md-nav--primary" aria-label="Navigation" data-md-level="0">
<label class="md-nav__title" for="__drawer">
<a href="../.." title="Les incroyables notes de ramzouille" class="md-nav__button md-logo" aria-label="Les incroyables notes de ramzouille" data-md-component="logo">
<a href="../.." title="Les incroyables notes de devops" class="md-nav__button md-logo" aria-label="Les incroyables notes de devops" data-md-component="logo">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="lucide lucide-book-open" viewBox="0 0 24 24"><path d="M12 7v14M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z"/></svg>
</a>
Les incroyables notes de ramzouille
Les incroyables notes de devops
</label>
<div class="md-nav__source">
@ -866,6 +866,7 @@
<ul>
<li><a href="../javascript/2026-01-30/">Cours 1 : </a></li>
<li><a href="../javascript/2026-02-06/">Cours 2 : Asynchrone et Manip de fichiers</a></li>
<li><a href="../javascript/2026-02-09/">Cours 3 : fetch des APIs et serveur HTTP</a></li>
</ul>

10
site/links/index.html
View File

@ -21,7 +21,7 @@
<title>Liens cools de ma poche - Les incroyables notes de ramzouille</title>
<title>Liens cools de ma poche - Les incroyables notes de devops</title>
@ -160,7 +160,7 @@
<header class="md-header md-header--shadow" data-md-component="header">
<nav class="md-header__inner md-grid" aria-label="Header">
<a href=".." title="Les incroyables notes de ramzouille" class="md-header__button md-logo" aria-label="Les incroyables notes de ramzouille" data-md-component="logo">
<a href=".." title="Les incroyables notes de devops" class="md-header__button md-logo" aria-label="Les incroyables notes de devops" data-md-component="logo">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="lucide lucide-book-open" viewBox="0 0 24 24"><path d="M12 7v14M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z"/></svg>
@ -174,7 +174,7 @@
<div class="md-header__ellipsis">
<div class="md-header__topic">
<span class="md-ellipsis">
Les incroyables notes de ramzouille
Les incroyables notes de devops
</span>
</div>
<div class="md-header__topic" data-md-component="header-topic">
@ -279,13 +279,13 @@
<nav class="md-nav md-nav--primary" aria-label="Navigation" data-md-level="0">
<label class="md-nav__title" for="__drawer">
<a href=".." title="Les incroyables notes de ramzouille" class="md-nav__button md-logo" aria-label="Les incroyables notes de ramzouille" data-md-component="logo">
<a href=".." title="Les incroyables notes de devops" class="md-nav__button md-logo" aria-label="Les incroyables notes de devops" data-md-component="logo">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="lucide lucide-book-open" viewBox="0 0 24 24"><path d="M12 7v14M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z"/></svg>
</a>
Les incroyables notes de ramzouille
Les incroyables notes de devops
</label>
<div class="md-nav__source">

10
site/projects/2025-12-05/index.html
View File

@ -23,7 +23,7 @@
<title>Grabber pt.1 (05/12/25) - Les incroyables notes de ramzouille</title>
<title>Grabber pt.1 (05/12/25) - Les incroyables notes de devops</title>
@ -162,7 +162,7 @@
<header class="md-header md-header--shadow" data-md-component="header">
<nav class="md-header__inner md-grid" aria-label="Header">
<a href="../.." title="Les incroyables notes de ramzouille" class="md-header__button md-logo" aria-label="Les incroyables notes de ramzouille" data-md-component="logo">
<a href="../.." title="Les incroyables notes de devops" class="md-header__button md-logo" aria-label="Les incroyables notes de devops" data-md-component="logo">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="lucide lucide-book-open" viewBox="0 0 24 24"><path d="M12 7v14M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z"/></svg>
@ -176,7 +176,7 @@
<div class="md-header__ellipsis">
<div class="md-header__topic">
<span class="md-ellipsis">
Les incroyables notes de ramzouille
Les incroyables notes de devops
</span>
</div>
<div class="md-header__topic" data-md-component="header-topic">
@ -281,13 +281,13 @@
<nav class="md-nav md-nav--primary" aria-label="Navigation" data-md-level="0">
<label class="md-nav__title" for="__drawer">
<a href="../.." title="Les incroyables notes de ramzouille" class="md-nav__button md-logo" aria-label="Les incroyables notes de ramzouille" data-md-component="logo">
<a href="../.." title="Les incroyables notes de devops" class="md-nav__button md-logo" aria-label="Les incroyables notes de devops" data-md-component="logo">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="lucide lucide-book-open" viewBox="0 0 24 24"><path d="M12 7v14M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z"/></svg>
</a>
Les incroyables notes de ramzouille
Les incroyables notes de devops
</label>
<div class="md-nav__source">

10
site/projects/2026-01-23/index.html
View File

@ -23,7 +23,7 @@
<title>Site de notes avec Zensical (23/01/26) - Les incroyables notes de ramzouille</title>
<title>Site de notes avec Zensical (23/01/26) - Les incroyables notes de devops</title>
@ -162,7 +162,7 @@
<header class="md-header md-header--shadow" data-md-component="header">
<nav class="md-header__inner md-grid" aria-label="Header">
<a href="../.." title="Les incroyables notes de ramzouille" class="md-header__button md-logo" aria-label="Les incroyables notes de ramzouille" data-md-component="logo">
<a href="../.." title="Les incroyables notes de devops" class="md-header__button md-logo" aria-label="Les incroyables notes de devops" data-md-component="logo">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="lucide lucide-book-open" viewBox="0 0 24 24"><path d="M12 7v14M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z"/></svg>
@ -176,7 +176,7 @@
<div class="md-header__ellipsis">
<div class="md-header__topic">
<span class="md-ellipsis">
Les incroyables notes de ramzouille
Les incroyables notes de devops
</span>
</div>
<div class="md-header__topic" data-md-component="header-topic">
@ -281,13 +281,13 @@
<nav class="md-nav md-nav--primary" aria-label="Navigation" data-md-level="0">
<label class="md-nav__title" for="__drawer">
<a href="../.." title="Les incroyables notes de ramzouille" class="md-nav__button md-logo" aria-label="Les incroyables notes de ramzouille" data-md-component="logo">
<a href="../.." title="Les incroyables notes de devops" class="md-nav__button md-logo" aria-label="Les incroyables notes de devops" data-md-component="logo">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="lucide lucide-book-open" viewBox="0 0 24 24"><path d="M12 7v14M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z"/></svg>
</a>
Les incroyables notes de ramzouille
Les incroyables notes de devops
</label>
<div class="md-nav__source">

2
site/search.json
View File

File diff suppressed because one or more lines are too long