SonarQube com Flutter — Como instalar e integrar ao GitHub
A proposta é realizar a configuração do SonarQube em um VPS Linux integrado com o GitHub.
Antes de mais nada, temos que entender o que é e para que serve.
SonarQube é uma ferramenta de revisão automática de código autogerenciada que, sistematicamente, ajuda você a fornecer código limpo. Ele se integra ao seu fluxo de trabalho existente e detecta problemas em seu código para ajudá-lo a realizar inspeções contínuas de código em seus projetos. A ferramenta analisa mais de 30 linguagens de programação diferentes e se integra ao seu pipeline de CI e à plataforma DevOps para garantir que seu código atenda aos padrões de alta qualidade.
Em outras palavras, o SonarQube é uma ferramenta de código aberto que fornece relatórios sobre diversos aspectos do código, como duplicação, padrões de codificação, testes unitários, cobertura de código, complexidade, comentários, erros e vulnerabilidades de segurança. Além disso, ele pode registrar o histórico de métricas e fornecer gráficos de evolução. O SonarQube também oferece análise e integração totalmente automatizadas com as ferramentas Maven, Ant, Gradle, MSBuild, etc e de integração contínua, como Atlassian Bamboo, Jenkins, Hudson, entre outros.
Não entraremos em detalhes de como configurar as métricas do sonar, nem tampouco entraremos nos detalhes de padrões de codificação ou testes unitários. O foco é na instalação do SonarQube e na integração com o GitHub.
Mão na massa
Após entender o que é o SonarQube e para que serve, vamos realizar as configurações do nosso servidor. Para esse exemplo, estaremos utilizando um VPS com o Ubuntu 20.04.
Configurações básicas do Linux — Não entraremos em detalhes de melhores abordagens de segurança e nem de configurações gerais, nosso intuito é apenas de instalar o básico para que o SonarQube funcione.
- Estrutura de pastas: Criaremos uma pasta chamada sonar e dentro dela haverá um arquivo chamado docker-compose.yaml e duas pastas, extensions e data. A estrutura ficará assim:
Dica: Costumamos ter um diretório em que guardamos todos os containers (containers-docker). Para esse projeto criamos a pasta sonar em containers-docker.
- Conteúdo do docker-compose.yaml — Abaixo há um exemplo.
- Instalação do Docker Compose:
sudo curl -L "https://github.com/docker/compose/releases/download/1.26.0/docker-compose-$(uname -s)-$(uname -m)" -o /usr/local/bin/docker-composesudo chmod +x /usr/local/bin/docker-composedocker-compose --versionSe a instalação ocorreu corretamente, a saída do comando acima será algo como essa:
docker-compose version 1.26.0, build d4451659Referências: https://www.digitalocean.com/community/tutorials/how-to-install-and-use-docker-compose-on-ubuntu-20-04-pt
- Executar o docker-compose com a nossa configuração. A configuração contida no arquivo docker-compose.yaml faz com que o docker baixe e configure todo o SonarQube. Na pasta que contém o arquivo docker-compose.yaml, execute o seguinte comando:
docker-compose upSe tudo ocorreu corretamente, após alguns minutos, já é possível acessar, pelo browser, o sonar na porta 9000. http://enderecodoservidor:9000. O usuário e senha padrão é admin.
Após acessar pela primeira vez, o sistema solicitará redefinição de senha e nos levará, finalmente, à tela de projetos.
Como não há, no momento, nenhum projeto configurado, essa é a tela que será exibida.
Agora só falta mais um detalhe para que o SonarQube reconheça o Dart/Flutter. Para isso, é necessário baixar um plugin (.jar). Aqui você encontrará a versão mais recente (nesse momento a versão mais atual é a 0.4.0).
Após o download, pare o serviço dando um ctrl+c no terminal do servidor e vá na pasta ./sonar/extensions, crie uma pasta chamada plugins e coloque, nessa pasta, o arquivo que você baixou.
Após esse procedimento execute novamente o docker-composer (docker-compose up).
Após o serviço ser iniciado, entre no SonaQube pelo navegador e vá até o menu Administration e verifique se aparece as opções Flutter e Dart.
Referências: https://github.com/insideapp-oss/sonar-flutter
Se você chegou até aqui, significa que a parte mais “chata” já foi superada.
Configurações no projeto Flutter
Agora é necessário inserir algumas configurações no projeto Flutter para que o SonarQube consiga identificar corretamente.
Na raiz do seu projeto, crie o arquivo sonar-project.properties.
Cole o conteúdo disponibilizado a seguir nesse arquivo. Lembre-se de alterar o valor da linha 2 (deve ser chave única do seu sonar) e 3 (Nome que será exibido no painel).
Não entraremos no mérito das configurações avançadas desse arquivo, o intuito é criar de forma básica.
Para mais informações sobre configuração desse arquivo, veja essa referência: https://docs.sonarqube.org/latest/analyzing-source-code/analysis-parameters/
Configuração do GitHub workflows
Crie na raiz do seu projeto Flutter a pasta .github/workflows e dentro da pasta workflows, crie um arquivo .yaml. No nosso exemplo foi criado o arquivo ci.yaml.
Além da configuração do SonarQube, você pode adicionar outros comandos. Para maiores detalhes do que pode existir nesse arquivo, sugerimos que consulte a documentação.
Documentação workflows: https://docs.github.com/en/actions/using-workflows
Configurar o GitHub
Agora que estamos quase lá, só falta a configuração no GitHub para que possamos enxergar os detalhes no painel do SonarQube.
Para que seja possível a configuração do GitHub, é necessário gerar o token no painel do Sonar. Sendo assim, entre no painel e vá no menu Projects e escolha Manually.
Em seguida, informe os mesmos dados que foram inseridos no arquivo sonar-project.properties e clique em setup. No nosso exemplo ficou assim:
Nessa etapa há a possibilidade de integrar com várias ferramentas, porém utilizaremos a opção With GitHub Actions.
Por último, gere o token e vamos para o GitHub configurar o repositório.
Escolha o tempo de expiração desejado e copie a chave gerada para colocarmos no GitHub.
No GitHub, vá no repositório do seu projeto e, em seguida, em Settings -> Secrets — Actions e adicione SONAR_HOST_URL (com o caminho do seu Sonar) e SONAR_TOKEN (chave gerada).
Pronto! Se tudo estiver correto após dar um push para a branch develop, o GitHub irá disparar a ação e enviará os dados para o SonarQube.
Todos os steps foram executados com sucesso. Agora vamos verificar nosso SonarQube.
Já temos os dados do nosso projeto no nosso Sonar. Com essa configuração, toda vez que for feito um push na develop ou um Pull Request, o sonar receberá os dados do projeto e atualizará as métricas.
Referências gerais:
