Usar react-devtools para debug en React Native

Es importante hacer debug y es bien sabido que React Native te permite ir cambiando el código así como ir viendo en vivo los cambios pero que pasa si además de esto quieres hacer debug y modificar el código en el debug sin necesidad de cambiar el código (al menos no en ese momento) y además poder igualmente ver los cambios en vivo.

Con esto tendrías una pantalla similar a la siguiente:

react-devtools

Así mismo en la pestaña de la derecha puedes obtener información de props y modificar la misma.

Para instalarlo es súper sencillo, solo debes instalarlo de forma global con npm

npm install -g react-devtools@^4

Y posteriormente agregarlo en tu proyecto de React Native

yarn add react-devtools

Por último en tu package.json agregas la línea en la parte de scripts de debug:

"devtools": "react-devtools"

Para probarlo simplemente inicias tu proyecto

react-native run-ios

Y por último correr devtools

npm run devtools