Je construis des produits d'IA. Ce site en est un.

Ce que j'ai construit

• Création du projet et mise en ligne
• Le cerveau du chatbot : comment il cherche, et comment il répond
• Refonte de la page du chatbot

• Création du projet et déploiement sur Cloudflare Pages
• La fonction de chat et l'essentiel du RAG : Astra DB, le seuil de similarité, les prompts système
• Actions contextuelles et suggestions rapides dans l'API, et refonte de la page IA

Comment jouer

1. Survolez l'écran pour piloter le vaisseau blanc.
2. Player 2, en orange, vous couvre.
3. Dessinez des ennemis dans la grille : ils arrivent avec cette forme.

Ce que j'ai construit

• L'éditeur de niveaux, et le chargement de ses niveaux dans le jeu
• Des vérifications automatiques à chaque modification du code par l'équipe
• Le guide écrit qui explique comment les joueurs dialoguent avec le serveur

• L'éditeur de cartes en Python, avec export JSON
• Le chargement des niveaux JSON côté jeu et côté serveur
• Le pipeline CI sur GitHub Actions
• La documentation du protocole et de l'éditeur, et le bonus de vitesse côté serveur

La grille est une version navigateur de l'éditeur que j'ai écrit. Le vrai est un outil de bureau.

Comment jouer

1. Cliquez sur une apparence : Lisse, Pixel ou Texte. Le jeu ne s'arrête pas.
2. Player 2 joue. Appuyez sur une flèche pour prendre la main.
3. Sur téléphone, balayez l'écran.

Ce que j'ai construit

• Le jeu Snake
• La première version de ses trois apparences
• Les images, et le guide pour les autres développeurs

• Snake : contrôle au clavier, bords qui bouclent, score
• La première version des trois moteurs de rendu : SFML, SDL2, ncurses
• Les sprites pour SFML et SDL2, et la documentation de l'interface

La ligne pointillée est le chemin que Player 2 a prévu jusqu'à la pomme.Redessiné pour le navigateur : un seul état de jeu, trois moteurs de rendu. Player 2 planifie son chemin avec un parcours en largeur.

Comment jouer

1. Maintenez le bouton de la souris sur l'écran, ou la barre d'espace, pour monter.
2. Relâchez pour descendre.
3. Prenez les pièces, évitez les lasers.

Ce que j'ai construit

• Le serveur et ses connexions avec les joueurs
• La lecture du fichier de niveau
• Pièces, obstacles et collisions
• Qui gagne et qui perd

• Le serveur : connexions et joueurs, avec poll()
• Le chargement de la carte ASCII et sa mise à l'échelle en 1920 × 1080
• Pièces, obstacles, collisions et défilement
• Conditions de victoire et de défaite

Le cadre sous le jeu affiche les chiffres de l'arbitre, en direct.Les panneaux sous le jeu montrent le côté serveur. Les noms des messages sont les vrais ; les valeurs sont calculées ici.

Comment jouer

1. Appuyez sur une flèche ou un bouton : votre commande rejoint la file bleue.
2. Le serveur l'exécute quand son temps est écoulé. Marchez jusqu'à la nourriture dorée et ramassez-la.
3. Envoyez plus de 10 commandes d'un coup et le serveur répond ko.

Ce que j'ai construit

• Le serveur auquel se connectent tous les joueurs IA et la vue 3D.
• La file d'attente des commandes de chaque joueur, avec son minutage.
• Avancer, et envoyer un message à tous les autres joueurs.

• Structures du serveur, socket et boucle poll(), connexion des clients et vérification des équipes, analyse des arguments.
• Commandes du protocole graphique : msz, tna, bct, mct, ppo, pnw.
• La file de commandes différées de chaque client : 10 places, temps d'exécution calculé selon la fréquence.
• Forward, Broadcast et Connect_nbr, corrections de fuites mémoire, et une classe réseau dans le client 3D.

Recréé pour le navigateur : une copie simplifiée des règles du serveur tourne dans cette page. Le vrai serveur est un programme C qui parle à ses clients en TCP.

Comment jouer

1. Choisissez un champion. Player 2 prend l'autre.
2. Regardez-les écrire tous les deux dans la mémoire partagée. Un programme qui cesse de dire live est retiré.
3. Appuyez sur Pause, puis sur Pas à pas, pour lire l'instruction que votre programme exécute ensuite.

Ce que j'ai construit

• Le chargement de chaque champion depuis son fichier et son placement dans la mémoire partagée.
• La lecture de chaque instruction à partir des octets, puis son exécution après son délai.
• Le suivi de qui a dit live, pour savoir qui est encore en jeu.

• Lecture des champions .cor et conversion entre décimal et hexadécimal.
• Création de l'arène et placement des champions.
• Décodage des instructions, enregistrement de chaque live, et les instructions and, or, xor et aff.
• Délais des instructions et gestion des erreurs.

Recréé pour le navigateur avec un jeu d'instructions réduit et trois champions écrits pour cette page. La vraie machine est en C et exécute des fichiers .cor compilés.

Comment jouer

1. Choisissez un langage, ou cochez les fichiers de votre dépôt.
2. Poussez un commit et suivez chaque étape, avec le journal Jenkins.
3. Essayez deux langages à la fois, aucun fichier de langage, ou deux fois le même commit.

Ce que j'ai construit

• Les dix images Docker : une image base et une image standalone pour chacun des cinq langages
• L'image Befunge, qui compile son propre interpréteur depuis les sources
• Le guide qui explique comment construire et utiliser les images

• Dix Dockerfiles, Dockerfile.base et Dockerfile.standalone, pour C, Java, JavaScript, Python et Befunge
• Builds multi-étapes : compilation dans une image, exécution dans une plus petite ; cfunge compilé avec cmake pour Befunge
• docs/docker_image.md : commandes de build, règles de chaque image, structure du dépôt

Rejoué dans votre navigateur : rien n'est vraiment construit. Les règles de détection, le choix du build et les étapes des Dockerfiles viennent du projet. L'étape de déploiement Kubernetes n'est pas montrée, car elle n'était pas terminée.

Comment jouer

1. Changez un nombre dans le fichier de scène. L'image se redessine, grossière d'abord, puis nette.
2. Cassez le fichier exprès : l'erreur indique la ligne et ce qui ne va pas.
3. Player 2 déplace la lumière, une sphère et la caméra jusqu'à ce que vous commenciez à taper.

Ce que j'ai construit

• La partie qui lit le fichier de scène : caméra, sphères, plans et lumières
• La classe Scene, qui contient la caméra, les formes et les lumières

• Analyse de la scène avec libconfig++ : caméra (résolution, position, rotation, champ de vision), sphères, plans, lumières ambiante et directionnelles
• La classe Scene : un seul conteneur pour la caméra, les primitives et les lumières
• Formes créées via le PrimitiveBuilder de l'équipe

Recréé dans le navigateur. Le format de scène suit le parseur du projet. Les vérifications supplémentaires et le petit moteur de rendu qui dessine l'image ont été écrits pour cette page, avec des ombres que l'original n'avait pas.

Comment jouer

1. Cliquez dans le terminal, tapez une commande et appuyez sur Entrée.
2. Envoyez la sortie dans un fichier avec > ou >>, ou vers une autre commande avec |.
3. Tapez cat << END, quelques lignes, puis END : le shell les lit comme entrée.

Ce que j'ai construit

• La boucle du prompt : lire une ligne, l'exécuter, réafficher le prompt.
• La recherche des programmes dans les dossiers du PATH, et leur lancement.
• Les commandes intégrées : cd, env, setenv, unsetenv, exit.
• L'envoi de la sortie vers des fichiers, la lecture du texte tapé après <<, et le passage de la sortie d'une commande à la suivante.

• Prompt « $> » lu avec getline ; fork, execve et waitpid ; un message quand le programme plante (Segmentation fault, Floating exception).
• cd avec un chemin, sans argument (HOME) et cd -, avec mise à jour de PWD et OLDPWD ; setenv avec vérification du nom, unsetenv, env, exit.
• Redirections > et >> et heredoc << avec dup2 et pipe ; le séparateur ;.
• Un pipe entre deux commandes, et ma propre bibliothèque printf.

Recréé pour le navigateur : une petite copie des règles du shell tourne dans cette page, avec un faux système de fichiers et quelques programmes. Les vrais shells sont des programmes C qui lancent de vrais programmes.

Comment jouer

1. Déplacez le curseur ou choisissez une règle : 30 semble aléatoire, 90 dessine des triangles, 110 fait pousser des structures.
2. Cliquez sur les petites cases pour inverser une partie de la règle.
3. Ou tapez la commande vous-même, avec les mêmes options que le vrai programme.

Ce que j'ai construit

• La lecture des options tapées après le nom du programme, et le refus des options invalides.
• Le calcul de chaque nouvelle ligne de cellules à partir de celle du dessus.
• L'affichage des lignes centrées dans la fenêtre, avec des étoiles.

• Analyse des arguments : --rule (obligatoire), --start, --lines, --window (80 par défaut), --move ; code de sortie 84 sur un argument invalide.
• La génération suivante pour les règles 30, 90 et 110.
• La boucle d'affichage, et la configuration du projet Stack.

Recréé pour le navigateur. Le programme Haskell d'origine accepte les règles 30, 90 et 110 ; cette page exécute n'importe quelle règle de 0 à 255.

Comment jouer

1. Dessinez sur le tableau : Player 2 s'écarte.
2. Changez de couleur ou de taille, ou prenez la gomme, dans la barre d'outils.
3. Enregistrez en PNG pour garder votre dessin.

Ce que j'ai construit

• La fenêtre et les boutons de la barre d'outils
• Le choix de la couleur et de la taille du crayon, et la gomme
• L'écran d'aide et l'enregistrement du dessin en image

• Fenêtre CSFML et barre d'outils : un sprite par bouton, détection du bouton touché au clic
• Huit couleurs, trois rayons de crayon (5, 18, 35 px), une gomme qui peint en rgb(22, 22, 22)
• Aide affichée ou masquée, tableau copié de la fenêtre vers un fichier image

Recréé pour le navigateur en TypeScript à partir de la version C : mêmes couleurs, tailles et gomme. Ici, le crayon comble les espaces entre les cercles, et le fichier est un PNG daté au lieu de test.jpg.

Comment jouer

1. Tapez un message et une clé.
2. Passez du mode bloc au mode flux, et regardez chaque octet changer.
3. Déchiffrez : un XOR avec la même clé redonne le message.

Ce que j'ai construit

• Le chiffrement XOR, en mode bloc et en mode flux
• La conversion du texte en hexadécimal et inversement
• Le point d'entrée qui envoie chaque commande au bon algorithme

• xor_block et xor_stream : octets inversés par bloc (little endian), puis XOR avec la clé
• Le mode flux complète le dernier bloc avec des zéros et les retire au déchiffrement
• hex_to_bytes et print_hex, un lecteur stdin dynamique, main qui aiguille vers xor, aes et rsa

Recréé pour le navigateur à partir de la version C, XOR uniquement. Un XOR avec une clé courte répétée est un chiffrement d'école : il ne protège pas de vrais secrets.

Comment jouer

1. Maintenez la touche : brièvement pour un point, plus longtemps pour un trait.
2. Maintenez-la une seconde ou plus pour finir la lettre.
3. Lisez votre nom dans le champ, puis connectez-vous (c'est un jouet).

Ce que j'ai construit

• La saisie en code Morse de l'écran de connexion
• Appui court pour un point, appui long pour un trait, très long pour la lettre suivante
• La traduction en lettres en direct, et Retour arrière pour corriger une erreur

• keydown et keyup sur Espace mesurent l'appui : moins de 200 ms, un point ; moins de 800 ms, un trait ; 1 s ou plus, une fin de lettre
• Une table Morse inversée en table de recherche, avec un décodage lettre par lettre à chaque appui
• Le template et le style du composant, et la route, passée plus tard à provideRouter

Recréé pour le navigateur à partir de la version Angular, avec les mêmes durées. Les boutons Point, Trait et Lettre suivante sont un ajout de cette page. Il n'y a ni compte ni mot de passe.