Café e código

O básico de React Native 📱

Olá ouvintes do CoderCast, Me chamo Micael Pereira e nesse podcast vou falar sobre React Native, vamos surfar nesse hype e comentar o que é? E alguns outros pontos.
Vamos ao cast para conversarmos sobre.

Como de costume do CoderCast, separei o cast em 5 pontos importantes. Vamos aos pontos.

1- O que é React Native?

React Native é um framework JavaScript para criação de aplicativos mobile nativo. Ele usa a biblioteca React e possui muitos componentes e API’s construídos.

A vantagem é. Se a pessoa já desenvolve com React a curva de aprendizado é pequena. Pois continuará, trabalhando com React. Porém terá diferenças, a principal será na hora de assinar o aplicativo quando for publicar nas duas principais lojas, a do Google e da Apple.

2- React Native gera apps nativos

Com React Native, você não cria um web aplicativo ou um aplicativo hibrido.
Você cria um aplicativo realmente nativo, indistinguível dos criados com swift, Java ou Kotlin.

A vantagem disso é performance. Você vai usar tecnologias da web como JavaScript. E na hora de gerar seu app você terá a performance de um aplicativo nativo e não de um WebView.

3- Usando especificas UI para IOS e Android

Como falei no tópico anterior ao contrário de aplicações web, o React Native não utiliza o DOM do navegador para representar os elementos da UI, ele realiza chamadas nativas. Esta comunicação entre o React Native e o Nativo é feita por uma ponte que conecta o nativo com o JavaScript. No react temos tres threads. A principal, a de JavaScript e a nativa e nenhuma bloqueia a outra.
Vamos ao papel das três threads:

  • Principal: Responsável por tratar as requisições responsáveis pela renderização de elementos na tela;
  • JavaScript: Responsável pela lógica de negócio da aplicação e definir a nossa UI;
  • Nativa: Reponsável pelos cálculos referentes ao layout.

O Nativo não sabe interpretar o JSX.
Desta forma o React Native transforma o nosso elemento JSX, para uma linguagem de marcação.
Que pode ser entendida pelo nosso processamento nativo. Esta linguagem de marcação irá determinar como o elemento de nossa UI deverá ser.

4- Como trafegar os dados com React Component

Os dados dentro dos componentes do React são gerenciados por state e props.
O state é mutável, enquanto as props são imutáveis. Isso significa que o state pode ser atualizado no futuro, enquanto as props não podem ser atualizadas.

Eu gosto de resumir o paragrafo anterior da seguinte forma:
props é para passar valor para outro componente e state para manter o valor dentro do seu componente. Se houver uma mudança de valor será no state. Porque, só muda o valor dentro do componente.

5- Diferentes tamanhos de tela

Para não ter problemas com diferentes tamanhos de telas o React Native oferece Flexbox suporte.

Para obter o layout desejado, o flexbox oferece três propriedades principais:

  • flexDirection (determina o eixo primário do layout deve ser organizado horizontalmente ou verticalmente o padrão é verticamente);
  • justifyContent (determina a distribuição dos itens ao longo do eixo primário. Podendo ser distribuido no início, no meio, no final ou espaçados uniformemente);
  • alignItems (determina o alinhamento de acordo com o eixo secundário, podendo o eixo primário ser horizontal ou vertical. Podendo os itens estarem alinhados no início, centro, final ou esticado para preencher).

6- Quem está usando?

Essa é a pergunta que influencia muitos devs, porém o principal é observar quantas empresas estão usando nos seus produtos principais.
Já vi desenvolvedores deixando de usar React Native porque o Airbnb parou de usar.
Porem o desenvolvedor nem procurou ler, quais eram as dificuldades da empresa em questão.

Devemos sempre pensar o seguinte!
A tecnologia que vou usar é boa para resolver um problema. A comunidade é ativa. Esses são os fatores relevantes.

O link para ver as empresas que estão usando React Native está na descrição desse CoderCast ele é http://bit.ly/react-native-cast

Chegamos ao final de mais um CoderCast, agora já sabemos o básico de React Native. Eu sempre coloco links de curso e livros relacionados ao assunto no final da descrição do Podcast.

O CoderCast é feito por duas pessoas eu Micael Pereira, na apresentação e, você aí. 
Tem mais algum item para acrescentar, que você acha que esqueci de colocar?
Deixe nos comentários. Fale comigo no twitter, instagram ou e-mail. No Twitter eu sou o  @MicaelPereira_. No Instagram @guiadev_ me siga lá e comente sobre o podcast com seus amigos devs, ajudando o crescimento do CoderCast.
E o meio de comunicação bem antigo, que ainda respondo é o e-mail. Para entrar em contato o e-mail é [email protected]

Link dos cursos:

Link dos livros:

Comentários no Facebook