Debug REACT NATIVE no VS CODE e Flipper (Debugging Network, Componentes e Performance)

Publicado el: 26 enero 2023
en el canal de: Coffstack
5,837
261

Chega de console.log() para debugar o seu código! Nesse vídeo apresento 3 ferramentas incríveis para fazer você depurar (debugging) seu App React Native de forma profissional!

A primeira ferramenta é uma extensão do VS Code chamada React Native Tools. Ela permite você utilizar breakpoints e chegar valores de estado e propriedade dentro do próprio VS Code.

A segunda, é a React DevTools. Com ela você pode checar em tempo de execução toda a árvore de componentes com suas respectivas propriedades. Além disso, ela também conta com um “Profiler”, um analisador que nos ajudar a verificar a performance dos componentes, ou seja, em que condições e quanto tempo cada um deles está sendo renderizado.

Por último, temos o Flipper. Dentre muitas utilidades, a que mais me chama atenção é o Network Inspector, uma interface robusta e intuitiva para você checar todas as chamadas a API que seu App está fazendo. Um verdadeiro raio-x da sua camada de rede!

Acredito que todo profissional que usa diariamente o React Native deveria conhecer essas ferramentas, pois, elas tornam o trabalho mais simples e produtivo.

✅ VOCÊ TAMBÉM VAI GOSTAR DESSES VÍDEOS:

▸ Guia de Estudo REACT NATIVE 2023 (Roadmap PROFISSIONAL)
   • Guia de Estudo REACT NATIVE  2023 (Ro...  

▸ Do ZERO ao EXTERIOR na PROGRAMAÇÃO (com Igor Ramos)
   • Do ZERO ao EXTERIOR na PROGRAMAÇÃO (c...  

▸ Curso Teste Unitário no React Native (React Native Testing Library)
   • Curso Teste no React Native (React Na...  

✅ REDES SOCIAIS:

Instagram: @coffstack
  / coffstack  

TikTok: @coffstack
  / coffstack  

Twitter: @coffstack
  / coffstack  

Blog/Artigos
https://blog.coffstack.com/

Instagram: @lucasgar6
  / lucasgar6  


00:00 - Introdução
01:38 - React Native Tools (VS Code)
03:21 - Breakpoint - Pausa na Execução
06:47 - Inspecionando Componentes
09:53 - Debug Performance - Profiler
14:21 - Flipper - Debug API (Network Inspector)
18:41 - Recado Final!


#reactnative #debug #vscode #flipper #programação #desenvolvedor #reactjs


En esta página del sitio puede ver el video en línea Debug REACT NATIVE no VS CODE e Flipper (Debugging Network, Componentes e Performance) de Duración hora minuto segunda en buena calidad , que subió el usuario Coffstack 26 enero 2023, comparta el enlace con amigos y conocidos, en youtube este video ya ha sido visto 5,837 veces y le gustó 261 a los espectadores. Disfruta viendo!