je note mon parcours et mes projets en SysAdmin
","path":["Bienvenue dans mes notes de devops"],"tags":[]},{"location":"#sommaire","level":2,"title":"Sommaire","text":"-> Notes notes de cours, apprentissages en dehors, un peu de tout
-> Projets notes sur mes projets de cours/personnels, note de mes experiences
","path":["Bienvenue dans mes notes de devops"],"tags":[]},{"location":"links/","level":1,"title":"Liens cools de ma poche","text":"","path":["Liens cools de ma poche"],"tags":[]},{"location":"links/#design","level":2,"title":"đš Design","text":"","path":["Liens cools de ma poche"],"tags":[]},{"location":"links/#developpement","level":2,"title":"đœ Developpement","text":"","path":["Liens cools de ma poche"],"tags":[]},{"location":"learn/devops/2025-11-28/","level":1,"title":"Automatisation via les associations","text":"| (le pipe) -> prend le rĂ©sultat de la commande de gauche et le donne Ă celle de droite
exemple : liste tout un répertoire, mais n'affiche que les résultats qui sont \"feur\"
ls -la | grep \"feur\"\n> et >>
> Ă©crase le fichier / >> ajoute Ă la fin sans effacerecho \"coucou\" > fichier.txtgit clone (url du projet git)git init (dossier de travail)echo gbvenv/ >> .gitignore <- on indique via un echo qui Ă©crira dans le fichier .gitignore qu'on ne veut pas push le dossier \"gbvenv\" ici, un fichier on ne mettera pas le slash (logique en amont)
Pour envoyer un projet git, c'est comme envoyer un colis Ă la poste, d'abord, on met nos affaires dans le colis
Plusieures possibilitĂ©s âïž
Ajoute TOUS les fichiers du dossier via l'option -A ou --all -> git add -A
Ajoute SEULEMENT les modifications et suppressions (donc pas de nouveaux fichiers) -> git add -u
Ensuite, on rempli l'Ă©tiquette du colis et on la colle au colis
git commit -m \"(message du commit)\"Enfin pour push, c'est a dire déposer le colis au bureau de poste pour l'envoi, on fait :
git push -u origin (branche souhaitée)Info
-u veut dire ce que dit la doc en gros
","path":["Notes","đ DevOps","Git pour les neuilles"],"tags":["Git","Bash","Devops"]},{"location":"learn/devops/2025-12-12/#-si-erreur","level":3,"title":"-> SI ERREUR","text":"Dans le cas ou un fichier/dossier a Ă©tĂ© supprimĂ© autre part avant de push nos modifs
git config pull.rebase falseDans le cas ou l'on veut travailler avec une seconde branche
Pour switch de branche de travail -> git checkout (branche souhaitée)
Pour merge en ecrasant la branche souhaitĂ©e âŹïž
git merge -s ours main\ngit checkout main\ngit merge (branche à merge)\nLe modÚle MVC est une façon de concevoir un projet logiciel, en gros on sépare celui-ci en trois grandes parties distinctes séparant la logique de la vue et rend le travail plus facile.
ModĂšle MVC en prenant celui de grabber par exemple :
- Model = Base De Donnée (ex: EMPLOYEES, COMPUTERS)\n- View = Tableau de bord, Site\n- Controller = Cerveau qui dirige les deux parties Model et View (ex: app.py)\ncelle de grabber pour l'exemple
BDD (Etape 1) - grabberman\nâââ TABLES (Etape 2) - COMPUTERS\nâ âââ Colonne (Etape 3) - PcId, entier/clĂ© primaire\nâ â âââ DonnĂ©e (Etape 4)\nâ âââ Colonne (Etape 3) - Hostname, chaĂźne de charactĂšre\nâ âââ Colonne (Etape 3) - MacAddress, chaĂźne de charactĂšre\nâââ TABLES (Etape 2) - EMPLOYEES\n âââ Colonne (Etape 3) - UserId, entier/clĂ© primaire\n âââ Colonne (Etape 3) - Username, chaĂźne de charactĂšre\n âââ Colonne (Etape 3) - PcId, clĂ© secondaire\nsqlite3 grabberman.db <- Commande qui crĂ©e une DB qu'on appellera ici \"grabberman\"
CREATE TABLE \"COMPUTERS\" \n(\n PcId INTEGER PRIMARY KEY AUTOINCREMENT, \n Hostname VARCHAR(50) NOT NULL, \n MacAddress VARCHAR(50)\n);\nNote
Ici on crée une table dans laquelle on stockera des données (des PC que l'on grab par exemple)
","path":["Notes","đ DevOps","SQL pour les tung tung tung sahur"],"tags":["SQL","Devops"]},{"location":"learn/devops/2026-01-22/#etape-3-ajouter-des-donnees-dans-une-table","level":3,"title":"Etape 3 : Ajouter des donnĂ©es dans une table","text":"INSERT into COMPUTERS (Hostname, MacAddress) VALUES ('mypc', '1B:12:F0:FL:94');
Note
Pour ajouter une donnée dans une tableau, on INSERE dans le TABLEAU donné les VALEURS dans les Colonnes
","path":["Notes","đ DevOps","SQL pour les tung tung tung sahur"],"tags":["SQL","Devops"]},{"location":"learn/devops/2026-01-22/#etape-4-creer-un-autre-tableau-avec-une-cle-liee-foreign-key","level":3,"title":"Etape 4 : CrĂ©er un autre tableau avec une clĂ© liĂ©e (foreign key)","text":"CREATE TABLE \"EMPLOYEES\" \n(\n UserId INTEGER PRIMARY KEY AUTOINCREMENT, \n Username VARCHAR(50) NOT NULL, \n FOREIGN KEY (PcId) REFERENCES COMPUTERS(PcId)\n);\nNote
On recommence comme à l'étape 2, en ajoutant une clé étrangÚre foreign key, qui lie une clé extérieure, PcId ici, dans notre second Tableau
","path":["Notes","đ DevOps","SQL pour les tung tung tung sahur"],"tags":["SQL","Devops"]},{"location":"learn/devops/2026-03-04/","level":1,"title":"C'est quoi DevOps ?","text":"","path":["Notes","đ DevOps","C'est quoi DevOps ?"],"tags":["MĂ©tier","Domaine","Informatique"]},{"location":"learn/frontend/2026-02-21/","level":1,"title":"Cheat Sheet Tailwind","text":"Tailwind utilise des classes utilitaires. La logique est souvent [PropriĂ©tĂ©]-[Taille/Couleur/Valeur].
La syntaxe : [Type][Direction]-[Taille].
Type : m (Margin / Extérieur) ou p (Padding / Intérieur).
Direction : t (Haut), b (Bas), l (Gauche), r (Droite), x (Horizontal), y (Vertical), ou rien (Partout).
Taille : Ăchelle basĂ©e sur des multiples de 4px (ex: 1 = 4px, 2 = 8px, 4 = 16px).
p-4 padding: 16px; Espace Ă l'intĂ©rieur partout. px-6 padding-left: 24px; padding-right: 24px; Espace Ă l'intĂ©rieur, Ă gauche et Ă droite. mt-2 margin-top: 8px; Espace Ă l'extĂ©rieur, vers le haut. mx-auto margin: 0 auto; Centre un bloc horizontalement.","path":["Notes","đš Frontend","Cheat Sheet Tailwind"],"tags":[]},{"location":"learn/frontend/2026-02-21/#2-dimensions-width-height","level":2,"title":"2. Dimensions (Width & Height)","text":"La syntaxe : w-[Taille] (Largeur) et h-[Taille] (Hauteur).
w-full width: 100%; Prend toute la largeur disponible. w-1/2 width: 50%; Prend la moitiĂ© de la largeur. w-screen width: 100vw; Prend la largeur totale de l'Ă©cran. h-screen height: 100vh; Prend la hauteur totale de l'Ă©cran. w-16 width: 64px; Ăchelle numĂ©rique classique (16 * 4px).","path":["Notes","đš Frontend","Cheat Sheet Tailwind"],"tags":[]},{"location":"learn/frontend/2026-02-21/#3-couleurs","level":2,"title":"3. Couleurs","text":"La syntaxe : [Cible]-[Couleur]-[IntensitĂ©].
L'intensité va de 50 (trÚs clair) à 950 (trÚs foncé).
text-blue-500, text-white La couleur de la police. Fond bg-red-600, bg-gray-900 La couleur d'arriĂšre-plan. Bordure border-green-400 La couleur de la bordure.","path":["Notes","đš Frontend","Cheat Sheet Tailwind"],"tags":[]},{"location":"learn/frontend/2026-02-21/#4-typographie","level":2,"title":"4. Typographie","text":"GĂ©rez la taille, la graisse et l'alignement.
CatĂ©gorie Classes utiles Explication Tailletext-xs, text-sm, text-base, text-lg, text-xl Du plus petit au plus grand. Graisse font-light, font-normal, font-semibold, font-bold L'Ă©paisseur des lettres. Alignement text-left, text-center, text-right L'alignement du texte.","path":["Notes","đš Frontend","Cheat Sheet Tailwind"],"tags":[]},{"location":"learn/frontend/2026-02-21/#5-flexbox-mise-en-page","level":2,"title":"5. Flexbox (Mise en page)","text":"DĂ©clarez flex pour commencer Ă aligner vos Ă©lĂ©ments.
flex display: flex; Aligne les enfants en ligne (cĂŽte Ă cĂŽte). flex-col flex-direction: column; Aligne les enfants en colonne. justify-center justify-content: center; Centre sur l'axe principal. justify-between justify-content: space-between; Ăcarte les Ă©lĂ©ments aux extrĂ©mitĂ©s. items-center align-items: center; Centre sur l'axe secondaire (souvent verticalement). gap-4 gap: 16px; Ajoute 16px d'espace entre chaque enfant.","path":["Notes","đš Frontend","Cheat Sheet Tailwind"],"tags":[]},{"location":"learn/frontend/2026-02-21/#6-bordures-et-arrondis-border-rounded","level":2,"title":"6. Bordures et Arrondis (Border & Rounded)","text":"Il faut toujours spĂ©cifier une Ă©paisseur pour voir la bordure.
Classe Ăquivalent CSS Explicationborder border-width: 1px; Ajoute une bordure de 1px partout. border-t border-top-width: 1px; Bordure uniquement en haut. rounded border-radius: 4px; Arrondit lĂ©gĂšrement les angles. rounded-md border-radius: 6px; Arrondi moyen (idĂ©al pour boutons). rounded-full border-radius: 9999px; Fait un cercle parfait ou une pilule.","path":["Notes","đš Frontend","Cheat Sheet Tailwind"],"tags":[]},{"location":"learn/frontend/2026-02-21/#7-etats-et-responsif-prefixes","level":2,"title":"7. Ătats et Responsif (PrĂ©fixes)","text":"PrĂ©fixez n'importe quelle classe avec un Ă©tat ou une taille d'Ă©cran.
hover:bg-blue-600focus:border-blue-500w-full (100% sur mobile par défaut)md:w-1/2 (50% sur tablette)lg:w-1/3 (33% sur grand écran)Info
Pour le TP, on a besoin de manipuler des fichiers. Mais avant d'utiliser le module file system dit \"fs\" (qui s'occupe de ce besoin), il faut comprendre un fonctionnement de base en informatique, essentielle aux modules faisant des requĂȘtes a des systemes externes comme fs, l'asynchrone.
","path":["Notes","â Javascript","Asynchrone et promesses (06/02/26)"],"tags":["JavaScript","Node.JS"]},{"location":"learn/javascript/2026-02-06/#cest-quoi-asynchrone","level":2,"title":"C'est quoi Asynchrone ?","text":"Asynchrone permet de ne pas bloquer le code mĂȘme si il n'a pas de rĂ©sultat mais avec promesse, il laisse le code continuer pour trouver une rĂ©ponse et la rapporter comme promis.
Rien de mieux qu'un exemple concret et gourmand en amont et en aval.
","path":["Notes","â Javascript","Asynchrone et promesses (06/02/26)"],"tags":["JavaScript","Node.JS"]},{"location":"learn/javascript/2026-02-06/#1-sans-asynchrone","level":3,"title":"1. SANS Asynchrone","text":"RĂ©sultat : La file d'attente sort du restaurant. Si la cuisson prend 10 minutes, tout le restaurant est bloquĂ© pendant 10 minutes. Bien guez.
","path":["Notes","â Javascript","Asynchrone et promesses (06/02/26)"],"tags":["JavaScript","Node.JS"]},{"location":"learn/javascript/2026-02-06/#2-avec-asynchrone","level":3,"title":"2. AVEC Asynchrone","text":"Note
âïžđ€ Node.js fonctionne sur un principe de thread unique (monothread)... En gros, il ne peut effectuer qu'une seule tĂąche Ă la fois.
Alors pour éviter de bloquer le programme pendant de longues opérations (comme lire des données au fin fond du disque dur), il délÚgue ces tùches a l'ordinateur et utilise un mécanisme de Promesses.
Dans notre exemple, la Promise, c'est le bipeur.
Ce boßtier est une promesse. Le restaurant te dit : \"Je n'ai pas ton crousty tout de suite, mais je te promets que je te préviendrai dÚs qu'il y a du nouveau.\"
Une Promise a toujours 3 Ă©tats possibles, et seulement 3 :
files.forEach((fileName) => {\n fs.readFile(fileName, 'utf8').then((content) => {\n ...\n })\n});\nfs.readFile : Envoie le job de lire un fichier à l'ordinateur avec des parametres et quand c'est pret, enrengistre son résultat dans content.contentOn peut également demander spécifiquement d'attendre le retour d'une promesse avec await
const stats = await fs.stat(filename);\nfs.stat : Envoie le job de récupérer les stats d'un fichier à l'ordinateur et quand c'est pret, enrengistre son résultat dans stats.stats**await** : Tant que l'on a pas de résultat, on \"fige\" à cette ligne jusqu'à ce que la promesse est reçue.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)","text":"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()
","path":["Notes","â Javascript","fetch des APIs et serveur HTTP (09/02/26)"],"tags":["JavaScript","Node.JS"]},{"location":"learn/javascript/2026-02-09/#json-le-traducteur","level":3,"title":"json() (Le traducteur)","text":"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.
Dans une fonction async fetchCityInfo(), on essayera de fetch via cette fonction :
// Attend de fetch les données d'une ville donnée par l'utilisateur via la variable cityName\nconst geoRes = await fetch(`https://geoservice.cnam.fr/api/cities?name=${encodeURIComponent(cityName)}`);\nPuis on encode les données brutes reçues dans un joli tableau JSON :
// La constante cities récupÚre le résultat geoRes et le range en JSON\nconst cities = await geoRes.json();\nPlus tard, on refait un fetch de données avec une clé API pour openweathermap (cas concret en gros) :
//Comme tout à l'heure, on fetch les données de l'API et on attend la réponse via await\nconst weatherRes = await fetch(`http://api.weatherapi.com/v1/current.json?q=${encodeURIComponent(cityName)}&key=****`);\nBravo, tu as fait un appel d'API et l'a rangé dans un beau tableau JSON.
","path":["Notes","â Javascript","fetch des APIs et serveur HTTP (09/02/26)"],"tags":["JavaScript","Node.JS"]},{"location":"learn/javascript/2026-02-09/#serveur-http","level":2,"title":"Serveur HTTP","text":"","path":["Notes","â Javascript","fetch des APIs et serveur HTTP (09/02/26)"],"tags":["JavaScript","Node.JS"]},{"location":"learn/python/2026-01-16/","level":1,"title":"pip et environnements virtuels","text":"","path":["Notes","đ Python","pip et environnements virtuels"],"tags":["Python","pip","Environnements Virtuels"]},{"location":"learn/python/2026-01-16/#python-et-ses-environnements-virtuels","level":2,"title":"Python et ses environnements virtuels","text":"Utile de crĂ©er donc un environnement pour chaque projet afin de en pas perturber d'autres projets avec des milliers de packages inutiles en gros
python3 -m venv gbvenv <- permet de créer un environnement (venv crée l'environnement \"gbvenv\")
source gbvenv/bin/activate <- lance cet environnement pour travailler dedans
pip est le packages manager de python, en l'appelant, on peut installer des packages comme uvicorn par exemple, utile pour grabber
pip install --upgrade pip <- update les packages
python -m pip install *** <- installe le package qu'on notera a la place des ***
pip freeze >> requirements.txt <- commande super utile pour partager les dependances necessaires pour faire fonctionner son projet sur un autre environnement
deactivate <- désactive l'environnement virtuel
bash <(curl -fsSL https://raw.githubusercontent.com/buchtioof/venv-setup/main/venvsetup.sh)
Pour en apprendre plus : le git du projet
","path":["Notes","đ Python","pip et environnements virtuels"],"tags":["Python","pip","Environnements Virtuels"]},{"location":"learn/python/2026-02-16/","level":1,"title":"Django en gros","text":"","path":["Notes","đ Python","Django en gros"],"tags":[]},{"location":"learn/python/2026-02-16/#commencer-un-projet-django","level":2,"title":"Commencer un projet Django","text":"Pour commencer un projet Django, c'est super simple :
-> D'abord, créer un dossier de projet
`mkdir projet`\n-> Ensuite créer un environnement virtuel Python puis installer Django via pip
`python3 -m venv \"projetvenv\" && source projetvenv/bin/activate && pip install django`\n-> Maintenant, créer le projet Django dans ce dossier (le point à la fin indique que l'on crée dans ce dossier le projet)
`django-admin startproject config .`\n-> On peut maintenant travailler dans notre projet Django
","path":["Notes","đ Python","Django en gros"],"tags":[]},{"location":"learn/python/2026-02-16/#projet-et-applications","level":2,"title":"Projet et applications","text":"Django fonctionne sur l'utilisations de petits modules appelĂ©s \"Applications\", ceux-ci composent un projet Django. Elles peuvent ĂȘtre des composants gĂšrant une API qui prend des donnĂ©es JSON pour les mettre dans une BDD SQL comme dans le projet Grabber ou encore plein d'autres cas...
Note
En gros, on a un projet (dossier \"config\") dans lequel on gÚre les réglages généraux de Django (serveur, adresses, ect...) et des applications (dans leurs dossiers propres) qui gÚrent leurs tùches propres à elles
Pour créer une Application on utilise cette commande -> python manage.py startapp nomdel'app
Une application se divise avec un fonctionnement en 3 parties
ModĂšle <--> Vue -> Template
","path":["Notes","đ Python","Django en gros"],"tags":[]},{"location":"learn/python/2026-02-16/#modele","level":3,"title":"ModĂšle","text":"Le ModĂšle sera la partie manipulation d'objets (comme en PhP), dans le projet Grabber, Django s'occupera de crĂ©er la DB sql via ce module
Warning
Quand on travaille sur le fichier models.py (généralement celui qui s'occupe de ce module) on doit utiliser deux commandes qui construisent le modÚle
python manage.py makemigrations\npython manage.py migrate\nLa Vue ici, c'est un peu le cerveau du projet, il reçoit les requĂȘtes (par exemple, l'utilisateur qui demande une URL ou alors un fichier bash qui envoie des donnĂ©es comme avec Grabber) et peut renvoyer ces requĂȘtes au ModĂšle pour avoir un rĂ©sultat, etc...
","path":["Notes","đ Python","Django en gros"],"tags":[]},{"location":"learn/python/2026-02-16/#template","level":3,"title":"Template","text":"Le template, c'est l'interface, par exemple des fichiers HTML. Il reçoit les donnĂ©es brutes de la Vue et les affiche proprement dans une jolie page web.
Utiliser les données brutes dans une template
Pour se faire, on doit utiliser cette balise {{ ... }} dans le HTML, cela veut dire pour Django que l'on récupÚre les données d'une clé spécifique
<!-- Dans les crochets, on appelle la donnée \"hostname\" de la table \"data\"-->\n<title>{{ data.hostname }} - Grabber</title>\nUn autre composant trÚs important dans Django, c'est les URLs. C'est un fichier dans lequel on doit router ce que telle url dans le navigateur doit effectuer.
Par exemple
Appeler la racine (localhost:5000/) doit ĂȘtre routĂ© comme ceci :
from django.urls import path\nfrom api import views\n\nurlpatterns = [\n # Route de la racine qui appelle la fonction computers_list\n path('', views.computers_list, name='computers'),\n]\nSSH est un protocole de communication (comme FTP, HTTP, ect...) qui se base dans le terminal. Il permet de contrÎler une fenetre de commandes d'un ordinateur à distance. Si SSH est activé sur un PC, un utilisateur connaissant les logins du PC distant pourra ouvrir un terminal à distance directement sur son ordinateur.
Pour plus de sécurité, il est préférable d'utiliser un systÚme de clés publiques/privées pour ne pas envoyer ces identifiants dans la nature en clair.
On va voir comment configurer une connexion SSH proprement entre deux PC.
","path":["Notes","𧰠SysAdmin","SSH et Configuration propre"],"tags":["SSH","Unix"]},{"location":"learn/sysadmin/2026-02-25/#etape-1-creer-une-cle-sur-le-pc-hote","level":2,"title":"Ătape 1 : CrĂ©er une clĂ© sur le PC HĂŽte","text":"On crĂ©e d'abord notre clĂ© SSH pour authentifier notre ordinateur via cette commande :
ssh-keygen -t ed25519 -C \"nom_de_votre_pc\"
En résumé, on utilise la commande ssh-keygen, préinstallée sur les distros UNIX et macOS, qui crée des clé et on lui demande une clé encryptée avec le protocole ed25519 via -t, recommandé car efficace et robuste, puis on donne le nom du PC qu'on authentifie avec -C.
On nous demandera alors dans quel répertoire stocker la clé, généralement il vous proposera dans votre répertoire home /.ssh/id_ed25519 et aussi si l'on veut protéger la clé avec un mot de passe.
Répertoire de la clé
La clĂ© donc sera stockĂ©e dans le rĂ©pertoire .ssh/id_ed25519 comme dit plus tĂŽt. Dans ce mĂȘme rĂ©pertoire, on y retrouvera deux fichiers :
Maintenant que l'on a notre clé, on doit la partager au PC distant, pour se faire, on devra une derniÚre fois utiliser les identifiants de l'utilisateur du PC distant via la commande :
ssh-copy-id utilisateur@adresse_ip_du_pc_distant
On nous demandera alors le mot de passe de l'utilisateur distant et enfin l'action sera effectuée, notre PC hÎte est maintenant authentifié par le PC distant !
La commande ici à tout simplement copié notre clé publique crée plus tÎt id_ed25519.pub avec la commande ssh-copy-id et l'a rangée dans un registre de clés dans le fichier rangé dans le répertoire .ssh/authorized_keys.
","path":["Notes","𧰠SysAdmin","SSH et Configuration propre"],"tags":["SSH","Unix"]},{"location":"learn/sysadmin/2026-02-25/#etape-3-essayer-cette-configuration","level":2,"title":"Ătape 3 : Essayer cette configuration","text":"Pour tester si tout fonctionne, il faut tout simplement lancer une connexion SSH avec la commande :
ssh utilisateur@adresse_ip_du_pc_distant
Si aucun mot de passe n'a été demandé, c'est que le PC distant nous à bien reconnu, c'est carré dans l'axe !
","path":["Notes","𧰠SysAdmin","SSH et Configuration propre"],"tags":["SSH","Unix"]},{"location":"learn/sysadmin/2026-02-25/#optionnel-mais-recommande-desactiver-les-identifiants-utilisateur","level":2,"title":"Optionnel mais recommandé : Désactiver les identifiants utilisateur","text":"Pour sécuriser le PC distant d'intrusions avec les identifiants qui auraient pu fuiter, on peut désactiver l'authentification via les identifiants utilisateur en éditant le fichier de configuration du SSH avec cette commande sur le PC distant :
sudo nano /etc/ssh/sshd_config
Dans ce fichier, une ligne nous interesse, celle-ci :
# PasswordAuthentication no
On retire le # et voila, l'authentification via le mot de passe est désactivé. Plus qu'a lancer une commande qui redémarre le serveur SSH du PC :
sudo systemctl restart ssh
Et c'est tout bon, on a configuré un accÚs SSH proprement avec un PC distant.
","path":["Notes","𧰠SysAdmin","SSH et Configuration propre"],"tags":["SSH","Unix"]},{"location":"learn/sysadmin/2026-03-04/","level":1,"title":"C'est quoi un Administrateur SystÚme ?","text":"Un Admin SystÚme, SysAdmin en anglais (terme le plus courant), est le couteau suisse du systÚme informatique de l'entreprise. Il se charge de gérer toute l'infrastructure d'une entreprise en quatre grands axes :
Un bon SysAdmin ne connaĂźt pas tout, mais il maĂźtrise ces fondamentaux :
C'est un métier qui demande un tempérament particulier :
On reste rarement SysAdmin toute sa vie. Voici l'Ă©volution classique d'un technicien systĂšme :
sudo : lance une commande avec les superdroits, peut manipuler tout le pc avec en gros
sudo [commande]\nls : liste les fichiers d'un dossier
# -a pour afficher les fichiers cachés / -l pour afficher en liste avec plus d'infos\nls [options] [fichier|dir]\ncd : changer de dossier
# ~ pour aller au répertoire home / .. pour revenir en arriere\ncd [dir]\npwd : affiche le répertoire actuel
pwd\ntouch : affiche le contenu d'un fichier
touch [fichier]\nnano : Ă©diteur de texte
nano [fichier]\nmkdir : supprime ce qu'on lui donne
mkdir [options] [fichier|dir]\nrm : supprime ce qu'on lui donne
# -r pour supprimer un dossier et son contenu (recursive) (`rmdir` le fait aussi)\n# -f force la commande\nrm [options] [fichier|dir]\ncp : copie...
cp [options] [source] [destination]\nmv : ...et déplace
mv [options] [source] [destination]\nchmod [droits] [fichier] - change les permissions d'un fichier (qui peut lire/écrire/exécuter) - chmod +x [fichier] rend un script exécutable (trÚs important) - chmod 777 [fichier] donne tous les droits à tout le monde (dangereux mais ça dépanne)
chown [user]:[groupe] [fichier] - change le propriétaire du fichier (si t'as copié un truc en sudo et que tu peux plus le toucher)
cat [fichier] - affiche tout le contenu d'un fichier d'un coup dans le terminal - utile pour les petits fichiers, sinon ça inonde l'écran
less [fichier] - affiche le contenu page par page (on peut scroller) - appuyer sur q pour quitter
head [fichier] / tail [fichier] - affiche juste le début (head) ou la fin (tail) d'un fichier - tail -f [fichier] hyper utile pour voir les logs en direct (ça attend les nouvelles lignes)
grep [mot] [fichier] - cherche un mot ou une phrase spécifique dans un fichier (le ctrl+f du terminal) - -r pour chercher dans tous les dossiers (recursive) / -i pour ignorer les majuscules
Selon Wikipédia...
Linux (parfois nommé GNU/Linux) est un systÚme d'exploitation open source de type Unix, basé sur le noyau Linux créé en 1991 par Linus Torvalds. (source)
","path":["Notes","𧰠SysAdmin","đ§ Linux","C'est quoi Linux ?"],"tags":["Linux","UNIX","Sysadmin","OS"]},{"location":"learn/sysadmin/linux/2025-10-30/#la-philosophie-derriere-linux","level":2,"title":"La philosophie derriĂšre Linux","text":"Contrairement Ă Windows ou macOS qui sont des systĂšmes fermĂ©s, Linux se diffĂ©rencie par son architecture totalement ouverte (Open Source).
C'est un systÚme d'exploitation (OS) conçu pour donner une liberté totale et qui en fait sa force avec :
Souvent, quand on dit \"J'installe Linux\", c'est un abus de langage. En réalité, un systÚme d'exploitation basé sur Linux est composé de plusieurs couches :
-> Le Noyau (GNU/Linux) : C'est le cĆur de la machine, il fait le pont entre les composants \"Hardware\" (CPU, RAM) et le logiciel \"Software\".
-> L'environnement de base et les Paquets (Packages) : Le noyau seul ne suffit pas. Pour interagir avec lui, on y ajoute des couches comme les outils de base (bash, ls, cd (ce sont des mini programmes Ă eux seuls !)), Ă©galement les logiciels sous forme de packages (une sorte d'archive) et les gestionnaires de tout ce beau monde (Gestionnaire de Paquets comme APT chez debian ou DNF chez Red Hat)
-> L'Interface Graphique (Desktop Environment, DE) : Contrairement à Windows qui impose son design, sur Linux on peut choisir son interface visuelle. Que ce soit Gnome (trÚs épuré, style macOS), KDE (trÚs personnalisable, style Windows), ou Cinnamon, l'interface n'est qu'une couche graphique que l'on rajoute par-dessus.
Info
Il n'est pas forcément obligatoire d'avoir une Interface Graphique (GUI), Linux en dehors d'un usage d'utilisateur classique, fonctionne sous forme de terminal tout simplement (CLI). On retrouve cet usage sur quasiment tous les serveurs du monde !
","path":["Notes","𧰠SysAdmin","đ§ Linux","C'est quoi Linux ?"],"tags":["Linux","UNIX","Sysadmin","OS"]},{"location":"learn/sysadmin/linux/2025-10-30/#les-distributions-distros","level":2,"title":"Les Distributions (Distros)","text":"Une \"Distribution\" (ou Distro), c'est simplement un pack prĂȘt Ă l'emploi qui regroupe un noyau, une sĂ©lection de paquets logiciels et une interface graphique.
Il en existe des milliers de distros, mais elles se divisent globalement en 3 grandes familles :
1. La famille Debian (La Stabilité)
C'est le bloc dur de Linux. Les paquets ne sont pas toujours Ă la derniĂšre version, mais le systĂšme est extrĂȘmement stable et fiable.
Les distros connues basées dessus : Ubuntu, Linux Mint, Pop OS. (Idéal pour les débutants).
2. La famille Arch Linux (La Liberté et la Nouveauté)
Le systÚme est toujours à la pointe de la derniÚre nouveauté grace au systeme du \"Rolling Releases (mise à jour en continu)\", mais c'est beaucoup plus compliqué à gérer et ça peut \"casser\" si on ne sait pas ce qu'on fait.
Les distros connues basées dessus : Arch Linux, Manjaro, Steam OS (l'OS du Steam Deck).
3. La famille Red Hat (L'Entre-deux)
Un excellent compromis entre une grande stabilité pour les serveurs et des paquets relativement récents pour les utilisateurs.
Les distros connues basées dessus : Fedora, CentOS, Alma Linux.
","path":["Notes","𧰠SysAdmin","đ§ Linux","C'est quoi Linux ?"],"tags":["Linux","UNIX","Sysadmin","OS"]},{"location":"learn/sysadmin/linux/2025-10-30/#ou-utilise-t-on-linux","level":2,"title":"OĂč utilise-t-on Linux ?","text":"-> Les Serveurs : L'immense majoritĂ© du web et des infrastructures cloud (AWS, serveurs web, bases de donnĂ©es) tourne sous Linux.
-> Les Smartphones : Android est basé sur le noyau Linux
-> L'embarqué et les Supercalculateurs : Les box internet, les TV connectées, les voitures...
","path":["Notes","𧰠SysAdmin","đ§ Linux","C'est quoi Linux ?"],"tags":["Linux","UNIX","Sysadmin","OS"]},{"location":"learn/sysadmin/linux/2025-10-31/","level":1,"title":"Arborescence type sur UNIX","text":"Unix a gĂ©nĂ©ralement cette arborescence que ce soit sur n'importe quelle distro Linux Ă©galement Android pour les tĂ©lĂ©phones et mĂȘme quelques similitudes sur macOS.
/ # Racine du disque\nâââ /bin/ # Contient les commandes de base\nâââ /boot/ # Fichiers de demarrage\nâââ /dev/ # Tout ce qui est liĂ© aux pĂ©riphĂ©riques\nâââ /etc/ # Fichiers de configuration\nâââ /home/ # RĂ©pertoires utilisateurs\nâââ /lib/ # BibliothĂšques logicielles\nâââ /mnt/ # Point de montage pour les systĂšmes de fichier temporaires\nâââ /media/ # Point de montage pour les disques temporaires\nâââ /opt/ # Logiciels optionnels, la ou on installera des programmes maison\nâââ /root/ # RĂ©pertoire du user root\nâââ /var/ # Variable, contient des logs, ect...\nâââ /usr/ # Contient sensiblement la mĂȘme chose que la racine mais sans ĂȘtre utile au fonctionnement du systĂšme\nâââ /srv/ # Services hĂ©bergĂ©s sur le systĂšmes (FTP, HTTP, ect...)\nâââ /run/ # Emplacement mĂ©moire des programmes\nâââ /tmp/ # Temporaire\nGrabber part d'un besoin de gĂ©rer un petit parc informatique (dizaines d'ordinateurs) dans un espace de travail (type entreprise). On peut dĂ©ja noter certains besoins majeurs : gĂ©rer des ordinateurs Ă distance, connaitre d'un coup d'oeil leur Ă©tat (updates, hardware, software) et Ă©tablir une liste de liens entre ordinateurs et employĂ©s.
","path":["Projets","Alternavive GLSI lĂ©ger : Grabber"],"tags":["Projets","Bash","Docs"]},{"location":"projects/2025-12-05/#solution","level":3,"title":"Solution","text":"Grabber donc serait dans l'idĂ©e capable de rĂ©pondre Ă ces besoins, via une interface web administrateur consultable par la DSI d'une entreprise par exemple. Pour la gestion d'un parc informatique de petite taille/toute petite, on proposera un produit simple, lĂ©ger et plug and play. Via une simple commande de terminal et une configuration au prĂ©alable des ordinateurs cibles capable de recevoir des requĂȘtes SSH, Grabber sera capable de couvrir un maximum des besoins.
","path":["Projets","Alternavive GLSI léger : Grabber"],"tags":["Projets","Bash","Docs"]},{"location":"projects/2025-12-05/#choix-de-la-stack-technologique","level":2,"title":"Choix de la stack technologique","text":"Le projet en général se basera sur du Bash et du Python pour gérer l'API et le panel Admin.
","path":["Projets","Alternavive GLSI léger : Grabber"],"tags":["Projets","Bash","Docs"]},{"location":"projects/2025-12-05/#-bash","level":3,"title":"-> Bash","text":"Les scripts Bash se contenteront de \"fetch\" les données systÚme (via des commandes comme lscpu ou la librairie inxi). Ils auront aussi le rÎle d'empaqueter ces données en format JSON (via jq) à un serveur qui les enregistrera dans une BDD. Et enfin, ils seront un peu l'agent qui contrÎle la machine via des contrÎles du systeme (vérif. admin, réglages du serveur, lanceur du serveur...)
","path":["Projets","Alternavive GLSI léger : Grabber"],"tags":["Projets","Bash","Docs"]},{"location":"projects/2025-12-05/#-python-django-gunicorn-whitenoise","level":3,"title":"-> Python (Django + Gunicorn + Whitenoise)","text":"Django s'occupera de traiter les données brutes du script Bash et les enregistrer dans une BDD. De plus, il s'occupera de la logique du panel Admin via ses outil préfabriqués. Pour servir notre app Django en production, on utilise la dépendance Gunicorn qui pourra gérer le multi-tùches via des \"Workers\" et tenir les standards d'une webapp classique. Gunicorn sera accompagné de Whitenoise, un outil en plus qui gÚrera les fichiers statiques (CSS/JS) que ne gÚre pas nativement Gunicorn.
","path":["Projets","Alternavive GLSI lĂ©ger : Grabber"],"tags":["Projets","Bash","Docs"]},{"location":"projects/2025-12-05/#-sqlite","level":3,"title":"-> SQLite","text":"Pour le moment, SQLite est le meilleur choix pour sa simplicitĂ© et sa taille minimale, elle est stockĂ©e en local, ne nĂ©cessite pas plus de prĂ©parations spĂ©cifiques car dĂ©jĂ prĂȘte Ă l'emploi avec Django.
","path":["Projets","Alternavive GLSI lĂ©ger : Grabber"],"tags":["Projets","Bash","Docs"]},{"location":"projects/2025-12-05/#architecture-technique","level":2,"title":"Architecture technique","text":"","path":["Projets","Alternavive GLSI lĂ©ger : Grabber"],"tags":["Projets","Bash","Docs"]},{"location":"projects/2025-12-05/#chef-du-service-grabbersh","level":3,"title":"Chef du service : grabber.sh","text":"Ce script aura un rĂŽle majeur dans le projet, il sera le chef d'orchestre du service et se chargera de gĂ©rer le panel admin et le serveur Django ainsi que l'environnement Python et d'ĂȘtre le centre des commandes en sĂ©curisant le service avec un token dynamique
Entre autre, il devra :
-> Initialiser l'environnement virtuel Python (nommé gbvenv)
-> Gérer les dépendances requises (fonction requirements qui vérifie si l'hÎte a bien les requis tels que jq, sqlite3 et python)
-> GénÚre si besoin les clés SSH nécessaires pour sécuriser la connexion de l'API
-> Vérifier la présence d'un compte super-user dans Django (important pour se logger au panel Admin, via le lancement d'un script Python \"lib/check_admin.py\")
-> Collecte les fichiers statiques depuis un dossier \"static\" afin de préparer le CSS pour Whitenoise
-> Automatiser le processus de \"migrations\" (python manage.py migrate)
-> Créer un token de session qui sécurisera les communications entre Django <-> Grabber <-> Alfred
","path":["Projets","Alternavive GLSI léger : Grabber"],"tags":["Projets","Bash","Docs"]},{"location":"projects/2025-12-05/#lagent-de-collecte-alfredrun","level":3,"title":"L'agent de collecte : alfred.run","text":"Info
Au dĂ©part une fonction inclue dans grabber.sh, il a finalement Ă©tĂ© dĂ©cidĂ© de sĂ©parer les deux pour plus de lisibilitĂ© et de facilitĂ© sur la suite pour ĂȘtre executĂ© en autonomie dans une machine cible.
Son rÎle est de fetch les données de la cible dont on a besoin pour répondre au besoin, données Hardware et Software. Toujours en Bash pour sa facilité d'utilisation dans des tùches d'extraction de données de l'OS.
En résumé, il devra donc :
-> Récupérer les données systÚme (avec des outils natifs comme les netutils ou bien la librairie externe inxi)
-> Empaqueter ces données en un objet JSON (avec jq)
-> Envoyer les donnĂ©es via une requĂȘte Ă l'endpoint du serveur Django (avec une requĂȘte HTTP POST curl)
-> Renvoyer le token de session pour sécuriser la communication
-> Le tout est codĂ© dans un paquet .run qui contient les librairies requises comme jq et inxi pour ĂȘtre utilisable sur un maximum d'ordinateurs Linux (compilĂ© avec makeself)
","path":["Projets","Alternavive GLSI léger : Grabber"],"tags":["Projets","Bash","Docs"]},{"location":"projects/2025-12-05/#cerveau-serveur-api-via-django","level":3,"title":"Cerveau serveur : API via Django","text":"","path":["Projets","Alternavive GLSI léger : Grabber"],"tags":["Projets","Bash","Docs"]},{"location":"projects/2025-12-05/#deploiement-dalfred","level":4,"title":"Déploiement d'Alfred","text":"Pour déployer Alfred sur une machine, on utilisera SSH pour envoyer le script dans un PC cible. On veut que cette tùche soit lancée directement depuis le panel Admin.
Pour se faire, on délÚgue celle-ci à Python avec Django qui l'effectuera avec un formulaire qui contient l'IP sur laquelle aller, le username et le mot de passe du SSH cible.
Warning
Puisque l'IP envoyée à la machine cible est récupérée via request.get_host(), l'administrateur doit impérativement accéder au panel Admin de Grabber via l'adresse IP réseau de la machine (ex: 192.168.x.x:8000) et non via localhost:8000. Sinon, le PC cible tentera d'envoyer ses données à son propre localhost et la base de données restera vide.
","path":["Projets","Alternavive GLSI lĂ©ger : Grabber"],"tags":["Projets","Bash","Docs"]},{"location":"projects/2025-12-05/#requete-avec-paramiko","level":5,"title":"RequĂȘte avec Paramiko","text":"C'est la solution trouvĂ©e pour gĂ©rer cette demande, Paramiko est une librairie Python installable avec pip qui peut Ă©tablir la session SSH et le fera depuis le backend Django (dans actions.py -> fonction deploy_ssh)
Le cycle de la requĂȘte est le suivant :
-> Connexion SSH à la cible. \n (Via la clé SSH d'abord, puis si refus, via les identifiants donnés par l'utilisateur)\n\n-> Si l'authentification via la clé n'a pas fonctionné, \n on envoie notre clé SSH hÎte sur la machine distante\n\n-> Transfert SFTP de l'exécutable alfred.run vers le répertoire temporaire /tmp/.\n\n-> Exécution distante en injectant l'IP du serveur (request.get_host()) et \n le Token de session.\n\n-> Nettoyage des traces (rm /tmp/alfred.run).\nInfo
Ne faut pas confondre ce token destiné aux communications inter-machines avec les sessions administrateurs du panel web, qui sont elles gérées directement par la base de données SQLite.
Comme dit plus tÎt, grabber.sh génÚre un token unique (faisant office de clé d'API) avec la commande openssl rand à chaque lancement du serveur. Ce token est temporairement stocké dans settings.json et est automatiquement réinitialisé à la fermeture du script (via la commande trap qui lance la fonction cleanup).
Du cÎté serveur, lors du démarrage de l'application par Gunicorn, le fichier config/settings.py se charge de lire settings.json et de charger cette clé en mémoire dans la variable globale SESSION_TOKEN.
Enfin, lorsqu'une requĂȘte est Ă©mise par Alfred, Django intercepte et vĂ©rifie cette clĂ© via la vue dĂ©diĂ©e dans web/api.py. Il extrait la clĂ© envoyĂ©e de maniĂšre sĂ©curisĂ©e dans les en-tĂȘtes HTTP de la requĂȘte curl (prĂ©cisĂ©ment le header HTTP_X_API_KEY) et la compare avec celle en mĂ©moire. Si les clĂ©s correspondent, les donnĂ©es matĂ©rielles sont traitĂ©es, sinon, la connexion est immĂ©diatement rejetĂ©e avec une erreur 401 (AccĂšs refusĂ©).
Il est une partie de l'app Django et présente dans une interface HTML/CSS/JS, une liste des ordinateurs enregistrés, la table SystemInfo avec l'adresse MAC comme clé principale pour chaque PC. Le tout est sécurisé avec le login admin de Django.
","path":["Projets","Alternavive GLSI lĂ©ger : Grabber"],"tags":["Projets","Bash","Docs"]},{"location":"projects/2025-12-05/#gestion-des-employes","level":5,"title":"Gestion des \"employĂ©s\"","text":"Via un petit modal, il est possible d'administrer en plus des ordinateurs, une BDD d'employĂ©s (stockĂ©e dans la mĂȘme BDD SQLite) et d'y effectuer des tĂąches basiques comme crĂ©er un employĂ©, le supprimer, l'Ă©diter et l'assigner Ă un ordinateur depuis la page d'un PC.
","path":["Projets","Alternavive GLSI lĂ©ger : Grabber"],"tags":["Projets","Bash","Docs"]},{"location":"projects/2025-12-05/#gestion-des-sessions","level":5,"title":"Gestion des sessions","text":"Pour gĂ©rer les sessions sur le Panel et Ă©viter que les administrateurs soient dĂ©connectĂ©s en naviguant (problĂšme liĂ© Ă la sĂ©paration des mĂ©moires des diffĂ©rents workers de Gunicorn), le systĂšme de session de Django a Ă©tĂ© configurĂ© pour ĂȘtre stockĂ© directement dans la base de donnĂ©es SQLite (SESSION_ENGINE = \"django.contrib.sessions.backends.db\").
","path":["Projets","Alternavive GLSI léger : Grabber"],"tags":["Projets","Bash","Docs"]},{"location":"projects/2025-12-05/#design","level":5,"title":"Design","text":"Le CSS et le design utilisent la librairie Tailwind en mode CLI. ConcrÚtement, on télécharge la librairie en local pour travailler avec, on la lance via une commande qui surveille \"watch\" les modifications, puis lorsque l'on a fini, on empaquete notre CSS avec le strict necessaire \"minify\". En savoir plus
","path":["Projets","Alternavive GLSI léger : Grabber"],"tags":["Projets","Bash","Docs"]},{"location":"projects/2025-12-05/#vue-densemble-du-projet-et-conclusions-projet-a-finir-avant","level":2,"title":"Vue d'ensemble du projet et Conclusions (Projet à finir avant)","text":"","path":["Projets","Alternavive GLSI léger : Grabber"],"tags":["Projets","Bash","Docs"]},{"location":"projects/2025-12-05/#difficultes-rencontrees-et-apprentissages","level":3,"title":"Difficultés rencontrées et apprentissages","text":"","path":["Projets","Alternavive GLSI léger : Grabber"],"tags":["Projets","Bash","Docs"]},{"location":"projects/2025-12-05/#bilan","level":3,"title":"Bilan","text":"","path":["Projets","Alternavive GLSI léger : Grabber"],"tags":["Projets","Bash","Docs"]},{"location":"projects/2025-12-05/#axes-damelioration","level":3,"title":"Axes d'amélioration","text":"","path":["Projets","Alternavive GLSI léger : Grabber"],"tags":["Projets","Bash","Docs"]},{"location":"projects/2026-01-23/","level":1,"title":"Docs et notes avec Zensical","text":"","path":["Projets","Docs et notes avec Zensical"],"tags":["Projets","Docs"]},{"location":"projects/2026-01-23/#docs-et-notes-avec-zensical","level":1,"title":"Docs et notes avec Zensical","text":"Note
Pendant la création de cette note j'ai migré de mkdocs à Zensicle (maj de mkdocs en meilleur) et donc j'utilise une config qui réutilise les fichiers et la structure mkdocs.
","path":["Projets","Docs et notes avec Zensical"],"tags":["Projets","Docs"]},{"location":"projects/2026-01-23/#pourquoi-faire","level":2,"title":"Pourquoi faire ?","text":"Pour héberger mon site de documentation en ligne, j'utilise Github via Github Actions qui est la solution parfaite pour un projet léger comme celui-ci.
Docs pour host sur Github
","path":["Projets","Docs et notes avec Zensical"],"tags":["Projets","Docs"]},{"location":"projects/2026-02-13/","level":1,"title":"Faire un portfolio en JS moderne","text":"","path":["Projets","Faire un portfolio en JS moderne"],"tags":["Javascript","React","HTML/CSS","Projet"]},{"location":"projects/2026-02-13/#faire-un-portfolio-en-js-moderne","level":1,"title":"Faire un portfolio en JS moderne","text":"","path":["Projets","Faire un portfolio en JS moderne"],"tags":["Javascript","React","HTML/CSS","Projet"]},{"location":"projects/2026-02-13/#but-du-projet","level":2,"title":"But du projet","text":"Ce projet est un moyen de toucher concrÚtement au JavaScript avec l'utilisation de React, pour faire un site portfolio personnel dans le but de promouvoir mes compétences personnelles et professionnelles ainsi que mes projets et hobbies à destination des professionnels.
","path":["Projets","Faire un portfolio en JS moderne"],"tags":["Javascript","React","HTML/CSS","Projet"]},{"location":"projects/2026-02-13/#stack-de-travail","level":2,"title":"Stack de travail","text":"On doit choisir quelle stack, c'est Ă dire quel combo d'outils on utilisera pour faire fonctionner le tout. Dans une stack de projet Web moderne, on doit choisir un Moteur, un Framework et le compilateur. Mais Ă quoi servent-ils ?
","path":["Projets","Faire un portfolio en JS moderne"],"tags":["Javascript","React","HTML/CSS","Projet"]},{"location":"projects/2026-02-13/#le-moteur-build-tool","level":3,"title":"Le Moteur (Build tool)","text":"Souvent appelé \"moteur\" par abus de langage, c'est l'outil qui fait tourner tout l'écosystÚme. Il coordonne le compilateur, le serveur et les fichiers.
","path":["Projets","Faire un portfolio en JS moderne"],"tags":["Javascript","React","HTML/CSS","Projet"]},{"location":"projects/2026-02-13/#le-framework","level":3,"title":"Le Framework","text":"Le framework est un ensemble d'outils et de rĂšgles de construction. Au lieu de partir d'une page blanche, on utilise des blocs dĂ©jĂ prĂȘtes et ça Ă©vite de recrĂ©er du code que la communautĂ© aurait dĂ©jĂ Ă©crit.
","path":["Projets","Faire un portfolio en JS moderne"],"tags":["Javascript","React","HTML/CSS","Projet"]},{"location":"projects/2026-02-13/#le-compilateur","level":3,"title":"Le Compilateur","text":"C'est le mĂȘme principe que dans plein d'autres languages comme le C par exemple, il reprend notre code, ici le JSX (un JavaScript mĂ©langĂ© Ă du HTML) en JS et HTML standard pour qu'un navigateur comprenne correctement.
","path":["Projets","Faire un portfolio en JS moderne"],"tags":["Javascript","React","HTML/CSS","Projet"]},{"location":"projects/2026-02-13/#choix","level":3,"title":"Choix","text":"Il existe donc plusieurs Moteurs (Vite, Next.JS, ...), Frameworks (React, Vue, Svelte, ...) et Compilateurs (Babel, SWC, ...) mais pour ce projet on retiendra une stack simple pour un débutant et efficace pour tester et déployer.
Stack choisie
Tout d'abord, nous définissons les premiers jours ce que nous allons concrÚtement faire comme projet, l'entreprise à un besoin spécifique :
","path":["Projets","Stage","Ătape 1 - Planification et installation Hardware"],"tags":[]},{"location":"projects/stage/2026-03-03/#definition-du-projet","level":2,"title":"DĂ©finition du projet","text":"Objectif : Concevoir et dĂ©ployer une solution d'infrastructure rĂ©seau et de stockage \"clĂ© en main\" pour une TPE. Le systĂšme offre les capacitĂ©s d'un NAS professionnel sĂ©curisĂ©, entiĂšrement administrable via une interface web intuitive, sans nĂ©cessiter de compĂ©tences en ligne de commande pour l'utilisateur final.
","path":["Projets","Stage","Ătape 1 - Planification et installation Hardware"],"tags":[]},{"location":"projects/stage/2026-03-03/#1-infrastructure-et-reseau-virtualisation","level":2,"title":"1. Infrastructure et RĂ©seau (Virtualisation)","text":"udev)./etc/samba/smb.conf, gestion des quotas).rsync pour les sauvegardes automatisĂ©es.nftables, et principe de moindre privilĂšge appliquĂ© Ă l'API Python (via une configuration sudoers restreinte).Mise en place de l'environnement matĂ©riel, rĂ©seau et validation des concepts de base.
Création des composants logiciels isolés.
useradd), modification dynamique de /etc/samba/smb.conf, gestion des quotas de stockage et redémarrage des services./proc et sysfs).udev pour déclencher automatiquement les scripts Bash de sauvegarde (Rsync) lors de la détection d'un montage USB.Création du frontend et connexion de tous les modules.
Automatisation du déploiement et durcissement du systÚme.
nftables / ufw).sudoers granulaires (limitation stricte aux commandes nécessaires).Validation finale et préparation des livrables.
.iso.gz en .iso.vmbr1 (LiĂ© Ă la carte physique branchĂ©e au mur) â WAN de pfSense.vmbr0 (RĂ©seau local interne) â LAN de pfSense.L'objectif Ă©tait de sĂ©parer le rĂ©seau de la rĂ©sidence (10.x.x.x) de notre rĂ©seau privĂ©. * Adressage LAN : Changement de l'IP du LAN pfSense (via sa console) en 192.168.10.1/24. * Serveur DHCP : Activation sur pfSense (plage 192.168.10.50 Ă 192.168.10.200) pour attribuer automatiquement des IP aux futures VMs et aux PC physiques branchĂ©s au serveur.
Modification physique du fichier /etc/network/interfaces pour l'aligner sur le nouveau LAN. * Interface LAN (vmbr0) : Attribution de l'IP statique 192.168.10.2/24 avec 192.168.10.1 comme passerelle (gateway). * Interface WAN (vmbr1) : Passage en mode manuel sans aucune IP ni passerelle pour empĂȘcher Proxmox d'ĂȘtre exposĂ© directement au rĂ©seau du bĂątiment.
10.x.x.x fournie par la rĂ©sidence.http://neverssl.com pour dĂ©clencher et valider la page de connexion (Portail Captif) de la rĂ©sidence.Contournement de la sĂ©curitĂ© \"Client Isolation\" du rĂ©seau Wi-Fi de la rĂ©sidence. * Installation : Ajout du paquet Tailscale sur pfSense et connexion via une clĂ© d'authentification (Auth Key). * RĂšgle Pare-feu : CrĂ©ation d'une rĂšgle Pass All (tout autoriser) sur la nouvelle interface Tailscale dans pfSense. * Subnet Routing : * DĂ©claration du rĂ©seau 192.168.10.0/24 dans les Advertised Routes des paramĂštres Tailscale de pfSense. * Approbation manuelle de cette route sur le panel d'administration web de Tailscale. * BĂ©nĂ©fice : AccĂšs global Ă https://192.168.10.1 (pfSense) et https://192.168.10.2:8006 (Proxmox) depuis n'importe oĂč, sans cĂąble.
Host, contrÎleur VirtIO SCSI single, disque avec option Discard (TRIM), et carte réseau VirtIO (paravirtualized) sur le bridge vmbr0.192.168.10.100 grùce au routage Tailscale.Solution d'Infrastructure \"Clé en Main\" pour TPE
","path":["Spécification de Projet : \"GrabberBoxTea\""],"tags":[]},{"location":"projects/stage/projet/#contexte-et-objectif","level":2,"title":"Contexte et Objectif","text":"Pour une TPE qui a des besoins sysops spécifiques mais voulant garder un controle total de leurs données sans avoir à dépendre d'outils externes (ex. Google, AWS)
L'entreprise a des besoins spécifiques tels que : - Accéder aux données de l'entreprise partout à l'intérieur comme à l'extérieur de l'entreprise - Donner des accÚs spécifiques à des monteurs freelances, dans le cadre d'une amélioration de la communication - Pouvoir manager le serveur via une interface simple et accessible (Pas de DSI, gestion par les employés, niveau confirmé) - BONUS: Avoir des outils de travaux collaboratifs intégrés au cloud pour éditer des données partout (ex. Comptabilité,...)
","path":["Spécification de Projet : \"GrabberBoxTea\""],"tags":[]},{"location":"projects/stage/projet/#architecture-technique","level":2,"title":"Architecture Technique","text":"Le systÚme repose sur une architecture en couches distinctes, exploitant des langages spécifiques pour chaque niveau de responsabilité :
/etc/samba/smb.conf) et rechargement des services à la volée.udev pour détecter la connexion de périphériques USB spécifiques./proc et /sys par le module C pour une latence minimale.Le projet intÚgre les meilleures pratiques d'ingénierie systÚme :
nftables), isolation des processus, et mise en place de HTTPS automatisé.je note mon parcours et mes projets en SysAdmin
","path":["Bienvenue dans mes notes de devops"],"tags":[]},{"location":"#sommaire","level":2,"title":"Sommaire","text":"-> Notes notes de cours, apprentissages en dehors, un peu de tout
-> Projets notes sur mes projets de cours/personnels, note de mes experiences
","path":["Bienvenue dans mes notes de devops"],"tags":[]},{"location":"learn/devops/2025-11-28/","level":1,"title":"Automatisation via les associations","text":"| (le pipe) -> prend le résultat de la commande de gauche et le donne à celle de droite
exemple : liste tout un répertoire, mais n'affiche que les résultats qui sont \"feur\"
ls -la | grep \"feur\"\n> et >>
> Ă©crase le fichier / >> ajoute Ă la fin sans effacerecho \"coucou\" > fichier.txtgit clone (url du projet git)git init (dossier de travail)echo gbvenv/ >> .gitignore <- on indique via un echo qui Ă©crira dans le fichier .gitignore qu'on ne veut pas push le dossier \"gbvenv\" ici, un fichier on ne mettera pas le slash (logique en amont)
Pour envoyer un projet git, c'est comme envoyer un colis Ă la poste, d'abord, on met nos affaires dans le colis
Plusieures possibilitĂ©s âïž
Ajoute TOUS les fichiers du dossier via l'option -A ou --all -> git add -A
Ajoute SEULEMENT les modifications et suppressions (donc pas de nouveaux fichiers) -> git add -u
Ensuite, on rempli l'Ă©tiquette du colis et on la colle au colis
git commit -m \"(message du commit)\"Enfin pour push, c'est a dire déposer le colis au bureau de poste pour l'envoi, on fait :
git push -u origin (branche souhaitée)Info
-u veut dire ce que dit la doc en gros
","path":["Notes","đ DevOps","Git pour les neuilles"],"tags":["Git","Bash","Devops"]},{"location":"learn/devops/2025-12-12/#-si-erreur","level":3,"title":"-> SI ERREUR","text":"Dans le cas ou un fichier/dossier a Ă©tĂ© supprimĂ© autre part avant de push nos modifs
git config pull.rebase falseDans le cas ou l'on veut travailler avec une seconde branche
Pour switch de branche de travail -> git checkout (branche souhaitée)
Pour merge en ecrasant la branche souhaitĂ©e âŹïž
git merge -s ours main\ngit checkout main\ngit merge (branche à merge)\nLe modÚle MVC est une façon de concevoir un projet logiciel, en gros on sépare celui-ci en trois grandes parties distinctes séparant la logique de la vue et rend le travail plus facile.
ModĂšle MVC en prenant celui de grabber par exemple :
- Model = Base De Donnée (ex: EMPLOYEES, COMPUTERS)\n- View = Tableau de bord, Site\n- Controller = Cerveau qui dirige les deux parties Model et View (ex: app.py)\ncelle de grabber pour l'exemple
BDD (Etape 1) - grabberman\nâââ TABLES (Etape 2) - COMPUTERS\nâ âââ Colonne (Etape 3) - PcId, entier/clĂ© primaire\nâ â âââ DonnĂ©e (Etape 4)\nâ âââ Colonne (Etape 3) - Hostname, chaĂźne de charactĂšre\nâ âââ Colonne (Etape 3) - MacAddress, chaĂźne de charactĂšre\nâââ TABLES (Etape 2) - EMPLOYEES\n âââ Colonne (Etape 3) - UserId, entier/clĂ© primaire\n âââ Colonne (Etape 3) - Username, chaĂźne de charactĂšre\n âââ Colonne (Etape 3) - PcId, clĂ© secondaire\nsqlite3 grabberman.db <- Commande qui crĂ©e une DB qu'on appellera ici \"grabberman\"
CREATE TABLE \"COMPUTERS\" \n(\n PcId INTEGER PRIMARY KEY AUTOINCREMENT, \n Hostname VARCHAR(50) NOT NULL, \n MacAddress VARCHAR(50)\n);\nNote
Ici on crée une table dans laquelle on stockera des données (des PC que l'on grab par exemple)
","path":["Notes","đ DevOps","SQL pour les tung tung tung sahur"],"tags":["SQL","Devops"]},{"location":"learn/devops/2026-01-22/#etape-3-ajouter-des-donnees-dans-une-table","level":3,"title":"Etape 3 : Ajouter des donnĂ©es dans une table","text":"INSERT into COMPUTERS (Hostname, MacAddress) VALUES ('mypc', '1B:12:F0:FL:94');
Note
Pour ajouter une donnée dans une tableau, on INSERE dans le TABLEAU donné les VALEURS dans les Colonnes
","path":["Notes","đ DevOps","SQL pour les tung tung tung sahur"],"tags":["SQL","Devops"]},{"location":"learn/devops/2026-01-22/#etape-4-creer-un-autre-tableau-avec-une-cle-liee-foreign-key","level":3,"title":"Etape 4 : CrĂ©er un autre tableau avec une clĂ© liĂ©e (foreign key)","text":"CREATE TABLE \"EMPLOYEES\" \n(\n UserId INTEGER PRIMARY KEY AUTOINCREMENT, \n Username VARCHAR(50) NOT NULL, \n FOREIGN KEY (PcId) REFERENCES COMPUTERS(PcId)\n);\nNote
On recommence comme à l'étape 2, en ajoutant une clé étrangÚre foreign key, qui lie une clé extérieure, PcId ici, dans notre second Tableau
","path":["Notes","đ DevOps","SQL pour les tung tung tung sahur"],"tags":["SQL","Devops"]},{"location":"learn/devops/2026-03-04/","level":1,"title":"C'est quoi DevOps ?","text":"","path":["Notes","đ DevOps","C'est quoi DevOps ?"],"tags":["MĂ©tier","Domaine","Informatique"]},{"location":"learn/frontend/2026-02-21/","level":1,"title":"Cheat Sheet Tailwind","text":"Tailwind utilise des classes utilitaires. La logique est souvent [PropriĂ©tĂ©]-[Taille/Couleur/Valeur].
La syntaxe : [Type][Direction]-[Taille].
Type : m (Margin / Extérieur) ou p (Padding / Intérieur).
Direction : t (Haut), b (Bas), l (Gauche), r (Droite), x (Horizontal), y (Vertical), ou rien (Partout).
Taille : Ăchelle basĂ©e sur des multiples de 4px (ex: 1 = 4px, 2 = 8px, 4 = 16px).
p-4 padding: 16px; Espace Ă l'intĂ©rieur partout. px-6 padding-left: 24px; padding-right: 24px; Espace Ă l'intĂ©rieur, Ă gauche et Ă droite. mt-2 margin-top: 8px; Espace Ă l'extĂ©rieur, vers le haut. mx-auto margin: 0 auto; Centre un bloc horizontalement.","path":["Notes","đš Frontend","Cheat Sheet Tailwind"],"tags":[]},{"location":"learn/frontend/2026-02-21/#2-dimensions-width-height","level":2,"title":"2. Dimensions (Width & Height)","text":"La syntaxe : w-[Taille] (Largeur) et h-[Taille] (Hauteur).
w-full width: 100%; Prend toute la largeur disponible. w-1/2 width: 50%; Prend la moitiĂ© de la largeur. w-screen width: 100vw; Prend la largeur totale de l'Ă©cran. h-screen height: 100vh; Prend la hauteur totale de l'Ă©cran. w-16 width: 64px; Ăchelle numĂ©rique classique (16 * 4px).","path":["Notes","đš Frontend","Cheat Sheet Tailwind"],"tags":[]},{"location":"learn/frontend/2026-02-21/#3-couleurs","level":2,"title":"3. Couleurs","text":"La syntaxe : [Cible]-[Couleur]-[IntensitĂ©].
L'intensité va de 50 (trÚs clair) à 950 (trÚs foncé).
text-blue-500, text-white La couleur de la police. Fond bg-red-600, bg-gray-900 La couleur d'arriĂšre-plan. Bordure border-green-400 La couleur de la bordure.","path":["Notes","đš Frontend","Cheat Sheet Tailwind"],"tags":[]},{"location":"learn/frontend/2026-02-21/#4-typographie","level":2,"title":"4. Typographie","text":"GĂ©rez la taille, la graisse et l'alignement.
CatĂ©gorie Classes utiles Explication Tailletext-xs, text-sm, text-base, text-lg, text-xl Du plus petit au plus grand. Graisse font-light, font-normal, font-semibold, font-bold L'Ă©paisseur des lettres. Alignement text-left, text-center, text-right L'alignement du texte.","path":["Notes","đš Frontend","Cheat Sheet Tailwind"],"tags":[]},{"location":"learn/frontend/2026-02-21/#5-flexbox-mise-en-page","level":2,"title":"5. Flexbox (Mise en page)","text":"DĂ©clarez flex pour commencer Ă aligner vos Ă©lĂ©ments.
flex display: flex; Aligne les enfants en ligne (cĂŽte Ă cĂŽte). flex-col flex-direction: column; Aligne les enfants en colonne. justify-center justify-content: center; Centre sur l'axe principal. justify-between justify-content: space-between; Ăcarte les Ă©lĂ©ments aux extrĂ©mitĂ©s. items-center align-items: center; Centre sur l'axe secondaire (souvent verticalement). gap-4 gap: 16px; Ajoute 16px d'espace entre chaque enfant.","path":["Notes","đš Frontend","Cheat Sheet Tailwind"],"tags":[]},{"location":"learn/frontend/2026-02-21/#6-bordures-et-arrondis-border-rounded","level":2,"title":"6. Bordures et Arrondis (Border & Rounded)","text":"Il faut toujours spĂ©cifier une Ă©paisseur pour voir la bordure.
Classe Ăquivalent CSS Explicationborder border-width: 1px; Ajoute une bordure de 1px partout. border-t border-top-width: 1px; Bordure uniquement en haut. rounded border-radius: 4px; Arrondit lĂ©gĂšrement les angles. rounded-md border-radius: 6px; Arrondi moyen (idĂ©al pour boutons). rounded-full border-radius: 9999px; Fait un cercle parfait ou une pilule.","path":["Notes","đš Frontend","Cheat Sheet Tailwind"],"tags":[]},{"location":"learn/frontend/2026-02-21/#7-etats-et-responsif-prefixes","level":2,"title":"7. Ătats et Responsif (PrĂ©fixes)","text":"PrĂ©fixez n'importe quelle classe avec un Ă©tat ou une taille d'Ă©cran.
hover:bg-blue-600focus:border-blue-500w-full (100% sur mobile par défaut)md:w-1/2 (50% sur tablette)lg:w-1/3 (33% sur grand écran)Info
Pour le TP, on a besoin de manipuler des fichiers. Mais avant d'utiliser le module file system dit \"fs\" (qui s'occupe de ce besoin), il faut comprendre un fonctionnement de base en informatique, essentielle aux modules faisant des requĂȘtes a des systemes externes comme fs, l'asynchrone.
","path":["Notes","â Javascript","Asynchrone et promesses (06/02/26)"],"tags":["JavaScript","Node.JS"]},{"location":"learn/javascript/2026-02-06/#cest-quoi-asynchrone","level":2,"title":"C'est quoi Asynchrone ?","text":"Asynchrone permet de ne pas bloquer le code mĂȘme si il n'a pas de rĂ©sultat mais avec promesse, il laisse le code continuer pour trouver une rĂ©ponse et la rapporter comme promis.
Rien de mieux qu'un exemple concret et gourmand en amont et en aval.
","path":["Notes","â Javascript","Asynchrone et promesses (06/02/26)"],"tags":["JavaScript","Node.JS"]},{"location":"learn/javascript/2026-02-06/#1-sans-asynchrone","level":3,"title":"1. SANS Asynchrone","text":"RĂ©sultat : La file d'attente sort du restaurant. Si la cuisson prend 10 minutes, tout le restaurant est bloquĂ© pendant 10 minutes. Bien guez.
","path":["Notes","â Javascript","Asynchrone et promesses (06/02/26)"],"tags":["JavaScript","Node.JS"]},{"location":"learn/javascript/2026-02-06/#2-avec-asynchrone","level":3,"title":"2. AVEC Asynchrone","text":"Note
âïžđ€ Node.js fonctionne sur un principe de thread unique (monothread)... En gros, il ne peut effectuer qu'une seule tĂąche Ă la fois.
Alors pour éviter de bloquer le programme pendant de longues opérations (comme lire des données au fin fond du disque dur), il délÚgue ces tùches a l'ordinateur et utilise un mécanisme de Promesses.
Dans notre exemple, la Promise, c'est le bipeur.
Ce boßtier est une promesse. Le restaurant te dit : \"Je n'ai pas ton crousty tout de suite, mais je te promets que je te préviendrai dÚs qu'il y a du nouveau.\"
Une Promise a toujours 3 Ă©tats possibles, et seulement 3 :
files.forEach((fileName) => {\n fs.readFile(fileName, 'utf8').then((content) => {\n ...\n })\n});\nfs.readFile : Envoie le job de lire un fichier à l'ordinateur avec des parametres et quand c'est pret, enrengistre son résultat dans content.contentOn peut également demander spécifiquement d'attendre le retour d'une promesse avec await
const stats = await fs.stat(filename);\nfs.stat : Envoie le job de récupérer les stats d'un fichier à l'ordinateur et quand c'est pret, enrengistre son résultat dans stats.stats**await** : Tant que l'on a pas de résultat, on \"fige\" à cette ligne jusqu'à ce que la promesse est reçue.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)","text":"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()
","path":["Notes","â Javascript","fetch des APIs et serveur HTTP (09/02/26)"],"tags":["JavaScript","Node.JS"]},{"location":"learn/javascript/2026-02-09/#json-le-traducteur","level":3,"title":"json() (Le traducteur)","text":"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.
Dans une fonction async fetchCityInfo(), on essayera de fetch via cette fonction :
// Attend de fetch les données d'une ville donnée par l'utilisateur via la variable cityName\nconst geoRes = await fetch(`https://geoservice.cnam.fr/api/cities?name=${encodeURIComponent(cityName)}`);\nPuis on encode les données brutes reçues dans un joli tableau JSON :
// La constante cities récupÚre le résultat geoRes et le range en JSON\nconst cities = await geoRes.json();\nPlus tard, on refait un fetch de données avec une clé API pour openweathermap (cas concret en gros) :
//Comme tout à l'heure, on fetch les données de l'API et on attend la réponse via await\nconst weatherRes = await fetch(`http://api.weatherapi.com/v1/current.json?q=${encodeURIComponent(cityName)}&key=****`);\nBravo, tu as fait un appel d'API et l'a rangé dans un beau tableau JSON.
","path":["Notes","â Javascript","fetch des APIs et serveur HTTP (09/02/26)"],"tags":["JavaScript","Node.JS"]},{"location":"learn/javascript/2026-02-09/#serveur-http","level":2,"title":"Serveur HTTP","text":"","path":["Notes","â Javascript","fetch des APIs et serveur HTTP (09/02/26)"],"tags":["JavaScript","Node.JS"]},{"location":"learn/python/2026-01-16/","level":1,"title":"pip et environnements virtuels","text":"","path":["Notes","đ Python","pip et environnements virtuels"],"tags":["Python","pip","Environnements Virtuels"]},{"location":"learn/python/2026-01-16/#python-et-ses-environnements-virtuels","level":2,"title":"Python et ses environnements virtuels","text":"Utile de crĂ©er donc un environnement pour chaque projet afin de en pas perturber d'autres projets avec des milliers de packages inutiles en gros
python3 -m venv gbvenv <- permet de créer un environnement (venv crée l'environnement \"gbvenv\")
source gbvenv/bin/activate <- lance cet environnement pour travailler dedans
pip est le packages manager de python, en l'appelant, on peut installer des packages comme uvicorn par exemple, utile pour grabber
pip install --upgrade pip <- update les packages
python -m pip install *** <- installe le package qu'on notera a la place des ***
pip freeze >> requirements.txt <- commande super utile pour partager les dependances necessaires pour faire fonctionner son projet sur un autre environnement
deactivate <- désactive l'environnement virtuel
bash <(curl -fsSL https://raw.githubusercontent.com/buchtioof/venv-setup/main/venvsetup.sh)
Pour en apprendre plus : le git du projet
","path":["Notes","đ Python","pip et environnements virtuels"],"tags":["Python","pip","Environnements Virtuels"]},{"location":"learn/python/2026-02-16/","level":1,"title":"Django en gros","text":"","path":["Notes","đ Python","Django en gros"],"tags":[]},{"location":"learn/python/2026-02-16/#commencer-un-projet-django","level":2,"title":"Commencer un projet Django","text":"Pour commencer un projet Django, c'est super simple :
-> D'abord, créer un dossier de projet
`mkdir projet`\n-> Ensuite créer un environnement virtuel Python puis installer Django via pip
`python3 -m venv \"projetvenv\" && source projetvenv/bin/activate && pip install django`\n-> Maintenant, créer le projet Django dans ce dossier (le point à la fin indique que l'on crée dans ce dossier le projet)
`django-admin startproject config .`\n-> On peut maintenant travailler dans notre projet Django
","path":["Notes","đ Python","Django en gros"],"tags":[]},{"location":"learn/python/2026-02-16/#projet-et-applications","level":2,"title":"Projet et applications","text":"Django fonctionne sur l'utilisations de petits modules appelĂ©s \"Applications\", ceux-ci composent un projet Django. Elles peuvent ĂȘtre des composants gĂšrant une API qui prend des donnĂ©es JSON pour les mettre dans une BDD SQL comme dans le projet Grabber ou encore plein d'autres cas...
Note
En gros, on a un projet (dossier \"config\") dans lequel on gÚre les réglages généraux de Django (serveur, adresses, ect...) et des applications (dans leurs dossiers propres) qui gÚrent leurs tùches propres à elles
Pour créer une Application on utilise cette commande -> python manage.py startapp nomdel'app
Une application se divise avec un fonctionnement en 3 parties
ModĂšle <--> Vue -> Template
","path":["Notes","đ Python","Django en gros"],"tags":[]},{"location":"learn/python/2026-02-16/#modele","level":3,"title":"ModĂšle","text":"Le ModĂšle sera la partie manipulation d'objets (comme en PhP), dans le projet Grabber, Django s'occupera de crĂ©er la DB sql via ce module
Warning
Quand on travaille sur le fichier models.py (généralement celui qui s'occupe de ce module) on doit utiliser deux commandes qui construisent le modÚle
python manage.py makemigrations\npython manage.py migrate\nLa Vue ici, c'est un peu le cerveau du projet, il reçoit les requĂȘtes (par exemple, l'utilisateur qui demande une URL ou alors un fichier bash qui envoie des donnĂ©es comme avec Grabber) et peut renvoyer ces requĂȘtes au ModĂšle pour avoir un rĂ©sultat, etc...
","path":["Notes","đ Python","Django en gros"],"tags":[]},{"location":"learn/python/2026-02-16/#template","level":3,"title":"Template","text":"Le template, c'est l'interface, par exemple des fichiers HTML. Il reçoit les donnĂ©es brutes de la Vue et les affiche proprement dans une jolie page web.
Utiliser les données brutes dans une template
Pour se faire, on doit utiliser cette balise {{ ... }} dans le HTML, cela veut dire pour Django que l'on récupÚre les données d'une clé spécifique
<!-- Dans les crochets, on appelle la donnée \"hostname\" de la table \"data\"-->\n<title>{{ data.hostname }} - Grabber</title>\nUn autre composant trÚs important dans Django, c'est les URLs. C'est un fichier dans lequel on doit router ce que telle url dans le navigateur doit effectuer.
Par exemple
Appeler la racine (localhost:5000/) doit ĂȘtre routĂ© comme ceci :
from django.urls import path\nfrom api import views\n\nurlpatterns = [\n # Route de la racine qui appelle la fonction computers_list\n path('', views.computers_list, name='computers'),\n]\nSSH est un protocole de communication (comme FTP, HTTP, ect...) qui se base dans le terminal. Il permet de contrÎler une fenetre de commandes d'un ordinateur à distance. Si SSH est activé sur un PC, un utilisateur connaissant les logins du PC distant pourra ouvrir un terminal à distance directement sur son ordinateur.
Pour plus de sécurité, il est préférable d'utiliser un systÚme de clés publiques/privées pour ne pas envoyer ces identifiants dans la nature en clair.
On va voir comment configurer une connexion SSH proprement entre deux PC.
","path":["Notes","𧰠SysAdmin","SSH et Configuration propre"],"tags":["SSH","Unix"]},{"location":"learn/sysadmin/2026-02-25/#etape-1-creer-une-cle-sur-le-pc-hote","level":2,"title":"Ătape 1 : CrĂ©er une clĂ© sur le PC HĂŽte","text":"On crĂ©e d'abord notre clĂ© SSH pour authentifier notre ordinateur via cette commande :
ssh-keygen -t ed25519 -C \"nom_de_votre_pc\"
En résumé, on utilise la commande ssh-keygen, préinstallée sur les distros UNIX et macOS, qui crée des clé et on lui demande une clé encryptée avec le protocole ed25519 via -t, recommandé car efficace et robuste, puis on donne le nom du PC qu'on authentifie avec -C.
On nous demandera alors dans quel répertoire stocker la clé, généralement il vous proposera dans votre répertoire home /.ssh/id_ed25519 et aussi si l'on veut protéger la clé avec un mot de passe.
Répertoire de la clé
La clĂ© donc sera stockĂ©e dans le rĂ©pertoire .ssh/id_ed25519 comme dit plus tĂŽt. Dans ce mĂȘme rĂ©pertoire, on y retrouvera deux fichiers :
Maintenant que l'on a notre clé, on doit la partager au PC distant, pour se faire, on devra une derniÚre fois utiliser les identifiants de l'utilisateur du PC distant via la commande :
ssh-copy-id utilisateur@adresse_ip_du_pc_distant
On nous demandera alors le mot de passe de l'utilisateur distant et enfin l'action sera effectuée, notre PC hÎte est maintenant authentifié par le PC distant !
La commande ici à tout simplement copié notre clé publique crée plus tÎt id_ed25519.pub avec la commande ssh-copy-id et l'a rangée dans un registre de clés dans le fichier rangé dans le répertoire .ssh/authorized_keys.
","path":["Notes","𧰠SysAdmin","SSH et Configuration propre"],"tags":["SSH","Unix"]},{"location":"learn/sysadmin/2026-02-25/#etape-3-essayer-cette-configuration","level":2,"title":"Ătape 3 : Essayer cette configuration","text":"Pour tester si tout fonctionne, il faut tout simplement lancer une connexion SSH avec la commande :
ssh utilisateur@adresse_ip_du_pc_distant
Si aucun mot de passe n'a été demandé, c'est que le PC distant nous à bien reconnu, c'est carré dans l'axe !
","path":["Notes","𧰠SysAdmin","SSH et Configuration propre"],"tags":["SSH","Unix"]},{"location":"learn/sysadmin/2026-02-25/#optionnel-mais-recommande-desactiver-les-identifiants-utilisateur","level":2,"title":"Optionnel mais recommandé : Désactiver les identifiants utilisateur","text":"Pour sécuriser le PC distant d'intrusions avec les identifiants qui auraient pu fuiter, on peut désactiver l'authentification via les identifiants utilisateur en éditant le fichier de configuration du SSH avec cette commande sur le PC distant :
sudo nano /etc/ssh/sshd_config
Dans ce fichier, une ligne nous interesse, celle-ci :
# PasswordAuthentication no
On retire le # et voila, l'authentification via le mot de passe est désactivé. Plus qu'a lancer une commande qui redémarre le serveur SSH du PC :
sudo systemctl restart ssh
Et c'est tout bon, on a configuré un accÚs SSH proprement avec un PC distant.
","path":["Notes","𧰠SysAdmin","SSH et Configuration propre"],"tags":["SSH","Unix"]},{"location":"learn/sysadmin/2026-03-04/","level":1,"title":"C'est quoi un Administrateur SystÚme ?","text":"Un Admin SystÚme, SysAdmin en anglais (terme le plus courant), est le couteau suisse du systÚme informatique de l'entreprise. Il se charge de gérer toute l'infrastructure d'une entreprise en quatre grands axes :
Un bon SysAdmin ne connaĂźt pas tout, mais il maĂźtrise ces fondamentaux :
C'est un métier qui demande un tempérament particulier :
On reste rarement SysAdmin toute sa vie. Voici l'Ă©volution classique d'un technicien systĂšme :
sudo : lance une commande avec les superdroits, peut manipuler tout le pc avec en gros
sudo [commande]\nls : liste les fichiers d'un dossier
# -a pour afficher les fichiers cachés / -l pour afficher en liste avec plus d'infos\nls [options] [fichier|dir]\ncd : changer de dossier
# ~ pour aller au répertoire home / .. pour revenir en arriere\ncd [dir]\npwd : affiche le répertoire actuel
pwd\ntouch : affiche le contenu d'un fichier
touch [fichier]\nnano : Ă©diteur de texte
nano [fichier]\nmkdir : supprime ce qu'on lui donne
mkdir [options] [fichier|dir]\nrm : supprime ce qu'on lui donne
# -r pour supprimer un dossier et son contenu (recursive) (`rmdir` le fait aussi)\n# -f force la commande\nrm [options] [fichier|dir]\ncp : copie...
cp [options] [source] [destination]\nmv : ...et déplace
mv [options] [source] [destination]\nchmod [droits] [fichier] - change les permissions d'un fichier (qui peut lire/écrire/exécuter) - chmod +x [fichier] rend un script exécutable (trÚs important) - chmod 777 [fichier] donne tous les droits à tout le monde (dangereux mais ça dépanne)
chown [user]:[groupe] [fichier] - change le propriétaire du fichier (si t'as copié un truc en sudo et que tu peux plus le toucher)
cat [fichier] - affiche tout le contenu d'un fichier d'un coup dans le terminal - utile pour les petits fichiers, sinon ça inonde l'écran
less [fichier] - affiche le contenu page par page (on peut scroller) - appuyer sur q pour quitter
head [fichier] / tail [fichier] - affiche juste le début (head) ou la fin (tail) d'un fichier - tail -f [fichier] hyper utile pour voir les logs en direct (ça attend les nouvelles lignes)
grep [mot] [fichier] - cherche un mot ou une phrase spécifique dans un fichier (le ctrl+f du terminal) - -r pour chercher dans tous les dossiers (recursive) / -i pour ignorer les majuscules
Selon Wikipédia...
Linux (parfois nommé GNU/Linux) est un systÚme d'exploitation open source de type Unix, basé sur le noyau Linux créé en 1991 par Linus Torvalds. (source)
","path":["Notes","𧰠SysAdmin","đ§ Linux","C'est quoi Linux ?"],"tags":["Linux","UNIX","Sysadmin","OS"]},{"location":"learn/sysadmin/linux/2025-10-30/#la-philosophie-derriere-linux","level":2,"title":"La philosophie derriĂšre Linux","text":"Contrairement Ă Windows ou macOS qui sont des systĂšmes fermĂ©s, Linux se diffĂ©rencie par son architecture totalement ouverte (Open Source).
C'est un systÚme d'exploitation (OS) conçu pour donner une liberté totale et qui en fait sa force avec :
Souvent, quand on dit \"J'installe Linux\", c'est un abus de langage. En réalité, un systÚme d'exploitation basé sur Linux est composé de plusieurs couches :
-> Le Noyau (GNU/Linux) : C'est le cĆur de la machine, il fait le pont entre les composants \"Hardware\" (CPU, RAM) et le logiciel \"Software\".
-> L'environnement de base et les Paquets (Packages) : Le noyau seul ne suffit pas. Pour interagir avec lui, on y ajoute des couches comme les outils de base (bash, ls, cd (ce sont des mini programmes Ă eux seuls !)), Ă©galement les logiciels sous forme de packages (une sorte d'archive) et les gestionnaires de tout ce beau monde (Gestionnaire de Paquets comme APT chez debian ou DNF chez Red Hat)
-> L'Interface Graphique (Desktop Environment, DE) : Contrairement à Windows qui impose son design, sur Linux on peut choisir son interface visuelle. Que ce soit Gnome (trÚs épuré, style macOS), KDE (trÚs personnalisable, style Windows), ou Cinnamon, l'interface n'est qu'une couche graphique que l'on rajoute par-dessus.
Info
Il n'est pas forcément obligatoire d'avoir une Interface Graphique (GUI), Linux en dehors d'un usage d'utilisateur classique, fonctionne sous forme de terminal tout simplement (CLI). On retrouve cet usage sur quasiment tous les serveurs du monde !
","path":["Notes","𧰠SysAdmin","đ§ Linux","C'est quoi Linux ?"],"tags":["Linux","UNIX","Sysadmin","OS"]},{"location":"learn/sysadmin/linux/2025-10-30/#les-distributions-distros","level":2,"title":"Les Distributions (Distros)","text":"Une \"Distribution\" (ou Distro), c'est simplement un pack prĂȘt Ă l'emploi qui regroupe un noyau, une sĂ©lection de paquets logiciels et une interface graphique.
Il en existe des milliers de distros, mais elles se divisent globalement en 3 grandes familles :
1. La famille Debian (La Stabilité)
C'est le bloc dur de Linux. Les paquets ne sont pas toujours Ă la derniĂšre version, mais le systĂšme est extrĂȘmement stable et fiable.
Les distros connues basées dessus : Ubuntu, Linux Mint, Pop OS. (Idéal pour les débutants).
2. La famille Arch Linux (La Liberté et la Nouveauté)
Le systÚme est toujours à la pointe de la derniÚre nouveauté grace au systeme du \"Rolling Releases (mise à jour en continu)\", mais c'est beaucoup plus compliqué à gérer et ça peut \"casser\" si on ne sait pas ce qu'on fait.
Les distros connues basées dessus : Arch Linux, Manjaro, Steam OS (l'OS du Steam Deck).
3. La famille Red Hat (L'Entre-deux)
Un excellent compromis entre une grande stabilité pour les serveurs et des paquets relativement récents pour les utilisateurs.
Les distros connues basées dessus : Fedora, CentOS, Alma Linux.
","path":["Notes","𧰠SysAdmin","đ§ Linux","C'est quoi Linux ?"],"tags":["Linux","UNIX","Sysadmin","OS"]},{"location":"learn/sysadmin/linux/2025-10-30/#ou-utilise-t-on-linux","level":2,"title":"OĂč utilise-t-on Linux ?","text":"-> Les Serveurs : L'immense majoritĂ© du web et des infrastructures cloud (AWS, serveurs web, bases de donnĂ©es) tourne sous Linux.
-> Les Smartphones : Android est basé sur le noyau Linux
-> L'embarqué et les Supercalculateurs : Les box internet, les TV connectées, les voitures...
","path":["Notes","𧰠SysAdmin","đ§ Linux","C'est quoi Linux ?"],"tags":["Linux","UNIX","Sysadmin","OS"]},{"location":"learn/sysadmin/linux/2025-10-31/","level":1,"title":"Arborescence type sur UNIX","text":"Unix a gĂ©nĂ©ralement cette arborescence que ce soit sur n'importe quelle distro Linux Ă©galement Android pour les tĂ©lĂ©phones et mĂȘme quelques similitudes sur macOS.
/ # Racine du disque\nâââ /bin/ # Contient les commandes de base\nâââ /boot/ # Fichiers de demarrage\nâââ /dev/ # Tout ce qui est liĂ© aux pĂ©riphĂ©riques\nâââ /etc/ # Fichiers de configuration\nâââ /home/ # RĂ©pertoires utilisateurs\nâââ /lib/ # BibliothĂšques logicielles\nâââ /mnt/ # Point de montage pour les systĂšmes de fichier temporaires\nâââ /media/ # Point de montage pour les disques temporaires\nâââ /opt/ # Logiciels optionnels, la ou on installera des programmes maison\nâââ /root/ # RĂ©pertoire du user root\nâââ /var/ # Variable, contient des logs, ect...\nâââ /usr/ # Contient sensiblement la mĂȘme chose que la racine mais sans ĂȘtre utile au fonctionnement du systĂšme\nâââ /srv/ # Services hĂ©bergĂ©s sur le systĂšmes (FTP, HTTP, ect...)\nâââ /run/ # Emplacement mĂ©moire des programmes\nâââ /tmp/ # Temporaire\nGrabber part d'un besoin de gĂ©rer un petit parc informatique (dizaines d'ordinateurs) dans un espace de travail (type entreprise). On peut dĂ©ja noter certains besoins majeurs : gĂ©rer des ordinateurs Ă distance, connaitre d'un coup d'oeil leur Ă©tat (updates, hardware, software) et Ă©tablir une liste de liens entre ordinateurs et employĂ©s.
","path":["Projets","Alternavive GLSI lĂ©ger : Grabber"],"tags":["Projets","Bash","Docs"]},{"location":"projects/2025-12-05/#solution","level":3,"title":"Solution","text":"Grabber donc serait dans l'idĂ©e capable de rĂ©pondre Ă ces besoins, via une interface web administrateur consultable par la DSI d'une entreprise par exemple. Pour la gestion d'un parc informatique de petite taille/toute petite, on proposera un produit simple, lĂ©ger et plug and play. Via une simple commande de terminal et une configuration au prĂ©alable des ordinateurs cibles capable de recevoir des requĂȘtes SSH, Grabber sera capable de couvrir un maximum des besoins.
","path":["Projets","Alternavive GLSI léger : Grabber"],"tags":["Projets","Bash","Docs"]},{"location":"projects/2025-12-05/#choix-de-la-stack-technologique","level":2,"title":"Choix de la stack technologique","text":"Le projet en général se basera sur du Bash et du Python pour gérer l'API et le panel Admin.
","path":["Projets","Alternavive GLSI léger : Grabber"],"tags":["Projets","Bash","Docs"]},{"location":"projects/2025-12-05/#-bash","level":3,"title":"-> Bash","text":"Les scripts Bash se contenteront de \"fetch\" les données systÚme (via des commandes comme lscpu ou la librairie inxi). Ils auront aussi le rÎle d'empaqueter ces données en format JSON (via jq) à un serveur qui les enregistrera dans une BDD. Et enfin, ils seront un peu l'agent qui contrÎle la machine via des contrÎles du systeme (vérif. admin, réglages du serveur, lanceur du serveur...)
","path":["Projets","Alternavive GLSI léger : Grabber"],"tags":["Projets","Bash","Docs"]},{"location":"projects/2025-12-05/#-python-django-gunicorn-whitenoise","level":3,"title":"-> Python (Django + Gunicorn + Whitenoise)","text":"Django s'occupera de traiter les données brutes du script Bash et les enregistrer dans une BDD. De plus, il s'occupera de la logique du panel Admin via ses outil préfabriqués. Pour servir notre app Django en production, on utilise la dépendance Gunicorn qui pourra gérer le multi-tùches via des \"Workers\" et tenir les standards d'une webapp classique. Gunicorn sera accompagné de Whitenoise, un outil en plus qui gÚrera les fichiers statiques (CSS/JS) que ne gÚre pas nativement Gunicorn.
","path":["Projets","Alternavive GLSI lĂ©ger : Grabber"],"tags":["Projets","Bash","Docs"]},{"location":"projects/2025-12-05/#-sqlite","level":3,"title":"-> SQLite","text":"Pour le moment, SQLite est le meilleur choix pour sa simplicitĂ© et sa taille minimale, elle est stockĂ©e en local, ne nĂ©cessite pas plus de prĂ©parations spĂ©cifiques car dĂ©jĂ prĂȘte Ă l'emploi avec Django.
","path":["Projets","Alternavive GLSI lĂ©ger : Grabber"],"tags":["Projets","Bash","Docs"]},{"location":"projects/2025-12-05/#architecture-technique","level":2,"title":"Architecture technique","text":"","path":["Projets","Alternavive GLSI lĂ©ger : Grabber"],"tags":["Projets","Bash","Docs"]},{"location":"projects/2025-12-05/#chef-du-service-grabbersh","level":3,"title":"Chef du service : grabber.sh","text":"Ce script aura un rĂŽle majeur dans le projet, il sera le chef d'orchestre du service et se chargera de gĂ©rer le panel admin et le serveur Django ainsi que l'environnement Python et d'ĂȘtre le centre des commandes en sĂ©curisant le service avec un token dynamique
Entre autre, il devra :
-> Initialiser l'environnement virtuel Python (nommé gbvenv)
-> Gérer les dépendances requises (fonction requirements qui vérifie si l'hÎte a bien les requis tels que jq, sqlite3 et python)
-> GénÚre si besoin les clés SSH nécessaires pour sécuriser la connexion de l'API
-> Vérifier la présence d'un compte super-user dans Django (important pour se logger au panel Admin, via le lancement d'un script Python \"lib/check_admin.py\")
-> Collecte les fichiers statiques depuis un dossier \"static\" afin de préparer le CSS pour Whitenoise
-> Automatiser le processus de \"migrations\" (python manage.py migrate)
-> Créer un token de session qui sécurisera les communications entre Django <-> Grabber <-> Alfred
","path":["Projets","Alternavive GLSI léger : Grabber"],"tags":["Projets","Bash","Docs"]},{"location":"projects/2025-12-05/#lagent-de-collecte-alfredrun","level":3,"title":"L'agent de collecte : alfred.run","text":"Info
Au dĂ©part une fonction inclue dans grabber.sh, il a finalement Ă©tĂ© dĂ©cidĂ© de sĂ©parer les deux pour plus de lisibilitĂ© et de facilitĂ© sur la suite pour ĂȘtre executĂ© en autonomie dans une machine cible.
Son rÎle est de fetch les données de la cible dont on a besoin pour répondre au besoin, données Hardware et Software. Toujours en Bash pour sa facilité d'utilisation dans des tùches d'extraction de données de l'OS.
En résumé, il devra donc :
-> Récupérer les données systÚme (avec des outils natifs comme les netutils ou bien la librairie externe inxi)
-> Empaqueter ces données en un objet JSON (avec jq)
-> Envoyer les donnĂ©es via une requĂȘte Ă l'endpoint du serveur Django (avec une requĂȘte HTTP POST curl)
-> Renvoyer le token de session pour sécuriser la communication
-> Le tout est codĂ© dans un paquet .run qui contient les librairies requises comme jq et inxi pour ĂȘtre utilisable sur un maximum d'ordinateurs Linux (compilĂ© avec makeself)
","path":["Projets","Alternavive GLSI léger : Grabber"],"tags":["Projets","Bash","Docs"]},{"location":"projects/2025-12-05/#cerveau-serveur-api-via-django","level":3,"title":"Cerveau serveur : API via Django","text":"","path":["Projets","Alternavive GLSI léger : Grabber"],"tags":["Projets","Bash","Docs"]},{"location":"projects/2025-12-05/#deploiement-dalfred","level":4,"title":"Déploiement d'Alfred","text":"Pour déployer Alfred sur une machine, on utilisera SSH pour envoyer le script dans un PC cible. On veut que cette tùche soit lancée directement depuis le panel Admin.
Pour se faire, on délÚgue celle-ci à Python avec Django qui l'effectuera avec un formulaire qui contient l'IP sur laquelle aller, le username et le mot de passe du SSH cible.
Warning
Puisque l'IP envoyée à la machine cible est récupérée via request.get_host(), l'administrateur doit impérativement accéder au panel Admin de Grabber via l'adresse IP réseau de la machine (ex: 192.168.x.x:8000) et non via localhost:8000. Sinon, le PC cible tentera d'envoyer ses données à son propre localhost et la base de données restera vide.
","path":["Projets","Alternavive GLSI lĂ©ger : Grabber"],"tags":["Projets","Bash","Docs"]},{"location":"projects/2025-12-05/#requete-avec-paramiko","level":5,"title":"RequĂȘte avec Paramiko","text":"C'est la solution trouvĂ©e pour gĂ©rer cette demande, Paramiko est une librairie Python installable avec pip qui peut Ă©tablir la session SSH et le fera depuis le backend Django (dans actions.py -> fonction deploy_ssh)
Le cycle de la requĂȘte est le suivant :
-> Connexion SSH à la cible. \n (Via la clé SSH d'abord, puis si refus, via les identifiants donnés par l'utilisateur)\n\n-> Si l'authentification via la clé n'a pas fonctionné, \n on envoie notre clé SSH hÎte sur la machine distante\n\n-> Transfert SFTP de l'exécutable alfred.run vers le répertoire temporaire /tmp/.\n\n-> Exécution distante en injectant l'IP du serveur (request.get_host()) et \n le Token de session.\n\n-> Nettoyage des traces (rm /tmp/alfred.run).\nInfo
Ne faut pas confondre ce token destiné aux communications inter-machines avec les sessions administrateurs du panel web, qui sont elles gérées directement par la base de données SQLite.
Comme dit plus tÎt, grabber.sh génÚre un token unique (faisant office de clé d'API) avec la commande openssl rand à chaque lancement du serveur. Ce token est temporairement stocké dans settings.json et est automatiquement réinitialisé à la fermeture du script (via la commande trap qui lance la fonction cleanup).
Du cÎté serveur, lors du démarrage de l'application par Gunicorn, le fichier config/settings.py se charge de lire settings.json et de charger cette clé en mémoire dans la variable globale SESSION_TOKEN.
Enfin, lorsqu'une requĂȘte est Ă©mise par Alfred, Django intercepte et vĂ©rifie cette clĂ© via la vue dĂ©diĂ©e dans web/api.py. Il extrait la clĂ© envoyĂ©e de maniĂšre sĂ©curisĂ©e dans les en-tĂȘtes HTTP de la requĂȘte curl (prĂ©cisĂ©ment le header HTTP_X_API_KEY) et la compare avec celle en mĂ©moire. Si les clĂ©s correspondent, les donnĂ©es matĂ©rielles sont traitĂ©es, sinon, la connexion est immĂ©diatement rejetĂ©e avec une erreur 401 (AccĂšs refusĂ©).
Il est une partie de l'app Django et présente dans une interface HTML/CSS/JS, une liste des ordinateurs enregistrés, la table SystemInfo avec l'adresse MAC comme clé principale pour chaque PC. Le tout est sécurisé avec le login admin de Django.
","path":["Projets","Alternavive GLSI lĂ©ger : Grabber"],"tags":["Projets","Bash","Docs"]},{"location":"projects/2025-12-05/#gestion-des-employes","level":5,"title":"Gestion des \"employĂ©s\"","text":"Via un petit modal, il est possible d'administrer en plus des ordinateurs, une BDD d'employĂ©s (stockĂ©e dans la mĂȘme BDD SQLite) et d'y effectuer des tĂąches basiques comme crĂ©er un employĂ©, le supprimer, l'Ă©diter et l'assigner Ă un ordinateur depuis la page d'un PC.
","path":["Projets","Alternavive GLSI lĂ©ger : Grabber"],"tags":["Projets","Bash","Docs"]},{"location":"projects/2025-12-05/#gestion-des-sessions","level":5,"title":"Gestion des sessions","text":"Pour gĂ©rer les sessions sur le Panel et Ă©viter que les administrateurs soient dĂ©connectĂ©s en naviguant (problĂšme liĂ© Ă la sĂ©paration des mĂ©moires des diffĂ©rents workers de Gunicorn), le systĂšme de session de Django a Ă©tĂ© configurĂ© pour ĂȘtre stockĂ© directement dans la base de donnĂ©es SQLite (SESSION_ENGINE = \"django.contrib.sessions.backends.db\").
","path":["Projets","Alternavive GLSI léger : Grabber"],"tags":["Projets","Bash","Docs"]},{"location":"projects/2025-12-05/#design","level":5,"title":"Design","text":"Le CSS et le design utilisent la librairie Tailwind en mode CLI. ConcrÚtement, on télécharge la librairie en local pour travailler avec, on la lance via une commande qui surveille \"watch\" les modifications, puis lorsque l'on a fini, on empaquete notre CSS avec le strict necessaire \"minify\". En savoir plus
","path":["Projets","Alternavive GLSI léger : Grabber"],"tags":["Projets","Bash","Docs"]},{"location":"projects/2025-12-05/#vue-densemble-du-projet-et-conclusions-projet-a-finir-avant","level":2,"title":"Vue d'ensemble du projet et Conclusions (Projet à finir avant)","text":"","path":["Projets","Alternavive GLSI léger : Grabber"],"tags":["Projets","Bash","Docs"]},{"location":"projects/2025-12-05/#difficultes-rencontrees-et-apprentissages","level":3,"title":"Difficultés rencontrées et apprentissages","text":"","path":["Projets","Alternavive GLSI léger : Grabber"],"tags":["Projets","Bash","Docs"]},{"location":"projects/2025-12-05/#bilan","level":3,"title":"Bilan","text":"","path":["Projets","Alternavive GLSI léger : Grabber"],"tags":["Projets","Bash","Docs"]},{"location":"projects/2025-12-05/#axes-damelioration","level":3,"title":"Axes d'amélioration","text":"","path":["Projets","Alternavive GLSI léger : Grabber"],"tags":["Projets","Bash","Docs"]},{"location":"projects/2026-01-23/","level":1,"title":"Docs et notes avec Zensical","text":"","path":["Projets","Docs et notes avec Zensical"],"tags":["Projets","Docs"]},{"location":"projects/2026-01-23/#docs-et-notes-avec-zensical","level":1,"title":"Docs et notes avec Zensical","text":"Note
Pendant la création de cette note j'ai migré de mkdocs à Zensicle (maj de mkdocs en meilleur) et donc j'utilise une config qui réutilise les fichiers et la structure mkdocs.
","path":["Projets","Docs et notes avec Zensical"],"tags":["Projets","Docs"]},{"location":"projects/2026-01-23/#pourquoi-faire","level":2,"title":"Pourquoi faire ?","text":"Pour héberger mon site de documentation en ligne, j'utilise Github via Github Actions qui est la solution parfaite pour un projet léger comme celui-ci.
Docs pour host sur Github
","path":["Projets","Docs et notes avec Zensical"],"tags":["Projets","Docs"]},{"location":"projects/2026-02-13/","level":1,"title":"Faire un portfolio en JS moderne","text":"","path":["Projets","Faire un portfolio en JS moderne"],"tags":["Javascript","React","HTML/CSS","Projet"]},{"location":"projects/2026-02-13/#faire-un-portfolio-en-js-moderne","level":1,"title":"Faire un portfolio en JS moderne","text":"","path":["Projets","Faire un portfolio en JS moderne"],"tags":["Javascript","React","HTML/CSS","Projet"]},{"location":"projects/2026-02-13/#but-du-projet","level":2,"title":"But du projet","text":"Ce projet est un moyen de toucher concrÚtement au JavaScript avec l'utilisation de React, pour faire un site portfolio personnel dans le but de promouvoir mes compétences personnelles et professionnelles ainsi que mes projets et hobbies à destination des professionnels.
","path":["Projets","Faire un portfolio en JS moderne"],"tags":["Javascript","React","HTML/CSS","Projet"]},{"location":"projects/2026-02-13/#stack-de-travail","level":2,"title":"Stack de travail","text":"On doit choisir quelle stack, c'est Ă dire quel combo d'outils on utilisera pour faire fonctionner le tout. Dans une stack de projet Web moderne, on doit choisir un Moteur, un Framework et le compilateur. Mais Ă quoi servent-ils ?
","path":["Projets","Faire un portfolio en JS moderne"],"tags":["Javascript","React","HTML/CSS","Projet"]},{"location":"projects/2026-02-13/#le-moteur-build-tool","level":3,"title":"Le Moteur (Build tool)","text":"Souvent appelé \"moteur\" par abus de langage, c'est l'outil qui fait tourner tout l'écosystÚme. Il coordonne le compilateur, le serveur et les fichiers.
","path":["Projets","Faire un portfolio en JS moderne"],"tags":["Javascript","React","HTML/CSS","Projet"]},{"location":"projects/2026-02-13/#le-framework","level":3,"title":"Le Framework","text":"Le framework est un ensemble d'outils et de rĂšgles de construction. Au lieu de partir d'une page blanche, on utilise des blocs dĂ©jĂ prĂȘtes et ça Ă©vite de recrĂ©er du code que la communautĂ© aurait dĂ©jĂ Ă©crit.
","path":["Projets","Faire un portfolio en JS moderne"],"tags":["Javascript","React","HTML/CSS","Projet"]},{"location":"projects/2026-02-13/#le-compilateur","level":3,"title":"Le Compilateur","text":"C'est le mĂȘme principe que dans plein d'autres languages comme le C par exemple, il reprend notre code, ici le JSX (un JavaScript mĂ©langĂ© Ă du HTML) en JS et HTML standard pour qu'un navigateur comprenne correctement.
","path":["Projets","Faire un portfolio en JS moderne"],"tags":["Javascript","React","HTML/CSS","Projet"]},{"location":"projects/2026-02-13/#choix","level":3,"title":"Choix","text":"Il existe donc plusieurs Moteurs (Vite, Next.JS, ...), Frameworks (React, Vue, Svelte, ...) et Compilateurs (Babel, SWC, ...) mais pour ce projet on retiendra une stack simple pour un débutant et efficace pour tester et déployer.
Stack choisie
Tout d'abord, nous définissons les premiers jours ce que nous allons concrÚtement faire comme projet, l'entreprise à un besoin spécifique :
","path":["Projets","Stage","Ătape 1 - Planification et installation Hardware"],"tags":[]},{"location":"projects/stage/2026-03-03/#definition-du-projet","level":2,"title":"DĂ©finition du projet","text":"Objectif : Concevoir et dĂ©ployer une solution d'infrastructure rĂ©seau et de stockage \"clĂ© en main\" pour une TPE. Le systĂšme offre les capacitĂ©s d'un NAS professionnel sĂ©curisĂ©, entiĂšrement administrable via une interface web intuitive, sans nĂ©cessiter de compĂ©tences en ligne de commande pour l'utilisateur final.
","path":["Projets","Stage","Ătape 1 - Planification et installation Hardware"],"tags":[]},{"location":"projects/stage/2026-03-03/#1-infrastructure-et-reseau-virtualisation","level":2,"title":"1. Infrastructure et RĂ©seau (Virtualisation)","text":"udev)./etc/samba/smb.conf, gestion des quotas).rsync pour les sauvegardes automatisĂ©es.nftables, et principe de moindre privilĂšge appliquĂ© Ă l'API Python (via une configuration sudoers restreinte).Mise en place de l'environnement matĂ©riel, rĂ©seau et validation des concepts de base.
Création des composants logiciels isolés.
useradd), modification dynamique de /etc/samba/smb.conf, gestion des quotas de stockage et redémarrage des services./proc et sysfs).udev pour déclencher automatiquement les scripts Bash de sauvegarde (Rsync) lors de la détection d'un montage USB.Création du frontend et connexion de tous les modules.
Automatisation du déploiement et durcissement du systÚme.
nftables / ufw).sudoers granulaires (limitation stricte aux commandes nécessaires).Validation finale et préparation des livrables.
.iso.gz en .iso.vmbr1 (LiĂ© Ă la carte physique branchĂ©e au mur) â WAN de pfSense.vmbr0 (RĂ©seau local interne) â LAN de pfSense.L'objectif Ă©tait de sĂ©parer le rĂ©seau de la rĂ©sidence (10.x.x.x) de notre rĂ©seau privĂ©. * Adressage LAN : Changement de l'IP du LAN pfSense (via sa console) en 192.168.10.1/24. * Serveur DHCP : Activation sur pfSense (plage 192.168.10.50 Ă 192.168.10.200) pour attribuer automatiquement des IP aux futures VMs et aux PC physiques branchĂ©s au serveur.
Modification physique du fichier /etc/network/interfaces pour l'aligner sur le nouveau LAN. * Interface LAN (vmbr0) : Attribution de l'IP statique 192.168.10.2/24 avec 192.168.10.1 comme passerelle (gateway). * Interface WAN (vmbr1) : Passage en mode manuel sans aucune IP ni passerelle pour empĂȘcher Proxmox d'ĂȘtre exposĂ© directement au rĂ©seau du bĂątiment.
10.x.x.x fournie par la rĂ©sidence.http://neverssl.com pour dĂ©clencher et valider la page de connexion (Portail Captif) de la rĂ©sidence.Contournement de la sĂ©curitĂ© \"Client Isolation\" du rĂ©seau Wi-Fi de la rĂ©sidence. * Installation : Ajout du paquet Tailscale sur pfSense et connexion via une clĂ© d'authentification (Auth Key). * RĂšgle Pare-feu : CrĂ©ation d'une rĂšgle Pass All (tout autoriser) sur la nouvelle interface Tailscale dans pfSense. * Subnet Routing : * DĂ©claration du rĂ©seau 192.168.10.0/24 dans les Advertised Routes des paramĂštres Tailscale de pfSense. * Approbation manuelle de cette route sur le panel d'administration web de Tailscale. * BĂ©nĂ©fice : AccĂšs global Ă https://192.168.10.1 (pfSense) et https://192.168.10.2:8006 (Proxmox) depuis n'importe oĂč, sans cĂąble.
Host, contrÎleur VirtIO SCSI single, disque avec option Discard (TRIM), et carte réseau VirtIO (paravirtualized) sur le bridge vmbr0.192.168.10.100 grùce au routage Tailscale.Solution d'Infrastructure \"Clé en Main\" pour TPE
","path":["Spécification de Projet : \"GrabberBoxTea\""],"tags":[]},{"location":"projects/stage/projet/#contexte-et-objectif","level":2,"title":"Contexte et Objectif","text":"Pour une TPE qui a des besoins sysops spécifiques mais voulant garder un controle total de leurs données sans avoir à dépendre d'outils externes (ex. Google, AWS)
L'entreprise a des besoins spécifiques tels que : - Accéder aux données de l'entreprise partout à l'intérieur comme à l'extérieur de l'entreprise - Donner des accÚs spécifiques à des monteurs freelances, dans le cadre d'une amélioration de la communication - Pouvoir manager le serveur via une interface simple et accessible (Pas de DSI, gestion par les employés, niveau confirmé) - BONUS: Avoir des outils de travaux collaboratifs intégrés au cloud pour éditer des données partout (ex. Comptabilité,...)
","path":["Spécification de Projet : \"GrabberBoxTea\""],"tags":[]},{"location":"projects/stage/projet/#architecture-technique","level":2,"title":"Architecture Technique","text":"Le systÚme repose sur une architecture en couches distinctes, exploitant des langages spécifiques pour chaque niveau de responsabilité :
/etc/samba/smb.conf) et rechargement des services à la volée.udev pour détecter la connexion de périphériques USB spécifiques./proc et /sys par le module C pour une latence minimale.Le projet intÚgre les meilleures pratiques d'ingénierie systÚme :
nftables), isolation des processus, et mise en place de HTTPS automatisé.