React Native

De Open Source Software

React Native

Logo React Native, Framework criado pelo Facebook

React Native é um framework para JavaScript. O projeto foi desenvolvido por engenheiros do Facebook. Ele contém diversas ferramentas que viabilizam a criação de aplicativos móveis nativos para a plataforma iOS, Android e ainda para WEB, tudo isso utilizando o mesmo código para ambas plataformas.

LICENÇA

O Facebook disponibiliza o React Native com a licença MIT License, ou seja, é permitido usar, copiar, modificar, mesclar, publicar, distribuir, sublicenciar e/ou vender cópias do Software e permitir pessoas a quem o Software, contudo é necessário o aviso direitos autorais e este aviso de permissão devem ser incluídos em todos cópias ou partes substanciais do Software. A documentação do React Native é licenciada pela Creative Commons, conforme encontrado no arquivo LICENSE-docs.

Link: https://github.com/facebook/react-native/blob/master/LICENSE

HISTORIA DA LICENÇA

O Facebook usava um conjunto de licenças chamado "BSD + Patents" em grande parte de seus projetos de código aberto, que incluem, obviamente, o React. Isso significa que mesmo sendo um código aberto, o Facebook ainda tem os direitos autorais. Por exemplo, você desenvolve um projeto usando o software licenciado "BSD + Patents". De inicio tudo pode ocorrer bem, porém se o Facebook decidi lançar um produto concorrente ao seu? Mesmo que eles possam estar violando suas patentes, a concessão da patente afirma que você não pode processá-los, a não ser que você deseje perder a licença de patente. Restando apenas uma outra única opção que é apressada, cara e complicada, que ser migrar para outro framework. Isso basicamente significa que o Facebook tem imunidade em relação a quem usa seu software.

Porém em Setembro de 2017, o Facebook anunciou que o React se tornaria licenciado no MIT (React License). Isso se tornou realidade em 16 de fevereiro de 2018, o que significa que todos os produtos relacionados ao React estão agora sob licença MIT. Essa mudança ocasionou pois o diretor de engenharia do Facebook, Adam Wolff, havia argumentado que este sistema DE licenciamento tinha o objetivo de evitar o risco de litígios sobre patentes ou seja conflito de interesses ou controversas, ele disse que "se essa licença fosse amplamente adotada, poderia realmente reduzir o litígio sem mérito para todos os adotantes", contudo, isso se demostrou controverso. Além disso, como nesse cenário as opções são migrar rapidamente do React ou simplesmente perder seus direitos por completo, não é surpresa que houvesse recomendações fortes para não usar o React para começart e recorrer a outras estruturas. Para se ter uma noção a fundação Apache proibiu o React em julho de 2017 e o WordPress declarou relutante em usá-lo para projetos futuros. Após muita discussão e pressão da comunidade, o Facebook trocou a licença e as empresa podem finalmente usar o React e o React Native sem o risco de serem processados ​​pelo Facebook ou perder suas patentes.

A COMUNIDADE

Há um núcleo do Facebook trabalhado integralmente com o React Native, porém existem muito mais pessoas na comunidade que fazem contribuições importantes e consertam as coisa. É possível a comunidade procurar por relatórios de bugs ou reportá los caso encontrem alguma falha. A equipe principal deste núcleo é composto por 15 pessoas, elas são,@Eli_White, @cpojer, @mdvacca, @shergin, @fkgozali, @yungsters, @hectorramos, @peterargany, @emilyjanzer, @ramanpreetnara, @sahrens2012, @rickhanlonii, @lunaleaps, @joshuaisgross, Mehdi Mulani (não possui twitter). Para conhecer os membros desse projeto ou saber mais sobre o projeto eles possuem um site para manter a comunidade informada e se aproximar dela, para acessar clique aqui.

Toda a equipe principal do React Native em uma sala, respondendo a perguntas!

Eles também possuem um canal oficial para manter a comunidade atualizada, por meio da conta React no Twitter contando as novidades e futuras features, além disso existem diversos Meetups de React Native que acontecem ao redor do mundo. Há também a comunidade Reactiflux Chat com diversas pessoas prontamente para ajudar, com especialistas a disposição e um canal no discord o Reactiflux Discord, esses canais usados para tirar duvidas com usuários, fornecer ajuda em bugs ou em problemas encontrados no decorrer de um projeto.

No ano de 2018 o React Native teve o segundo maior número de contribuidores para qualquer repositório no GitHub. Hoje, o React Native é suportado por contribuições de indivíduos e empresas em todo o mundo, incluindo Callstack , Expo , Infinite Red , Microsoft e Software Mansion. Uma estatística de 2016 mostra dados sobre o repositório do ReactNative. Naquele ano possuiam 1002 contributors committed 7,971 vezes em 45 branches com 124 releases, e era o 14º mais estrelado repositório no GitHub. Os últimos dados retirados no dia 09 de setembro de 2019 são 2026 contributors committed 18,248 vezes em 95 branches com 330 releases.

DINÂMICA DE FUNCIONAMENTO DO PROJETO

Para a contribuição no projeto o Facebook exige uma boa conduta dos colaboradores e possuem uma página com o que esperam da conduta, como por exemplo, usar uma linguagem acolhedora e inclusiva, respeitar os diferentes pontos de vista e experiências, aceitar graciosamente críticas construtivas, focar o que é melhor para a comunidade, mostrar empatia com outros membros da comunidade.

GERENCIAMENTO DE DESENVOLVIMENTO DE SOFTWARE

Para iniciar com contribuição eles disponibilizam uma lista de “bons primeiros problemas”, pode-se acessar no link clicando aqui. Conforme o usuário ganha mais experiência e demonstra um compromisso com a evolução do React Native, ele começa a receber permissões de gerenciamento de problemas no repositório.

Existem outros modo de ajudar sem precisar escrever uma única linha de código. Como por exemplo, respondendo e lidando com questões em aberto, revendo solicitações pull para os documentos e ajudar as pessoas a escrever planos de teste.

São utilizados os problemas do GitHub onde recebem as solicitações para acompanhar os relatórios de erros e as contribuições da comunidade. Todas as alterações dos engenheiros do Facebook serão sincronizadas com o GitHub através de uma ponte com o controle interno de fontes com Facebook. As alterações da comunidade são tratadas por meio de solicitações de recebimento do GitHub. Depois que uma alteração criada no GitHub for aprovada, ela será importada primeiramente para o controle de fonte interno do Facebook e logo depois testada na base de código do Facebook. Depois de mesclada no Facebook, a alteração será sincronizada novamente com o GitHub como uma única confirmação, uma vez aprovada nos testes internos do Facebook.

PROCESSO DE PLANEJAMENTO DE PROJETO

Basicamente todo os processos são realizados pelo time do Facebook responsável pelo o React Native. Fazem o gerenciamento de quais novas tarefas precisam ser realizadas, controle de entrada de novas features, etc. A comunidade participa porem a tomada de decisões é de responsabilidade deste time. Caso a alguém da comunidade tenha uma ideia de como melhorar o React Native ou ainda deseja discutir um aspecto da estrutura, há uma reposotótio no git com essa finalidade, pode-se acessar ele por meio deste link.

Para isso, é utilizado o processo "RFC" (solicitação de comentários), que visa fornecer uma maneira consistente e controlada para que novos recursos sejam propostos e defendidos para a entrada no projeto. Ele é inspirado no repo React RFC, mas hoje nem todas as mudanças substanciais passam por esse processo, no entanto, esperasse que traga mais conscientização para a comunidade. Em seguida, os principais colaboradores se reúnem regularmente para discutir questões em andamento, com o objetivo de desenvolver propostas de soluções. O diretório principal da reunião contém notas e tópicos da reunião para este processo.

PROCESSO DE GESTÃO DE QUALIDADE

Para a garantia de qualidade do Framework as features implementado ou bugs concertados são passados por um processo. As solicitações devem ser revisadas e aprovadas usando o recurso de revisão do GitHub antes de poderem ser mescladas. Embora alguém possa revisar e aprovar uma solicitação de recebimento, geralmente consideram uma solicitação de recebimento pronta para mesclar quando a aprovação é de um dos colaboradores.

A revisão de uma solicitação pull pode levar um tempo considerável. Em alguns casos, a revisão pode levar mais tempo para ser concluída do que alguém levou para escrever e enviar as alterações. Portanto, é necessário algum trabalho preliminar para garantir que cada solicitação de recebimento esteja em boas condições para ser revisada.

Para realizar a solicitação é exigido três seções principais:

  • Um resumo. Para ajudar a entender a motivação por trás das mudanças.
  • Um changelog. Isso ajuda a escrever as notas de versão. Também serve como um breve resumo das alterações.
  • Um plano de teste. Essa pode ser a parte mais importante da solicitação. Um plano de teste deve ser um guia passo a passo reproduzível para que um revisor possa verificar se a alteração está funcionando como pretendido. Se possível seria bom anexar capturas de tela ou vídeos para alterações visíveis pelo usuário.


Uma solicitação deve passar em todos os testes antes de poder ser mesclada. Eles são executados em todos os commit no master e na solicitação pull. Uma maneira rápida de ajudar a preparar solicitações pull para revisão é procurar solicitações pull que falhem nos testes de pré-verificação e determinar se elas devem ser revisadas. O teste que falhou geralmente é listado próximo à parte inferior do codificador em "Algumas verificações foram malsucedidas".

O repositório React Native GitHub é um espelho de um subdiretório de um dos monorepos do Facebook. Portanto, solicitações pull não são mescladas no sentido tradicional. Em vez disso, eles precisam ser importados para o sistema interno de revisão de código do Facebook como um diff. Uma vez importadas, as alterações passarão por um conjunto de testes. Alguns desses testes são fundamentados, o que significa que eles devem ter sucesso antes que o conteúdo do diff possa ser mesclado. O Facebook sempre executa o React Native a partir do mestre, e algumas alterações podem exigir que um funcionário do Facebook anexe alterações internas à solicitação pull antes que ela possa ser mesclada. Por exemplo, se você renomear um nome de módulo, todas as chamadas internas do Facebook deverão ser atualizadas na mesma alteração para mesclá-lo. Se o diff for bem-sucedido, as alterações serão sincronizadas com o GitHub pelo ShipIt como uma única confirmação.

PROCESSO DE GESTÃO DE CONHECIMENTO

Para a propagação e conhecimento do React Native existem doveros Meetups que acontecem ao redor do mundo. Também há conteúdo do React Native nas React Conf, os vídeos dessas palestras podem ser encontrados on-line, já ocorreram 4 conferencias, a React Conf 2018, React Conf 2017, React Conf 2016 e React Conf 2015, a próximo React Conf ocorrerá nos dias 24 e 25 de outubro em Henderson, Nevada. Existem também o React Native Show que é uma série de vídeos da equipe React Native que abrange atualizações do React Native.

Há a comunidade Medium DevTo e a tag React Native que são lugares onde você pode compartilhar projetos, artigos e tutoriais do React Native, bem como iniciar discussões e solicitar feedback sobre tópicos relacionados ao React Native.

FUNCIONALIDADES

O React Native possui diversas funcionalidades muito interessantes que aumentam a praticidade e a produtividade do desenvolvimento. Uma delas é o Hot Reloading, que faz com que o programa fique rodando em desenvolvimento, e a cada atualização no código uma versão nova do arquivo modificado é injetado na aplicação, levando menos de 1 segundo para atualizar (mesmo com aplicações grandes e complexas). Para o desenvolvimento mobile isso é um grande passo, pois em outros [frameworks] nativos, a cada mudança no código, a aplicação precisava ser recompilada por completo, levando muito mais tempo.

Existe também a possibilidade de depurar a aplicação via Google Chrome, como se fosse uma aplicação web padrão, o que ajuda muito os desenvolvedores web que já estão acostumados a utilizar o Dev Tools. Outra feature interessante do React Native é a possibilidade de combinar seu código Javascript com algum código nativo em Objective-C, Java ou Swift, caso você queira utilizar componentes já prontos, ou otimizar alguns aspectos da sua aplicação.

IMPLEMENTAÇÃO

Os princípios de funcionamento do React Native são virtualmente idênticos ao ReactJs, exceto que o React Native não manipula o DOM através do Virtual DOM. Ele é executado em um processo em segundo plano (que interpreta o JavaScript escrito pelos desenvolvedores) diretamente no dispositivo final e se comunica com a plataforma nativa por meio de uma serialização, uma ponte assíncrona e em lote.

O React Native não usa HTML. Em vez disso, trabalha com Javascript puro com sintaxe JSX.

VERIFICAÇÃO E VALIDAÇÃO

Por meio do GitHub issues são recebidos solicitações de contribuições da comunidade e relatórios de erros. Todas as solicitações dos engenheiros do Facebook serão sincronizadas com o GitHub por meio de uma ponte com o controle interno de fontes do Facebook. As alterações da comunidade são tratadas por meio de solicitações de recebimento do GitHub. Depois que uma alteração feita no GitHub for aprovada, ela será importada primeiro para o controle interno de fontes do Facebook e testada na base de códigos do Facebook. Depois de mesclada ao Facebook, a alteração será sincronizada novamente com o GitHub como uma única confirmação, uma vez aprovada nos testes internos do Facebook. Contudo o Facebook disponibiliza um guia para testes antes da comunidade solicitar uma contribuição.

Antes da requisição o Facebook pede para os colaboradores realizarem testes. Os passos para os teste são:

TESTES DE JAVASCRIPT

Uma maneira simples de executar o conjunto de testes JavaScript é usar o seguinte comando na raiz do checkout do React Native:

npm test

Isso executará testes usando o Jest.

Deve-se também garantir que o código seja aprovado nos testes de Flow e lint:

npm run flow
npm run lint

iOS Tests

Para executar os testes no iOS, chame o seguinte script na raiz do seu checkout do React Native:

./scripts/objc-test-ios.sh test

Android Tests

Para executar os testes de unidade do Android, é necessário chamar o seguinte script na raiz do seu checkout do React Native:

./scripts/run-android-local-unit-tests.sh

Os testes de integração do Android precisam de configuração adicional. Há um passo a passo para configurar o ambiente de teste para o React Native, para acessa-lo clique aqui.

Depois de fazer isso, você pode iniciar o emulador do Android usando:

./scripts/run-android-emulator.sh

Em seguida, execute os testes de integração do Android:

./scripts/run-android-local-integration-tests.sh

Testes de ponta a ponta

Para terminar, verifique se os testes de ponta a ponta são executados com êxito executando o seguinte script:

./scripts/test-manual-e2e.sh

Os testes completos escritos no Detox confirmam que os componentes e APIs do React Native funcionam corretamente no contexto de um aplicativo em execução. Eles executam o aplicativo RNTester no simulador e simulam um usuário que utiliza o aplicativo.

Você pode executar testes ponto a ponto do Detox localmente, instalando a CLI do Detox no macOS e executando o seguinte na linha de comando:

npm run build-ios-e2e
npm run test-ios-e2e

TESTE CONTÍNUO

O Facebook utiliza o Appveyor e o Circle CI para executar automaticamente testes em seus softwares de código aberto. O Appveyor e o CI executam esses testes sempre que uma confirmação é adicionada a uma solicitação pull, como uma maneira de ajudar os mantenedores a entender se uma alteração no código introduz uma regressão. Os testes também são executados em confirmações para o mestre e as *-stable ramificações, a fim de acompanhar a integridade dessas ramificações.

Há outro conjunto de testes que são executados na infraestrutura interna de testes do Facebook . Alguns desses testes são testes de integração definidos por consumidores internos do React Native (por exemplo, testes de unidade para uma superfície React Native no aplicativo do Facebook). Esses testes são executados a cada confirmação da cópia do React Native hospedada no controle de origem do Facebook . Eles também são executados quando uma solicitação pull é importada para o controle de origem do Facebook.

Se um desses testes falhar, será necessário alguém do Facebook para dar uma olhada. Como as solicitações pull só podem ser importadas pelos funcionários do Facebook , quem importou a solicitação pull deve poder facilitar com todos os detalhes.

REFERÊNCIAS

FACEBOOK. Contributing to React Native. [S. l.], 2019. https://github.com/facebook/react-native/blob/master/CONTRIBUTING.md

GITHUB. A framework for building native apps with React. [S. l.], 2019. https://github.com/facebook/react-native

GITHUB. The React Native Community. [S. l.], 2019. https://facebook.github.io/react- native/help

ASAPDEVELOPERS. React License: React Native update to MIT License. [S. l.], 2018. https://www.asapdevelopers.com/react-native-update-to-mit-license/