TypeScript — Aide-mémoire complet
Référence TypeScript orientée React 18, Redux Toolkit, MUI v7 et API Symfony.
$ grep --tag
// 13 contenu(s) avec ce tag.
Référence TypeScript orientée React 18, Redux Toolkit, MUI v7 et API Symfony.
Après la migration de baccalaureat.sn vers Symfony Turbo, mes îlots React perdaient l'authentification à chaque changement de page. La cause : un store Redux recréé à chaque navigation. La solution : repenser où vit la source de vérité.
Reconstruire le lecteur PDF de baccalaureat.sn a révélé trois bugs imbriqués : un mismatch de version pdfjs-dist, un worker chargé depuis un CDN bloqué en prod, et un overflow:hidden parent qui tuait le scroll du viewer.
Sur baccalaureat.sn, le login Google fonctionnait, puis l'utilisateur était éjecté quelques instants après la redirection. Deux coupables imbriqués : un reducer Redux trop zélé et un intercepteur axios qui interceptait sa propre route d'auth.
Au démarrage du dev server, Vite affichait « Failed to run dependency scan. Skipping dependency pre-bundling » puis continuait comme si de rien n'était. Résultat : pages lentes et imports qui cassent. Diagnostic d'un message que presque personne n'explique.
En dev, le front React sur le port 5173 refusait de parler à l'API Symfony sur le 8000 : requêtes bloquées, preflight OPTIONS en échec, cookies absents. Configuration complète de nelmio/cors-bundle et les pièges du mode credentials.
Remplacer Webpack Encore par Vite dans un projet Symfony : configuration des entry points, îlots React dans Twig, HMR instantané en dev et build optimisé en prod avec pentatrion/vite-bundle.
Comment j'ai centralisé la gestion des tokens JWT pour sécuriser plusieurs applications (portfolio, baccalaureat.sn, SyllVS) avec un unique backend d'authentification.
Découvrez comment Redux Toolkit simplifie la gestion d'état dans vos projets React. Exemples concrets, architecture modulaire et bonnes pratiques.