Instalando o Flipper (React Native) no Windows 10
Como um programador Web, quando cheguei no ambiente de desenvolvimento Mobile tive bastante dificuldade em debugar minhas requisições do meu App em React Native com o meu Backend em Node.js. Com isso, me foi apresentado o Flipper, um Desktop App desenvolvido pelo Facebook. Caso queira saber mais sobre a ferramenta, acesse https://fbflipper.com
Neste artigo irei mostrar como instalar e começar a usar o Flipper no Windows 10. “Ah, Luiz! Por que no Windows?” Porque atualmente estou com uma máquina Windows e sei que muitas pessoas que estão começando estão nesse sistema operacional, apesar de saber que não é o mais indicado quando se está desenvolvendo.
Instalando o Flipper
Primeiramente, precisamos baixar o .zip do Flipper direto da documentação oficial: https://fbflipper.com/docs/getting-started/index/
Caso queira encurtar o caminho, basta clicar neste link para baixar: https://www.facebook.com/fbflipper/public/windows
Com isso, será baixado um arquivo .zip e basta você extraí-lo onde você bem quiser. Dentro dele, há um executável com nome Flipper.
Ao clicar no executável, você abrirá um App parecido com este:
Pronto, você já tem o Flipper instalado, porém ainda precisa instalar duas outras ferramentas para poder ter acesso a todos os “superpoderes” do Flipper.
Instalando o Chocolatey
Caso você não tenha o Chocolatey instalado no seu Windows, recomendo baixar pelo link: https://chocolatey.org/install
O Chocolatey é um gerenciador de pacote para o Windows e facilita a vida em muitos casos de necessidade de instalar algumas ferramentas.
Ao fim da instalação, você deve poder rodar no seu terminal o comando choco version e retornar a versão instalada do Chocolatey.
Instalando o OpenSSL
A primeira ferramenta que precisamos instalar para poder utilizar bem o Flipper é o OpenSSL. Existem várias formas de instalá-lo, mas a mais simples que encontrei e resolveu meu problema é através do comando choco install openssl no terminal Windows Powershell com permissão de administrador.
Instalando o Watchman
A segunda ferramenta que precisamos instalar é o Watchman, que vai ajudar a gente a monitorar nossas requisições pelo Flipper. Como o OpenSSL, existem várias formas de instalá-lo, mas usaremos o Chocolatey mais uma vez.
Basta rodar o comando choco install watchman no terminal Windows Powershell com permissão de administrador.
Pronto! Com isso, seu Setup Doctor no Flipper (Opção presente na barra lateral esquerda no Desktop App com o ícone de maleta médica) deve estar desta forma:
Não abordei a instalação do SDK Android neste tutorial, pois considero que você já está desenvolvendo em React Native normalmente.
Pra finalizar, segue um print exemplo da opções que temos no Flipper e dentre elas, a mais poderosa (Fonte: Vozes da minha cabeça) para monitoramento do Network e requisições do App.
Muito obrigado por ler até aqui. Este é o primeiro de muitos artigos que pretendo escrever, na medida que eu for desbravando o mundo da programação!
Abraços!
