CI/CD em seu aplicativo React Native com o Microsoft App Center
Quem já trabalhou com desenvolvimento mobile sabe que uma das maiores dores é o processo burocrático da publicação dos apps nas lojas. Portanto, qualquer ajuda para encurtar essa etapa é bem-vinda. Pensando nisso, aqui na Aurum, decidimos por automatizar a publicação do app Astrea Mobile.
A ferramenta escolhida foi o Microsoft App Center. Escolhemos essa opção, dentre outras que existem no mercado, pois nosso objetivo final era também termos o OTA (over-the-air update), e a Microsoft já possui uma boa integração com o CodePush.
Nesse post vou relatar as etapas de integração e um pouco como foi nossa experiência na implementação, indicando alguns dos problemas que passamos.
Antes de começar
Github
Antes de iniciarmos, é importante salientar que, caso o repositório do seu projeto no Github seja privado, somente o criador desse projeto conseguirá adicioná-lo ao build do App Center.
App Center
Atualmente, em seu plano gratuito o App Center disponibiliza 4 horas de build por mês. Um valor mais do que o suficiente para projetos médios e pequenos. Mas fique atento pois o consumo desse tempo será da conta que adicionou o projeto, não necessariamente da conta que executou o build.
Android
O que é necessário?
- Um repositório com o projeto de seu app (Github ou Bitbucket);
- Uma conta de desenvolvedor na Google Play;
- Uma conta no Microsoft App Center (é possível logar com o e-mail ou Github);
Iniciando
Primeiro, vamos criar um app com as seguintes configurações:
Conexão com a loja
Vamos criar a conexão com a Google Play. Para isso, acesse o seu app recém-criado clique na aba Distribute e depois em Stores.
Depois, clique em connect to store e escolha a Google Play. Agora será necessária uma chave para realizar a conexão. Essa chave é um arquivo JSON (é possível ver o passo a passo de como consegui-la neste link). O processo para obter este arquivo só pode ser realizado pelo dono da conta de desenvolvedor na Google Play, mesmo com acesso de administrador não foi possível realizá-lo com outra conta.
Após conseguir o arquivo, é só fazer o upload dele e colocar o package name de seu projeto (o package name dos projetos Android são encontrados no arquivo AndroidManifest.xml).
Build
Agora que já estamos com a conexão com a loja, podemos avançar para a próxima etapa. Clicando em build na área do app, podemos escolher qual serviço de repositório queremos (nesse caso utilizamos o Github). Ao selecionar o serviço uma lista com os repositórios disponíveis vai aparecer (tanto da sua conta, quanto de organizações que você esteja participando).
Selecione o projeto e depois selecione a branch com a qual você quer que seu build seja rodado, no nosso caso escolhemos a branch Master (que pode estar como Main, dependendo de quando você criou seu projeto).
Configuração do build
Nesse passo temos que fazer algumas alterações. A primeira é escolher a versão mais estável do NodeJS (no nosso caso era a versão 12x).
Em Build Frequency, selecionaremos para fazer o build desta branch em cada push. Marque também as opções: Build Android App Bundle, para otimizarmos o aplicativo usando o formado .aab; e a opção Automatically increment version code, para não nos preocuparmos em ter que alterar a versão do bundle em cada build.
Além disso, vamos ativar o Sign Build. Será necessário fazer o upload de sua keystore e de algumas variáveis de ambiente. Caso você não tenha uma keystore, aqui você encontra como obtê-la.
Nessa parte, tivemos falhas em nossos builds. Para que a assinatura do App Center funcione, a assinatura manual do projeto terá que ser removida. Para resolver isso é simples, basta remover (ou comentar) as seguintes linhas no arquivo android/app/build.gradle dentro da seção buildTypes/release:
signingConfig signingConfigs.debugsigningConfig signingConfigs.release
Lembrando que, comentando essas linhas, o processo de criar apk na sua máquina não funcionará. Sem o signingConfig, o arquivo gerado será um unsigned-app-release.apk.
E, por fim, vamos selecionar a conexão com a loja que realizamos anteriormente, escolher a opção Production e escrever uma nova mensagem de atualização.
iOS
O que é necessário?
- Um repositório com o projeto de seu app (Github ou Bitbucket);
- Uma conta apple ID no programa de desenvolvedores Apple;
- Uma conta no Microsoft App Center (é possível logar com o e-mail ou Github);
Iniciando
Primeiro, vamos criar um app com as seguintes configurações:
Conexão com a loja
Vamos criar a conexão com a App Store. Para isso, acesse o seu app recém-criado, clique na aba Distribute e depois em Stores.
Depois, clique em connect to store e escolha a App Store Connect. Agora é necessário informar seu apple ID, será solicitado o código da autenticação de dois fatores, mas existe um porém, a autenticação por SMS não é aceita. Para resolver isso foi simples, é só adicionar um dispositivo ao seu apple ID e pegar o código por lá.
Logo após, foi solicitado um app password, basta acessar a página da Apple e gerar um novo na parte de segurança. Pronto, após conectar com sua conta é só selecionar o seu projeto!
Build
Aqui é só repetir o processo do Android: selecionar seu repositório e a branch.
Configuração do build
De novo, a primeira alteração é selecionar a versão mais estável do NodeJS.
Selecionamos também o Scheme, Xcode Version e o Build Frequency. Aqui o problema foi com relação à versão do Xcode. Com a versão 12, o build demorava mais de 30 minutos o que ocasionava timeout e falha. Depois de testar diversas opções, a versão estável encontrada foi 11.3, com ela o build foi realizado com sucesso.
Agora, vamos configurar a assinatura do app. Para isso, é necessário fazer o upload de dois arquivos: o Provisioning Profile e o certificado .p12. Caso você não saiba como obter esses arquivos, aqui tem um tutorial que pode ajudar nisso.
E, no fim, vamos selecionar a nossa conexão com a App Store, selecionar a versão de produção e escrever as atualizações do app.
Antes do build
Um problema encontrado no iOS foi com mudança de versões. Quando mudamos para uma diferente da 1.0, o arquivo Info.plist foi atualizado e começou a utilizar a variável MARKETING_VERSION.
<key>CFBundleShortVersionString</key><string>$(MARKETING_VERSION)</string>
O problema com a versão desse jeito é que o App Center não consegue encontrá-la e falha ao tentar construir nosso app. Então, caso isso ocorra, altere seu arquivo manualmente.
<key>CFBundleShortVersionString</key><string>1.1</string>
Uma última coisa!
Um outro ponto que o App Center proporciona é uma badge de status do seu projeto, que fica bem legal pra colocar no README do seu repositório.
Adeus assembleRelease e archive
Pronto! Agora você já tem seus builds configurados. Pode se despedir do comando ./gradlew assembleRelease e do archive no XCode. A cada push que você der, na branch escolhida, uma nova versão vai aparecer em sua loja.