Então, foi uma introdução ao React Native e expo, mas acho importante que você entenda com o
que está trabalhando antes de começar.
Agora, com isso, é hora de começar e, para isso, visite a expo. io. Lá você pode clicar em
começar e você encontrará os passos iniciais aqui.
Agora você realmente não precisa desse primeiro passo,
podemos ir direto para o passo número dois, que é que você precisa do NodeJS. Agora você precisa do NodeJS, que é um tempo de execução Javascript que
permite, por exemplo, construir aplicativos do lado do servidor com Javascript. Você não precisa disso porque estamos prestes a
escrever qualquer código NodeJS neste curso, não é
um curso
Node, não se
preocupe, você não precisa conhecer o NodeJS, mas é um pacote que nos permite executar JavaScript em nossa máquina. e por
exemplo, o expo client nos bastidores também roda em Javascript,
não é totalmente relacionado ao React Native,
é só para essa ferramenta funcionar corretamente.
Também para este comando instalar a ferramenta, npm, esse é o Gerenciador de
Pacotes do Nó e também disponibilizado pelo NodeJS.
Então, o primeiro passo é que você visite o nodejs. org e lá, baixe a
última versão, no meu caso 12. 6 de lá para começar e qualquer que seja sua
última versão quando você está vendo isso, simplesmente
baixe essa versão, instale-a, ela te dá um instalador normal, você pode simplesmente percorrer todos esses passos
lá, nada muito chique.
Está disponível para MacOS e Windows e Linux.
Então, basta baixá-lo aqui, percorrer o instalador e, uma vez instalado, você pode seguir para a
terceira etapa aqui.
Então, com o NodeJS instalado, vamos copiar esse comando aqui e então abrir o seu terminal normal ou no
Windows, seu prompt de comando e colar esse comando aqui.
Agora no Mac e Linux, você pode precisar adicionar um sudo na frente disso, no
Windows isso não será necessário, para obter as permissões corretas.
Então aqui eu vou
entrar, então você pode ser solicitado para a sua senha, basta inseri-lo se você
estiver e agora isso vai instalar a expo CLI que é essa ferramenta que nos ajuda a criar
e gerenciar projetos React Native com a ajuda da expo globalmente em sua máquina, para que você possa usá-lo
em qualquer lugar
em sua máquina, de qualquer lugar em seu terminal.
Então, vamos esperar que esta instalação seja concluída,
você pode ignorar qualquer aviso que você possa estar recebendo e eu volto assim que
a instalação terminar.
Você também pode ignorar tais erros intermediários aqui, desde que o global não trave com um erro,
mas termine com uma mensagem como esta no
final, você foi bem sucedido.
Então, com isso, temos a Expo CLI instalada, o próximo passo é criar o nosso projeto, então o passo número
quatro aqui.
Fazemos isso executando expo init e,
em seguida, qualquer nome de projeto de sua escolha e, para isso, antes de tudo, certifique-se de usar o comando cd para navegar
até a pasta aqui em sua máquina onde deseja criar esse projeto. Então eu fiz isso aqui, eu estou nessa pasta e
agora eu posso rodar o expo init e eu vou nomear esse rn-primeiro-app porque é o nosso
primeiro aplicativo React Native aqui afinal de contas. Basta apertar enter, esse nome, claro, depende totalmente
de você e
você criará uma nova pasta no local onde você executou este comando e configurou um
aplicativo React Native usando o expo.
Agora você provavelmente é perguntado qual modelo você deseja usar e lá
você pode ir com o modelo em branco por enquanto.
Certifique-se de não escolher o mínimo, porque isso seria uma configuração sem o ambiente expo com todos os
recursos de conveniência,
então definitivamente vá em branco aqui.
Agora, provavelmente você será solicitado a inserir um nome para o seu aplicativo e eu adicionarei o rn-first-app aqui,
que
é o nome exibido no alternador de tarefas do seu aplicativo na tela inicial e
em breve.
Você pode deixar a lesma como é e simplesmente apertar enter novamente,
agora eu também estou usando fio na minha máquina, que é uma alternativa para npm, você pode não ser perguntado se você
quer usar o fio que é
totalmente bem, eu vou também não escolha aqui
para usar o npm e, portanto, agora, vá em frente, crie a pasta deste projeto, instale todas
as dependências necessárias como React e React Native e nos dê um projeto React Native que podemos usar para construir um aplicativo
nativo.
Então vamos esperar que isso termine agora.
Agora, quando terminar, você verá as próximas instruções aqui. Você pode navegar para a pasta recém-criada com
o comando cd e, em seguida, simplesmente executar o npm start. O Npm start iniciará a ferramenta de
desenvolvimento expo, as ferramentas expo dev e uma nova guia deverá abrir no seu navegador.
Aqui está essa aba que abriu, se você tiver algum problema aqui, você pode ignorar
isso por enquanto, isso aqui é a ferramenta de desenvolvimento expo ou as ferramentas expo dev como é chamado.
É uma janela que permite que você execute seu aplicativo em diferentes dispositivos conectados ou adicione simuladores e permite que você gerencie partes
do seu aplicativo em geral. Você vê alguns resultados do seu aplicativo aqui, alguns avisos que você pode
estar recebendo e isso é muito
conveniente. janela para gerenciar seu aplicativo e para executar seu aplicativo. Agora também certifique-se de que aqui
no terminal onde você executou o npm start, você deixará o processo em execução.
Você pode ver que ele não terminou, você não vê aquela linha de entrada novamente onde você pode inserir
comandos, ao invés disso, você não pode digitar ou você pode pressionar alguns dos atalhos que você vê aqui, mas você não pode
digitar novos comandos.
Você sempre pode sair desse processo apertando o controle e simultaneamente ao mesmo tempo, mas deve deixar
esse processo em execução enquanto estiver trabalhando em seu projeto
e, se estiver pronto para o dia, poderá encerrá-lo e reiniciá-lo. no dia seguinte, porque
esse processo também assistirá ao seu código e, sempre que você alterar algo no seu código
e salvar essa alteração, ele será salvo automaticamente e publicado no seu dispositivo conectado.
Mas falando nisso, vamos conectar o dispositivo e, para isso, a maneira mais fácil de começar é
usar o seu iPhone ou Android que você possui.
Então, no meu caso, é um iPhone aqui e aqui está meu telefone real e eu estou na App Store, agora é em alemão porque eu tenho um
telefone alemão, mas esta é a App Store normal. Agora, você pode ir
até a área de pesquisa e pesquisar por expo. Agora, uma vez que você fez isso, você deve encontrar o cliente expo aqui e você
pode simplesmente fazer o download para o seu dispositivo, é livre para usar. Basta instalá-lo no seu dispositivo e esperar que esta instalação termine,
e assim que terminar, você
pode abrir isso e agora com o
aplicativo expo instalado, você não precisa se inscrever aqui, em vez disso no Android você deve poder para digitalizar esse código
de barras diretamente de dentro do seu aplicativo expo. No iOS, basta abrir o aplicativo da câmera
e você também pode ir para as ferramentas de desenvolvimento aqui e você verá esse código de
barras aqui, basta segurar a câmera no iOS ou no scanner de aplicativos da expo aqui no Android e você será solicitado se você deseja
abrir um aplicativo na expo então. Basta abrir aberto lá e agora
isso deve abrir seu aplicativo aqui no expo cliente que você
instalou, novamente sem inscrever-se, apenas segurando sua câmera do iPhone sobre esse código de barras ou no Android, fazendo isso
diretamente dentro do aplicativo expo onde você terá essa opção para o fazer.
Então agora isso vai construir o pacote Javascript como você vê aqui na parte inferior ou
colocar em outras palavras, isso agora vai levar o seu aplicativo e compilá-lo basicamente e prepará-lo e carregá-lo aqui sobre os servidores
do expo em seu aplicativo e você pode simplesmente bater consegui-lo aqui na primeira tela e, em seguida, este é o seu aplicativo
inicial React Native.
E agora vamos realmente ver o código para isso e ver como podemos mudar alguma coisa no código para
ver algo diferente aqui nesta tela.