Fala mestre beleza no vídeo de hoje nós vamos criar aqui um projeto usando Expo né E esse projeto ele vai rodar tanto no Android quanto no iOS nós temos também a opção de ir para web né mas por enquanto a gente vai ficar só no Android e no iOS Então esse projeto ele vai fazer o uso basicamente do react Nate né para estar gerando aí esse essas versões esse esse código híbrido né que vai rodar tanto no iOS quanto no Android tá então no final desse vídeo a gente vai ter aí um projeto né que
a gente vai conseguir testar ele tanto no Android quanto no iOS de uma forma muito prática por conta do Expo né Por conta ali da do todo o ambiente épico que facilita isso aí muito pra gente tá então antes da gente ir para o vídeo Eu gostaria de pedir que você deixa o like no vídeo se inscreva no canal e também clique no Sininho né que o YouTube te manter atualizado e também acompanha a gente aí em todas as nossas redes né os links estarão aí na descrição Beleza então meu nome é Jansen eu sou
desenvolvedor aqui na Mestres e bora lá para mais um conteúdo [Música] bom então eu estou aqui né na documentação do Expo né que é uma documentação muito boa tá excelente documentação e aqui no início nós já temos aqui a parte de da Aba que lateral né na esquerda nós já temos aqui todo o tutorial para instalação é que a gente já vai pular para cá mas eu recomendo que você dê uma olhada né deu uma explorada aqui no site dele porque realmente é muito interessante tem muita coisa tá é que eu tô na parte de
documentação a gente pode vir aqui para o home deles né que seria vai carregar aqui a home né que aqui no site vai falar tudo sobre ético né com muito detalhe com muita coisa então né Recomendo muito que você dê uma olhada aí tá mas a gente vai vir aqui direto para a documentação para a parte de instalação tá então os requisitos aqui para instalar o Expo é basicamente o note né o node e Git para controlar a versão né o Ótimo para quem tá usando o Linux ou Mac e o node nós já temos
um tutorial aí né de instalação configuração do ambiente usando aí o ambiente java script né que inclui aí o node a gente tem também o visual Studio code né então tem bastante coisa aí e já que vai Preencher esses requisitos aí então com o node instalado é bem simples a criação do projeto tá então aqui tem um tutorial específico para criação de projeto né Create New Project clicando aqui ele vai mandar a gente aqui para um passo a passo tá então mas basicamente o que a gente vai ter que executar é cnpx cliente Apple traz
traz template tá então eu vou copiar esse comando aqui e eu vou vir aqui para o nosso code tá eu criei aqui um diretório chamado Expo né Para a gente criar o projeto e o que a gente vai precisar de abrir o terminal tá então você pode clicar o novo terminal ou usar o atalho tá E aqui no terminal você pode colar aquele código tá npx CLT Xbox atrás template é lembrando npx é um módulo download né então quando você instalar o note JS você vai ter o npx e lá no site você consegue né
clicar aqui no link no GS para já pegar o fazer o download né aí do download e instalar ele tá então esse é todo esse comando ele contraste template ele vai perguntar para a gente qual template que nós queremos né iniciar aí o nosso projeto é e eu tô usando esse traçar template para a gente usar aqui para a gente usar aqui o template do Type script tá porque a gente vai querer executar Esse projeto aí iniciar a maioria dos projetos aqui a gente vai estar trabalhando com type script tá então eu vou escolher aqui
o template Blank né sem nada script tá ele vai perguntar o nome do projeto Eu Vou Chamar esse projeto aqui de mestres tá É e aqui basicamente isso e ele já vai instalar as dependências aí do nosso projeto é criar o projeto em si tá então o que a gente pode aguardar para ele fazer toda a instalação aí e criação dos arquivos bom então aquele finalizou né a criação ele fez a instalação aqui de alguns pacotes né e apertar até avisou aqui que existe uma nova versão do Creed Expo app porque eu já tinha né
instalado aqui na minha máquina mas para você que vai executar aí pela primeira vez ele vai pegar a versão mais recente tá então uma vez criado o projeto né como eu dei o nome do projeto em Mestres Ele criou um diretório né chamado Mestres com os arquivos aqui do projeto então aqui de cara ele já pede para a gente mudar o diretório né para esse diretório Mestres para executar os comandos né No meu caso aqui como a gente tá no pescou e vou clicar em arquivo e abrir abrir diretório né caso que eu tô no
diretório é tipo vai abrir aqui o diretório mestres que foi o que ele criou vou selecionar né essa esse diretório e ele já vai abrir aqui dentro do projeto né ele gerou aqui esse ponto vias code é coisa do da ide né então não tem problema e aqui na raiz do projeto tá a gente não vai falar nada agora da estrutura do projeto do que que são esses arquivos né O que que cada coisa faz É nesse vídeo é só mesmo para criar o projeto e executar ele tá então na aula passada não vou me
lembrar Qual a ordem que saiu as aulas mas a gente tem uma aula aí sobre configuração do emulador a gente instalou um emulador Android para a gente tá fazendo esses testes tá Então nesse caso aqui né como a gente já tá com o emulador Android instalado e configurado a nossa máquina ao executar o Expo Ele já vai reconhecer que eu tenho um emulador ou pode ser também o iOS simulador que ele vai reconhecer que está instalado e já vai abrir o respectivo ali emulador para tá rodando o nosso projeto nele tá então aqui o que
que eu vou fazer se a gente olhar aqui em Packet Jason tá nós temos aqui um script né que ele vai rodar aqui o comando X por start tá então eu posso executar aqui um npm npm Run start né eu posso executar npm start para executar esses clipes de start ou eu posso executar npx por start tá que ele vai executar aí ele vai fazer a inicialização né vai criar aí o budle vai iniciar o metrobus né do Expo que ele vai basicamente basicamente o que que ele vai fazer ele vai pegar o nosso código
fonte né que tá em Java Script e vai transformar esse código aí no não respectivo código para plataforma que a gente vai querer executar né então se eu for executar no Android ele vai transformar esse código clipe esse bander em o código nativo do Android ou no iOS né ele vai fazer essa transformação para a gente então quando a gente faz o start né que a gente inicia esse servidor né que isso aqui é um servidor é a gente consegue fazer a conexão tá então ele gerou aqui para mim um QR Code tá E esse
QR Code é para ser usado com o aplicativo Expo GO e nós temos aqui as opções né eu posso pressionar a tecla a para abrir esse projeto no Android né eu posso pressionar a tecla I no caso seria para abrir no iOS como eu não tenho emulador iOS aqui não apareceu a opção Tá e por enquanto vai ser isso né quando a gente rodar o Android a gente vai ver as outras opções mas aqui eu vou pressionar a tecla a ou então se eu tiver o se eu quiser testar no celular físico né Eu posso
fazer a instalação do aplicativo Expo go e daqui a pouco eu vou mostrar para vocês no na documentação deles mas com esse Aplicativo instalado Nego você abre o aplicativo e seleciona lá para ler o QR Code né você consegue ler esse QR Code e o aplicativo que você tá desenvolvendo você vai conseguir ver ele funcionando no seu celular né no seu dispositivo ali físico na sua mão né O que é muito bom tá é muito prático tá então no meu caso aqui eu vou pressionar a tecla a né e ele vai abrir aqui o meu
emulador Android para executar esse meu projeto tá então aqui nesse caso ele vai instalar olha só tá instalando o xpogou nesse meu emulador então ele usa o próprio aplicativo expogo para rodar o projeto próprio projeto local né para funcionar aí nos emuladores tá então quando ele instala aqui na verdade já instalou ele vai agora né ele tá transformando esse código meu JavaScript no código que roda no Android e aqui nós já temos o aplicativo tá ele tá dando aqui um Hello shop para o lado para minha câmera não atrapalha na verdade eu vou puxar a
câmera para a esquerda certo então aqui ele vai dar um olá para gente né o celular que é do próprio Expo go tá a gente clica aqui em goret e ele tem aqui esse menu tá nesse menu que é do próprio expogol tá para a gente conseguir recarregar o app tem aqui Fast Flash the Burger performance morto que a gente vai explorar isso aqui melhor tá mas por enquanto a gente pode fechar esse modal aqui E esse aqui é o nosso app essa tela branca com esse texto aqui é basicamente o template que a gente
criou a gente escolheu lá né o template Blank né que não vem não vem nada só vem esse texto então se eu vier aqui no arquivo é ponto tsx tá e a gente olhar aqui nós temos aqui ó vou fechar o terminal por enquanto até uma tag de texto né escrito aqui Open state working eu vou apagar isso aqui e vou digitar um Olá mestre e quando eu salvo isso aqui ele vai atualizar o meu aplicativo no caso aqui no emulador se você tivesse com celular físico né ele iria atualizar também né então de acordo
a gente vai desenvolvendo e salvando a gente vai conseguindo ver o tudo todas as alterações aqui no nosso app de uma forma muito prática né muito rápida Beleza então para finalizar eu vou voltar aqui na documentação deles eu vou Minimizar aqui o emulador nós temos aqui né na parte lateral que esquerda o xpogou tá coluna que é que ele vai falar mais sobre o aplicativo né como expogol funciona enfim tem muito detalhes aqui e tem também os links para download né tanto na Play Store quanto na App Store do iOS tá então essa essas duas
ferramentas né tanto é tipo ali para gerenciar o nosso projeto quanto o xpogou facilita muito essa etapa de desenvolvimento e também teste né porque se a gente pensar por exemplo em um time de desenvolvimento o pessoal do criado é o pessoal do teste vai conseguir acessar o nosso aplicativo através de um link né que a gente vai mandar para eles ou um QR Code e eles vão conseguir testar o nosso app de uma forma muito prática muito rápida e para fazer Deploy também né que seria a parte final ali de entrega do aplicativo para as
lojas o Expo facilita também muito a nossa vida tá então é um Framework aí muito interessante ele fornece também vários serviços para gente que tudo isso a gente vai estar explorando aí Ao decorrer dos vídeos tá então para essa aula aí é isso eu espero que eu tenha ajudado qualquer dúvida pode estar deixando um comentário logo abaixo e é isso aí muito obrigado e até a próxima [Música]
