PostHog feature flags pour React Native

Cette skill vous aide à ajouter des feature flags PostHog aux applications React Native.

Fichiers de référence

• references/react-native.md - Installation des feature flags React Native - docs
• references/adding-feature-flag-code.md - Ajout de code de feature flag - docs
• references/best-practices.md - Bonnes pratiques des feature flags - docs

Consultez la documentation pour les détails de l'API et les patterns spécifiques au framework.

Principes clés

• Variables d'environnement : Utilisez toujours les variables d'environnement pour les clés PostHog. Ne les codez jamais en dur.
• Changements minimaux : Ajoutez le code de feature flag à côté de la logique existante. Ne remplacez pas ou ne restructurez pas le code existant.
• Flags booléens en priorité : Par défaut, vérifiez les flags booléens sauf si l'utilisateur demande spécifiquement des flags multivariés.
• Côté serveur quand c'est possible : Préférez l'évaluation des flags côté serveur pour éviter le scintillement de l'UI.

Outils PostHog MCP

Vérifiez si un serveur PostHog MCP est connecté. Si disponible, recherchez les outils liés à la gestion des feature flags (création, listage, mise à jour, suppression de flags). Utilisez ces outils pour gérer les flags directement dans PostHog plutôt que de demander à l'utilisateur de le faire manuellement dans le dashboard.

Recommandations du framework

• Pour les feature flags, utilisez les hooks useFeatureFlagEnabled() ou useFeatureFlagPayload() - ils gèrent automatiquement les états de chargement et la synchronisation externe
• Ajoutez la capture d'analytics dans les event handlers où les actions utilisateur se produisent, PAS dans useEffect réagissant aux changements d'état
• N'UTILISEZ PAS useEffect pour la transformation de données - calculez les valeurs dérivées pendant le rendu à la place
• N'UTILISEZ PAS useEffect pour réagir aux événements utilisateur - mettez cette logique directement dans l'event handler
• N'UTILISEZ PAS useEffect pour chaîner les mises à jour d'état - calculez toutes les mises à jour associées ensemble dans l'event handler
• N'UTILISEZ PAS useEffect pour notifier les composants parents - appelez le callback parent à côté de setState dans l'event handler
• Pour réinitialiser l'état du composant quand une prop change, passez la prop comme key du composant au lieu d'utiliser useEffect
• useEffect est UNIQUEMENT pour synchroniser avec les systèmes externes (widgets non-React, APIs du navigateur, abonnements réseau)
• posthog-react-native est le nom du package du SDK React Native
• Utilisez react-native-config pour charger POSTHOG_PROJECT_TOKEN et POSTHOG_HOST depuis .env (les variables sont intégrées au moment du build, pas à l'exécution)
• react-native-svg est une peer dependency requise de posthog-react-native (utilisée par la fonctionnalité surveys) et doit être installée à côté
• Placez PostHogProvider À L'INTÉRIEUR de NavigationContainer pour la compatibilité avec React Navigation v7