Com uma equipe móvel em crescimento e lançamentos semanais, é essencial ter um pipeline de CI confiável. Precisamos ser capazes de criar e testar nossos aplicativos e implantá-los na App Store e na Google Play Store. Também mantemos versões de pré-visualização internas para testar os recursos mais recentes.
Saiba como usamos o ClickUp, o Fastlane e o GitHub Actions para automatizar nossa integração contínua (CI) e entrega contínua (CD).
A vida de um bug 🐜
Vamos começar revisando rapidamente nosso processo de gerenciamento e correção de bugs.
- Um bug (ou solicitação de recurso) é relatado e uma tarefa é criada no ClickUp.
- A tarefa é atribuída a um desenvolvedor e corrigida em um PR contra o branch de staging.
- A CI executa todos os testes, cria o aplicativo, implanta uma pré-visualização na web e carrega tudo na tarefa do ClickUp.
- Nossa equipe de controle de qualidade verifica a correção e, se estiver tudo certo, a tarefa é marcada como concluída.
- O PR é mesclado automaticamente no ambiente de teste.
- A ramificação de teste é criada e implantada em nosso TestFlight interno.
- Todas as quartas-feiras, uma ramificação de lançamento é criada, construída e testada.
- Às sextas-feiras, criamos uma versão no GitHub e a CI implanta a versão na App Store e na Play Store.
Uma tarefa do ClickUp contém todas as informações sobre o bug. Usamos status personalizados, como Em andamento ou Revisão de código, para acompanhar o bug. Os fluxos de trabalho de CI alteram o status automaticamente. Os campos personalizados contêm informações adicionais, como quem relatou o bug, quem está trabalhando nele, quando ele será lançado etc.
Fluxo de trabalho de RP 📜
As duas primeiras etapas descritas acima não estão realmente relacionadas à CI, mas a terceira é interessante...
Nosso fluxo de trabalho de desenvolvimento é executado para qualquer PR. Ele verifica lints, formatação e executa todos os testes antes de começar a construir os artefatos Android e iOS.
Quando uma compilação é bem-sucedida, a CI publica uma mensagem na tarefa vinculada. Os engenheiros de controle de qualidade podem acessar o PR, baixar os artefatos da compilação ou usar a visualização na web.
Uma mensagem de CI automatizada publicada na tarefa vinculada do ClickUp após uma compilação bem-sucedida.
Configurando o Flutter no CI Runner 🛠
Usamos a conhecida ação GitHub subosito/flutter-action para configurar o Flutter na CI. Por padrão, ela instalará a versão estável mais recente do Flutter. Para evitar interromper seus fluxos de trabalho de CI quando uma nova versão do Flutter for lançada, você deve especificar a versão manualmente.
Se você tiver vários fluxos de trabalho, é melhor armazenar a versão do Flutter em um arquivo. Usamos FLUTTER_VERSION na raiz do repositório.
Outra solução fácil é armazenar a versão do Flutter como segredo do GitHub e acessá-la usando {{ secrets. FLUTER_VERSION }}.
Pré-visualização na web 🕸
Graças à capacidade do Flutter de ser executado na web, podemos criar uma visualização totalmente funcional das solicitações de pull. Usando o pacote device_preview, é possível ajustar o tamanho e as configurações do dispositivo.
A visualização prévia tem se mostrado muito útil e não é utilizada apenas pela nossa equipe de controle de qualidade. Designers e gerentes de produto também gostam dela para iterar rapidamente em novos recursos.
via Flutter
Como criar uma visualização na web 🐶
Para começar, certifique-se de que seu aplicativo seja compatível com o Flutter web — nem todas as APIs são suportadas.
Em nosso aplicativo, por exemplo, precisávamos desativar notificações push e web sockets.
Este fluxo de trabalho de exemplo cria uma pré-visualização web do seu aplicativo Flutter e o carrega em um bucket S3. Usamos uma variável de ambiente ENABLE_DEVICE_PREVIEW para desativar o device_preview na produção.
A etapa Fix base href é necessária porque a visualização não estará na raiz do bucket.
E alguns códigos para habilitar condicionalmente o device_preview.
As variáveis de ambiente são uma ferramenta poderosa e permitem que o algoritmo de tree shaking do Flutter descarte o código de depuração para compilações de lançamento.
Fastlane 💨
O Fastlane simplifica muito a criação, assinatura e implantação de aplicativos Flutter. Ele gerencia nossos certificados, perfis de provisionamento e outras configurações. Usamos segredos do GitHub para armazenar senhas e tokens com segurança.
Ações úteis do Fastlane:
- fastlane match para criar e armazenar chaves e perfis iOS em um repositório GitHub
- build_app para criar aplicativos iOS e Android
- upload_to_testflight e entrega para implantar compilações iOS
- upload_to_play_store para implantar compilações Android
Exemplo de compilação de desenvolvimento iOS 🍏
Não se esqueça do setup_ci, ele irá poupá-lo de erros estranhos. Saiba mais sobre o Fastlane para aplicativos Flutter.
Assinatura Android 🔒
A maneira mais fácil de assinar compilações de lançamento do Android com segurança é armazenar os tokens como segredos do GitHub e usar variáveis de ambiente e uma chave temporária. jks criados pela CI:
Armazenamos a chave .jks como uma string codificada em base64 no Github Secrets e a decodificamos no fluxo de trabalho:
Fluxo de trabalho de lançamento e produção 🚀
O fluxo de trabalho de pré-lançamento é executado para ramificações que começam com release/v. Ele remove toda a depuração e o código interno para garantir que testemos o mesmo código que será lançado.
Além disso, o fluxo de trabalho de pré-lançamento publica em vários canais do Slack para notificar as equipes de controle de qualidade e marketing sobre um novo lançamento usando webhooks recebidos.
Depois que tudo é testado exaustivamente, criamos uma versão no GitHub que aciona o fluxo de trabalho de produção. Ela compila e assina o aplicativo com certificados de produção e o envia para a App Store.
Mais dicas para sua CI 🦾
Se você usar o gatilho push para GitHub Actions, provavelmente encontrará problemas se houver vários pushes para o mesmo branch em rápida sucessão. Mais de uma instância do fluxo de trabalho será iniciada e consumirá minutos de compilação ou causará outros problemas.
- Recomendamos usar a ação Cancelar fluxo de trabalho para cancelar todas as instâncias anteriores do fluxo de trabalho.
- Se você está procurando uma solução fácil e sustentável para gerar números de compilação sequenciais, experimente o Gerador de Números de Compilação. Você também pode usar o GITHUB_RUN_ID, mas ele não pode ser personalizado.
- Confira o aplicativo ClickUp GitHub para ver ramificações, commits e status do GitHub diretamente em suas tarefas do ClickUp. Use as automações do ClickUp ou a API pública do ClickUp para automações avançadas.
Resumo 🍩
Construir sua CI é um processo divertido. É fácil começar e você pode evoluir à medida que avança. Nossa CI segue um dos valores fundamentais do ClickUp: Progredir em direção à perfeição. Estamos constantemente trabalhando em melhorias de CI para nossas equipes de controle de qualidade e engenharia.
A combinação do ClickUp, GitHub Actions e Fastlane é muito poderosa e permite construir um pipeline de CI/CD flexível e totalmente automatizado em menos de uma hora. Experimente!
Temos muitos tópicos interessantes em preparação, por isso continue acompanhando o blog de engenharia da ClickUp! 🦄