CRYPTEX

Créer en deux semaines un site dynamique sur les cryptomonnaies.

Le cahier des charges tenait en trois objectifs : afficher les cours en temps réel, proposer une recherche avancée et s'appuyer sur des données de marché fiables via une API publique, le tout avec une base de données et une interface claire.

C'était un projet individuel, et ma première vraie utilisation d'une API. Ça a pesé sur tout le reste.

CRYPTEX suit en direct 50 cryptomonnaies : prix live, recherche multicritère avec autocomplétion, et courbes sur 7 jours dessinées en Canvas.

J'ai défini un design system sombre inspiré des terminaux de trading : fond #0b0b10, vert pour les hausses, rouge pour les baisses, et trois polices distinctes (Syne, Space Mono, DM Sans).

J'ai aussi fait un choix fort : aucun framework, ni en JS ni en CSS. Ça m'a donné un contrôle total du rendu, des fichiers légers et zéro dépendance incompatible avec l'hébergement de l'école.

• Design system
• Vanilla JS
• Canvas

La limite de requêtes de l'API est devenue la meilleure idée technique du projet.

CoinGecko n'autorise que quelques appels par minute. Au lieu d'appeler l'API à chaque visite, le site fait un seul appel partagé toutes les 60 secondes, avec une protection anti-stampede, et stocke le résultat dans un cache JSON.

Les pages lisent ce cache, et les prix se mettent à jour en AJAX sans recharger. Ça règle d'un coup la limite d'appels et la synchronisation des données.

J'ai aussi travaillé la sécurité du formulaire de recherche (échappement, validation client et serveur, tests XSS et injection) et l'accessibilité (contraste WCAG AA, navigation clavier). Lighthouse : 98 en performance, 93 en accessibilité, 96 en bonnes pratiques, 100 en SEO.

• API
• Cache JSON
• Sécurité
• Lighthouse

Partir d'un problème et en faire la pièce maîtresse du projet.

J'ai découvert en même temps les bases de données sous MySQL et les API. Au début, le rendu n'était pas à la hauteur de ce que je visais, mais j'ai rattrapé le niveau en avançant.

Il reste des pistes que j'assume : pagination côté serveur pour le mobile, token de sécurité sur l'appel API en production, et tests automatisés.