React Native Debugger pour MAC
App gratuite et open source pour déboguer des apps React Native, avec React Inspector, Redux DevTools et Apollo Client DevTools. Remote Debugger uniquement.
Présentation de React Native Debugger
React Native Debugger est une app autonome, gratuite et open source pour déboguer des apps React Native. Elle s’appuie sur le Remote Debugger officiel et ajoute d’autres fonctions, en réunissant React Inspector, Redux DevTools et Apollo Client DevTools dans une seule fenêtre. Pour l’utiliser, ouvrez l’app, vérifiez que les autres clients de débogage sont fermés et activez Debug JS Remotely dans le menu développeur de votre app.
React Native Debugger est créé par Jhen-Jie Hong et publié sous licence MIT. Il a une limite importante : il ne prend en charge que l’ancien Remote Debugger, pas Hermes, JSI ni la New Architecture, et aucune version n’a suivi la 0.14.0. Vérifiez d’abord qu’il convient à votre projet. Les versions à partir de la 0.11 nécessitent react-native 0.62 ou ultérieur. La version 0.14.0 est une app universelle pour Intel et Apple Silicon, nécessite macOS 10.13 ou ultérieur et repose sur Electron 25.
Fonctionnalités principales
React Native Debugger réunit dans une seule app les principaux outils de débogage pour React Native.
- Débogage à distance : basé sur le Remote Debugger officiel, avec plus de fonctions.
- React Inspector : inclus à partir de react-devtools-core.
- Redux DevTools : inclus, avec la même API que redux-devtools-extension.
- Apollo Client DevTools : inclus comme extension devtools.
- Inspection réseau : inspectez le trafic réseau avec les Chrome Developer Tools.
- Fenêtres de débogage : ouvrez une nouvelle fenêtre avec Command+T et choisissez le port voulu.
- Lancement par URI : démarrez-le en ligne de commande avec le schéma rndebugger:.
- Fichier de configuration : gardez vos réglages dans un fichier de votre dossier personnel.
Nouveautés de la version 0.14.0
React Native Debugger 0.14.0 met à jour ses composants principaux et améliore les formulaires.
- La touche Entrée fonctionne désormais dans les formulaires
- Mise à jour vers Electron 25
- react-devtools-core mis à jour en 4.28.0, avec un avertissement de source map corrigé
- redux-devtools mis à jour vers la dernière version
- apollo-client-devtools mis à jour vers la version 4
- Plus de vérification de l’hôte pour Open in Editor
Questions fréquentes sur React Native Debugger
React Native Debugger est-il gratuit ?
Oui. Il est gratuit et open source sous licence MIT.
React Native Debugger prend-il en charge Hermes ou la New Architecture ?
Non. Il ne prend en charge que l’ancien Remote Debugger. La prise en charge de Hermes, JSI et de la New Architecture ne figure pas dans la version 0.14.0.
Quelle version de React Native faut-il ?
React Native Debugger 0.11 et ultérieur nécessitent react-native 0.62 ou ultérieur. Pour les anciens projets, la version 0.10 fonctionne avec react-native 0.61 et antérieur.
Quelle version de macOS faut-il ?
La version 0.14.0 nécessite macOS 10.13 ou ultérieur.
Fonctionne-t-il sur Apple Silicon ?
Oui. Le téléchargement pour Mac est une app universelle pour Apple Silicon et Intel.
Comment connecter mon app ?
Fermez les autres clients de débogage, ouvrez React Native Debugger, puis activez Debug JS Remotely dans le menu développeur de votre app.
Quel port utilise-t-il ?
Il se connecte par défaut au proxy de débogage sur le port 8081. Ouvrez une nouvelle fenêtre avec Command+T pour choisir un autre port.
Quels outils sont inclus ?
React Inspector, Redux DevTools et Apollo Client DevTools sont inclus.
Puis-je l’installer avec Homebrew ?
Oui. Exécutez : brew install --cask react-native-debugger
D’où vient le téléchargement de React Native Debugger sur react-native-debugger.FULLMAC.app ?
Le bouton de téléchargement mène à la page officielle des versions de React Native Debugger à l’adresse https://github.com/jhen0409/react-native-debugger/releases/latest. react-native-debugger.FULLMAC.app ne modifie ni ne réempaquette l’app.
Apps similaires
OrbStackOrbStack est une façon rapide, légère et simple de faire tourner des conteneurs Docker et des machines Linux sur votre Mac. C'est un remplacement direct de Docker Desktop : vos commandes docker et docker compose continuent de fonctionner, et au premier lancement OrbStack propose de reprendre vos conteneurs, images et volumes de Docker Desktop. Il démarre en quelques secondes, utilise moins de 0,1 % de CPU en arrière-plan sur Apple Silicon et rend à macOS la mémoire inutilisée. En plus des conteneurs, il fait tourner des machines Linux complètes issues de 16 distributions et un cluster Kubernetes léger pour le développement local. OrbStack est développé par Orbital Labs.Outils de développement
QuotaBarSi vous utilisez OpenAI Codex avec un compte ChatGPT, les limites d’utilisation se réinitialisent sur une fenêtre de 5 heures et une fenêtre hebdomadaire, et pour savoir ce qu’il vous reste, il faut ouvrir Codex ou ChatGPT. QuotaBar affiche le pourcentage restant dans la barre des menus du Mac et l’actualise toutes les 60 secondes. Cliquez sur l’icône pour un panneau détaillé avec chaque fenêtre de limite et son décompte, ou activez un petit HUD flottant qui reste au-dessus des autres fenêtres.Outils de développement
Stargazer BarStargazer Bar est une petite app native de barre des menus pour Mac qui surveille des dépôts GitHub pour vous. Elle affiche un compteur d’étoiles en direct dans la barre des menus, pour voir comment se porte un projet sans garder un onglet de navigateur ouvert, et un clic ouvre un menu avec les détails : courbes d’évolution des étoiles et des forks, totaux de téléchargements des versions et un radar de maintenance. Les dépôts publics se mesurent à leurs étoiles. Les dépôts privés, qui n’en ont pas, se mesurent à ce qui demande votre attention : un build en échec, une issue sans réponse ou une nouvelle pull request.Outils de développement
Notch So GoodNotch So Good transforme l’encoche de votre MacBook en petit écran d’état pour les agents de programmation IA. Pendant que Claude Code ou la CLI OpenAI Codex travaille, une pilule noire prolonge l’encoche : à gauche se tient Peek, un personnage en 3D, et à droite un anneau indique ce qu’il reste de votre fenêtre d’utilisation de 5 heures. Plus une session a besoin de vous, plus Peek sort de l’encoche. Quand une tâche se termine, échoue ou atteint une limite d’utilisation, l’encoche s’ouvre sur une carte qui dit ce qui s’est passé et dans quel projet, et un clic mène à l’onglet exact du terminal, volet tmux compris.Outils de développement
Claude UsageClaude Usage est une petite app native pour celles et ceux qui utilisent Claude Code. Dans la barre des menus, elle affiche votre session de cinq heures en cours, votre usage hebdomadaire pour tous les modèles et pour Sonnet, et vos crédits à l’usage, chacun avec une barre et son heure de réinitialisation, sans ouvrir Claude Code. Elle ajoute aussi une ligne sous votre invite Claude Code avec le modèle, le taux de remplissage de la fenêtre de contexte et les tokens utilisés, pour compacter une session avant qu’elle ne manque de place. Chaque volet de terminal affiche sa propre ligne, y compris dans tmux.Outils de développement
TintpadTintpad est un lanceur gratuit et open source pour les développeurs qui travaillent avec des agents de programmation en ligne de commande comme Claude Code et Codex. Appuyez n’importe où sur Option-Commande-Espace et une goutte noire tombe de l’encoche de votre Mac, ou pend sous la barre des menus sur les Mac qui n’en ont pas, avec vos dépôts à l’intérieur. Tapez quelques lettres, appuyez sur Retour et votre propre terminal s’ouvre dans ce dépôt avec l’agent déjà lancé, dans le mode que vous y avez utilisé la dernière fois.Outils de développement
FULLMAC.app n’héberge pas cette app. Les boutons de téléchargement mènent aux pages du développeur.