FRmicrow/state-management
.claude/skills/frontend/state-management/SKILL.md
Gérer l'état avec React Context API. Utiliser quand on crée ou consomme un Context dans frontend/src/context/.
development
Updated Apr 16, 2026
$ install --global
skillsauthnpx skillsauth add FRmicrow/dataFootV1 state-managementInstall this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.
Security Scan Results
3 of 9 scanners reported clean
Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.
3
Scanners Passed
9
Scanners in report
Clean
TrivyContainer and dependency vulnerability scanner
95%
Clean
SemgrepStatic code analysis for vulnerabilities
95%
Clean
mcp-scan (Snyk)Model Context Protocol security validation
95%
Skipped
Snyk (dep)Open source security scanning
50%
Skipped
Socket.devSupply chain security analysis
50%
Skipped
VirusTotalMulti-engine malware detection
50%
Skipped
CrowdStrikeAdvanced threat intelligence
50%
Skipped
OSV-ScannerOpen Source Vulnerability database check
50%
Skipped
OWASP Dep-Check
50%
Last scanned: Apr 16, 2026, 2:01 AM4.4s1 file scanned
SKILL.md
- name:
- state-management
- description:
- Gérer l'état avec React Context API. Utiliser quand on crée ou consomme un Context dans frontend/src/context/.
- risk:
- safe
When to use
Employez cette compétence dès que les composants doivent partager des données ou que l’état doit persister entre différentes pages.
Instructions
- Identifiez les données à partager et déterminez si elles doivent être globales, partagées ou locales.
- Choisissez un outil de gestion d’état adapté (Context API, Redux, Zustand) en fonction de la complexité et des performances souhaitées.
- Structurez l’état en slices ou modules séparés et créez des actions ou des setters pour le modifier.
- Sélectionnez uniquement les parties nécessaires de l’état dans vos composants pour éviter les re-rendus inutiles.
- Ajoutez des middleware ou des outils de debug (Redux DevTools) pour suivre les mutations et faciliter le débogage.
Example
Dans une application de gestion de tâches, utilisez Redux pour stocker la liste des tâches et leur état (à faire, en cours, terminées), et créez des actions addTask, updateTask, removeTask pour gérer la liste.
Limitations
Cette compétence se limite au front-end ; la synchronisation des données avec le backend ou le stockage hors ligne nécessite des stratégies supplémentaires.
Related Skills
FRmicrow/unit-testing-node
development
VerifiedTrustedCommunity
Écrire des tests unitaires Node.js. Utiliser quand on teste une fonction isolée avec Vitest dans backend/test/.
SKILL.mdUpdated Apr 16, 2026
FRmicrow/integration-testing
testing
VerifiedTrustedCommunity
Tester l'intégration entre services. Utiliser quand on vérifie l'interaction contrôleur/service avec Supertest + Vitest.
SKILL.mdUpdated Apr 16, 2026
FRmicrow/frontend-testing-react
development
VerifiedTrustedCommunity
Tester les composants React avec Vitest + Testing Library. Utiliser quand on teste le rendu ou les interactions.
SKILL.mdUpdated Apr 16, 2026
FRmicrow/e2e-testing-playwright
testing
VerifiedTrustedCommunity
Écrire des tests end-to-end Playwright. Utiliser quand on teste l'application complète du point de vue utilisateur.
SKILL.mdUpdated Apr 16, 2026