Odyssey 616
Je suis actuellement en plein marathon Marvel (visionnage de l’entièreté des films / séries / one-shot sorties par les studios Marvel). Comme beaucoup de personnes qui se lancent dans l’exercice, je me suis d’abord appuyé sur les excellents fichiers Excel partagés par la communauté — dont l’un est d’ailleurs déjà mentionné dans un article du site.
Ils sont très utiles, très complets et permettent de garder un vrai fil conducteur dans un univers aussi vaste que le MCU (Marvel Cinematic Universe). Mais, au fil de mon marathon, j’ai aussi rencontré quelques limites : certains éléments manquaient, l’ordre de visionnage ne correspondait pas toujours à celui que je voulais suivre, et je ressentais l’envie d’avoir un outil plus personnel.
Au départ, une simple application pour suivre mon propre marathon Marvel puis le projet a rapidement évolué vers un petit écosystème de quatre applications, toutes centrées sur différentes manières d’explorer le MCU.
Terrain d’expérimentation IA
Le projet est né au début de l’année 2026, à un moment où les outils d’IA ont franchi un cap assez net. Claude, Copilot, Gemini, Codex et de nombreux modèles associés sont devenus suffisamment puissants pour modifier concrètement la façon de concevoir et développer une application.
Odyssey 616 m’a donc permis de construire un outil personnel, mais aussi de tester ces nouvelles méthodes de travail dans un cadre sans enjeu client.
J’ai expérimenté plusieurs modèles, plusieurs approches et plusieurs frameworks d’agents : BMAD, Superpowers ou encore les Agent Skills d’Osmani. L’objectif n’était pas de déléguer aveuglément tout le développement à une IA, mais de comprendre ce que ces outils apportent réellement, leurs forces, leurs limites et les conditions dans lesquelles ils deviennent pertinents.
C’est aussi une façon d’alimenter ma veille de Lead Dev. Le sujet évolue en permanence : les modèles, les interfaces, les outils et les méthodologies changent très vite. Avoir un projet concret pour les mettre à l’épreuve permet ensuite d’en tirer des retours plus nuancés dans un contexte professionnel.
Un écosystème d’applications
La première application, Marathon, avait un objectif très simple : suivre sa progression dans le MCU.
Elle permet de parcourir les films et séries, de marquer les contenus vus et de conserver un état d’avancement tout au long du marathon. Au fil des itérations, l’application s’est enrichie avec de nouveaux écrans, une page de profil et différentes améliorations liées à l’expérience utilisateur.
Très vite, j’ai eu envie d’aller plus loin que ce premier usage. L’univers Marvel se prête naturellement à plusieurs angles de lecture, et j’ai commencé à imaginer une plateforme capable de regrouper différentes applications autour du même socle.
C’est là qu’est arrivé le Hub : une application volontairement simple, qui sert de point d’entrée vers les autres projets de l’écosystème.
Deux nouvelles applications ont ensuite complété l’ensemble :
- Map, qui recense les lieux réels et fictifs du MCU. L’objectif est de pouvoir rechercher, explorer et visualiser les localisations liées aux événements de l’univers Marvel.
- Characters, qui se concentre sur les personnages : leurs apparitions, les œuvres dans lesquelles ils interviennent et les différents acteurs qui les ont incarnés au fil du temps.
Aujourd’hui, Odyssey 616 se compose donc de quatre applications : Hub, Marathon, Map et Characters.
Une architecture en monorepo
Au départ, Marathon vivait seul dans son propre dépôt. Mais avec l’arrivée des autres applications, le passage à un monorepo s’est rapidement imposé.
Les projets partagent beaucoup plus que leur univers : des composants visuels, des éléments de navigation, l’authentification, les footers, les liens entre les applications et une partie des comportements communs.
Le monorepo permet de centraliser ces éléments sous forme de packages partagés. Lorsqu’une nouvelle application doit être créée, elle peut immédiatement réutiliser un header avec la connexion, un footer lié à l’écosystème ou les composants déjà en place, sans repartir de zéro.
À côté de ce monorepo applicatif, un second dépôt est consacré aux données. Cette séparation est importante : les applications consomment les données, tandis que leur construction, leur enrichissement et leur maintenance restent isolés dans un espace dédié.
React, TypeScript et une approche front-end
D’un point de vue technique, les applications sont développées en React avec TypeScript.
Il n’y a pas de back-end maison : la logique est essentiellement front-end, avec une couche de persistance pour les utilisateurs qui souhaitent conserver leur progression entre plusieurs appareils.
Deux modes d’utilisation sont proposés :
- Un mode sans connexion, où les données sont enregistrées localement dans le navigateur.
- Un mode connecté via Google, où la progression est enregistrée dans Supabase.
Cette approche permet de garder l’outil accessible immédiatement, sans imposer la création d’un compte, tout en laissant la possibilité de synchroniser ses données pour les utilisateurs qui le souhaitent.
L’ensemble est déployé sur Cloudflare Pages.
Côté interface, il n’y a pas de prétention graphique particulière. Je n’ai pas d’affinité avec l'esthétique et le design, ce n’était pas l’objectif du projet. Les interfaces reposent sur Tailwind et des composants simples (Shacdn notamment) : elles sont avant tout là pour permettre de naviguer efficacement dans les données et utiliser les applications sans friction.
La donnée
La partie la plus complexe d’Odyssey 616 n’a finalement pas été l’interface ou l’architecture applicative, mais la donnée.
Pour construire les différents outils, il fallait récupérer les films, séries, personnages, acteurs, visuels et métadonnées associés au MCU. La source principale est TMDB, The Movie Database, qui propose une API très riche pour explorer ce type de contenu.
Sur le papier, il suffit d’appeler une API. En pratique, le travail est bien plus délicat.
Les premières récupérations ramenaient beaucoup trop de contenu : de mauvais posters, des personnages non pertinents, des éléments éloignés du MCU ou des résultats mal associés. Il a donc fallu mettre en place de nombreux filtres, mais aussi réaliser un important travail d’ajustement manuel.
Les données sont aujourd’hui construites à partir de fichiers YAML, puis générées en JSON afin d’être consommées par les différentes applications. Ces fichiers sont devenus assez conséquents et constituent progressivement une véritable base de données autour du Marvel Cinematic Universe.
Elle n’est pas parfaite : il reste des erreurs, des cas particuliers et des informations à enrichir. Mais elle est désormais suffisamment fiable pour alimenter les applications et continuer à faire évoluer le projet.
Droits
Un autre sujet important est celui des droits.
Marvel protège fortement son univers, ses personnages et ses visuels. L’objectif n’a donc jamais été de créer un produit officiel, une plateforme commerciale ou un service qui exploiterait directement l’identité de Marvel.
Odyssey 616 reste un projet personnel, développé pour mon propre marathon et pour expérimenter différentes approches techniques. Il ne cherche pas à se substituer aux outils officiels ni à utiliser des illustrations ou éléments graphiques propriétaires de manière détournée.
C’est aussi pour cette raison que le projet reste volontairement simple dans son positionnement : un outil personnel, construit autour de données et de métadonnées, pour explorer un univers que j’apprécie.
Conclusion
Odyssey 616 est parti d’un besoin très concret : suivre mon marathon Marvel avec un outil qui corresponde exactement à ma manière de consommer cet univers.
Le projet est devenu plus large que prévu. Il m’a permis de créer un ensemble cohérent d’applications, de structurer une base de données conséquente, de mettre en place une architecture en monorepo et, surtout, d’expérimenter en profondeur les nouveaux outils de développement assisté par IA.
Le marathon continue, les données évoluent et l’écosystème a encore beaucoup de choses à explorer. C’est précisément ce qui rend ce projet aussi intéressant : il reste à la fois un outil personnel, un terrain de jeu technique et une veille continue sur les nouvelles façons de développer.
Les liens des applications :
https://marathon.odyssey616.com/
https://characters.odyssey616.com/
Et pour ceux qui voudrait consulter ma progression 🙂 : https://marathon.odyssey616.com/profile/bd7fd60a-603c-4983-84b9-52a6a73795ce/completion
