COD4 Completionist

En tant que fan de la licence Call of Duty, l'idée de ce projet m'est venue en parcourant le Reddit COD. J'y ai découvert les superbes maquettes de tracking de camouflages réalisées par Emil Carlsson. L'envie m'a pris d'aller plus loin : ajouter un véritable back-end à ce travail visuel, le modèle de données de Call of Duty m'étant plutôt familier.

L'objectif était clair : concevoir un outil de suivi complet (armes, cartes, accessoires, défis) pour le jeu fondateur, Call of Duty 4 : Modern Warfare (2007). J'ai choisi de commencer par ce titre car sa base de données est abordable et c'est le premier à introduire les défis de camouflage. L'idée est de valider cette architecture simple avant de décliner le concept sur les opus plus récents et complexes, ce qui me donnera l'occasion d'explorer de nouveaux frameworks front et back.

Voici comment j'ai construit Cod4 Completionist.

1. Architecture & Infrastructure

Pour la première itération de ce projet, je suis resté sur un terrain connu avec une architecture qui m'est familière et d'une grande fiabilité. La stack back-end et infrastructure repose sur :

• PHP 8.3 & Symfony 7.1 : le cœur de l'application, pour une modélisation robuste et un développement rapide.
• MySQL 8 : pour la persistance et la gestion des données relationnelles.
• Docker & Nginx : l'ensemble de l'environnement est conteneurisé, ce qui me garantit un espace de développement isolé et facilement déployable.

2. Modélisation & Import des données

La question de la source des données a été un vrai point de réflexion. Scrapper un site fan comme fandom.com m'a d'abord traversé l'esprit, mais la complexité technique était disproportionnée face au faible volume d'informations de COD 4.

Je suis donc parti sur une solution plus pragmatique : un fichier Excel alimenté manuellement (via des CSV ou des conversions de tableaux HTML).

• Import dynamique : Grâce à la librairie phpoffice/phpspreadsheet, j'ai mis en place un système de lecture de cet Excel. Le script dispatche les données en fonction du nom des feuilles vers des entités de type "Wiki" ou "Challenge", permettant de créer et mettre à jour la base de données automatiquement.
• Architecture relationnelle : La structure des défis a demandé quelques itérations. J'avais initialement imaginé un modèle complexe liant des entités Task et Reward au Wiki. Finalement, j'ai opté pour la simplicité : une entité Challenge unique avec des types enfants spécifiques, où la tâche à accomplir est stockée sous forme de chaîne de caractères.
   

3. Intégration Front-end & Interface

Côté front, l'objectif était de produire une interface fluide et fidèle au concept visuel qui m'avait inspiré. J'ai profité de ce projet pour acquérir une nouvelle compétence clé de l'écosystème Symfony :

• AssetMapper : j'ai délaissé Webpack pour utiliser le composant natif de Symfony dédié à la gestion des ressources et à la compilation CSS/JS.
• Twig & Bootstrap 5.3 : pour structurer l'affichage "Wiki", j'ai utilisé un système de grille classique (4 colonnes en desktop, 1 seule sur mobile).
• L'affichage des Challenges : l'interface reprend le concept d'Emil Carlsson. La base est composée de cartes dynamiques qui, au survol, révèlent des données supplémentaires sur les défis de camouflage.
   

4. Espace utilisateur & Tracking dynamique

Un outil de complétion n'a de sens que si l'utilisateur peut sauvegarder sa progression.

• Authentification : Je me suis appuyé sur le Maker Bundle de Symfony pour générer les formulaires d'inscription et de connexion par défaut. Pour sécuriser l'ensemble de façon transparente, j'y ai greffé le bundle karser/karser-recaptcha3-bundle, permettant d'implanter facilement un Google ReCAPTCHA v3 via le FormBuilder.
• Expérience utilisateur (AJAX) : Pour tracker ses défis, l'utilisateur doit être connecté (une modale l'y invite le cas échéant). Une fois authentifié, l'expérience est sans rechargement : un clic sur un challenge déclenche un appel AJAX. Visuellement, la carte se superpose d'un fond vert et d'une coche de validation. Au survol d'un défi complété, la coche se transforme en croix rouge, indiquant que l'utilisateur peut retirer ce défi de sa progression d'un simple clic.
   

Conclusion

Développer Cod4 Completionist de A à Z a été un excellent moyen de lier une passion personnelle à la pratique technique. Cela m'a permis de consolider mes acquis sur la dernière version de Symfony tout en expérimentant des outils comme AssetMapper ou des bundles spécifiques.

La base est désormais solide, et les problématiques de scrapping et de changement de frameworks feront d'excellents défis techniques pour les futures versions dédiées aux prochains Call of Duty !