Receitas - Usando SonarQube em seu projeto Java (Maven) ou JavaScript
Tags: braziliandevs, ptbr, java, tutorial
Published: 2021-06-16 12:37:08

---
title: Receitas - Usando SonarQube em seu projeto Java (Maven) ou JavaScript
published: true
description: Receitas - Usando SonarQube em seu projeto Java (Maven) ou JavaScript
tags: braziliandevs, ptbr, java, tutorial
cover_image: https://itexto.com.br/wp-content/uploads/2020/04/receita_sonarqube.png
---
<!-- wp:paragraph -->
<p>Um hábito que recomendamos a todos os nossos clientes e adotamos em nosso dia a dia é a revisão de código. Esta prática sempre deve ser realizada por humanos, mas toda ajuda adicional é válida. E uma ferramenta que pode agregar bastante é o <a href="https://www.sonarqube.org/">SonarQube</a>.</p>
<!-- /wp:paragraph -->

<!-- wp:image {"align":"center","id":1617,"sizeSlug":"large"} -->
<div class="wp-block-image"><figure class="aligncenter size-large"><img src="http://beta.itexto.com.br/wp-content/uploads/2020/04/receita_sonarqube.png" alt="" class="wp-image-1617"/></figure></div>
<!-- /wp:image -->

<!-- wp:paragraph -->
<p>Para quem não conhece, o SonarQube (também chamado de "Sonar" por muitos (eu, principalmente :) )) é uma poderosa ferramenta que realiza a análise estática de código fonte. Essencialmente o <em>Sonar</em> possui uma base de dados contendo diversos padrões em muitas linguagens de programação que detectam erros comuns de programação e até mesmo algumas falhas de segurança.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>Mais que isto: <em>Sonar</em> deve ser visto também como uma ferramenta pedagógica, que ensina diversas boas práticas à sua equipe. Um caso no qual <em>Sonar</em> agrega bastante é justamente quando estamos aprendendo novas linguagens de programação.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>Infelizmente nem todos sabem como configurar seus projetos para serem analisados pelo <em>Sonar</em>. Então segue aqui não uma, mas duas receitas para que você possa usar o <em>Sonar</em> tanto no seu back quanto no seu front-end.</p>
<!-- /wp:paragraph -->

<!-- wp:heading -->
<h2>Ingrediente principal: o SonarQube</h2>
<!-- /wp:heading -->

<!-- wp:image -->
<figure class="wp-block-image"><img src="https://www.sonarqube.org/assets/logo-31ad3115b1b4b120f3d1efd63e6b13ac9f1f89437f0cf6881cc4d8b5603a52b4.svg" alt="SonarQube"/></figure>
<!-- /wp:image -->

<!-- wp:paragraph -->
<p>É necessário que você tenha o <em>Sonar</em> (versão 7.1 ou posterior) em execução em algum lugar para poder prosseguir com estas receitas. Neste post não iremos lhe ensinar a instalá-lo ou usá-lo, mas aqui segue não um, mas <em>dois</em> caminhos possíveis para instalar o <em>Sonar</em> caso não tenha um servidor.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p><strong>Usando Docker</strong> (o mais fácil) - siga este <a href="https://hub.docker.com/_/sonarqube/">tutorial</a> presente na imagem oficial do <em>Sonar</em>.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p><strong>Modo tradicional</strong> (um pouco mais trabalhoso, mas nem tanto) - siga o que está descrito na documentação oficial neste <a href="https://docs.sonarqube.org/latest/setup/install-server/">link</a>.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>Mas não termina aí, você também precisará das seguintes informações:</p>
<!-- /wp:paragraph -->

<!-- wp:list -->
<ul><li>Um usuário no <em>Sonar</em> que possa criar novos projetos (seu login e senha).</li><li>A URL de acesso ao seu servidor Sonar</li></ul>
<!-- /wp:list -->

<!-- wp:heading -->
<h2>Primeira receita - Java e Maven</h2>
<!-- /wp:heading -->

<!-- wp:image {"align":"center"} -->
<div class="wp-block-image"><figure class="aligncenter"><img src="https://upload.wikimedia.org/wikipedia/commons/thumb/0/0b/Maven_logo.svg/1280px-Maven_logo.svg.png" alt="Mastering Maven: Getting Started | Oracle Developers Blog"/></figure></div>
<!-- /wp:image -->

<!-- wp:paragraph -->
<p>Neste momento lhe ensinaremos a proceder com <a href="https://maven.apache.org">Maven</a> por ser a opção mais popular entre desenvolvedores Java, mas não tenha dúvidas de que lhe mostraremos como proceder também com Gradle, no futuro.</p>
<!-- /wp:paragraph -->

<!-- wp:heading {"level":3} -->
<h3>Configuração por projeto</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>A beleza do Maven está no fato de ser baseado no conceito de convenções sobre configurações, ou seja, um conjunto de convenções são seguidas para que você não precise ficar gerenciando arquivos enormes: só é preciso alterar o que deve ser customizado. No caso do <em>Sonar</em> você só precisa incluir três linhas na tag <em>&lt;properties&gt;</em> do seu arquivo <em>pom.xml</em>. Quais são estas propriedades?</p>
<!-- /wp:paragraph -->

<!-- wp:preformatted -->
<pre class="wp-block-preformatted">&lt;properties&gt;
   &lt;!-- O endereço que leva à sua instalação do Sonar --&gt;
   &lt;sonar.host.url&gt;http://localhost:9000&lt;/sonar.host.url&gt;
   &lt;!-- O login do seu usuário --&gt;
   &lt;sonar.login&gt;admin&lt;/sonar.login&gt;
   &lt;!-- a senha de acesso deste usuário --&gt;
   &lt;sonar.password&gt;suasenhasupersecreta&lt;/sonar.password&gt;
&lt;/properties&gt;</pre>
<!-- /wp:preformatted -->

<!-- wp:paragraph -->
<p>E como fazer daqui pra frente? Para que o <em>Sonar</em> realize sua análise, é necessário existir código compilado. Sendo assim basta executar o comando abaixo:</p>
<!-- /wp:paragraph -->

<!-- wp:preformatted -->
<pre class="wp-block-preformatted">mvn compile sonar:sonar</pre>
<!-- /wp:preformatted -->

<!-- wp:paragraph -->
<p>Feito isto será criado um novo projeto em seu servidor Sonar, tal como na imagem a seguir. Aí é só seguir suas recomendações de melhoria e ver se algum bug foi detectado.</p>
<!-- /wp:paragraph -->

<!-- wp:image {"align":"center","id":1624,"sizeSlug":"large"} -->
<div class="wp-block-image"><figure class="aligncenter size-large"><img src="https://www.itexto.com.br/site/wp-content/uploads/2020/04/image-3.png" alt="" class="wp-image-1624"/></figure></div>
<!-- /wp:image -->

<!-- wp:heading {"level":3} -->
<h3>Configuração global</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>Sim, acredite: é só isto. Mas e se você não quiser ficar enviando sua senha por aí? E se tiver uma instalação do Sonar compartilhada por toda a sua equipe e quiser ter a configuração centralizada para que não precise ficar alterando seus projetos um a um? Tão fácil quanto! Basta alterar o arquivo <em>settings.xml</em> que estará no diretório <em>conf</em> da sua instalação do Maven. Vamos lá?</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>Na tag <em>&lt;pluginGroups&gt;</em> inclua o plugin do Sonar, tal como no exemplo a seguir:</p>
<!-- /wp:paragraph -->

<!-- wp:preformatted -->
<pre class="wp-block-preformatted">&lt;pluginGroups&gt;
   &lt;pluginGroup&gt;org.sonarsource.scanner.maven&lt;/pluginGroup&gt;
&lt;/pluginGroups&gt;</pre>
<!-- /wp:preformatted -->

<!-- wp:paragraph -->
<p>E você também deverá criar um <em>profile</em> padrão. Isto é fácil. Basta incluir texto similar ao apresentado a seguir na tag <em>&lt;profiles&gt;</em> do seu arquivo <em>settings.xml</em>.</p>
<!-- /wp:paragraph -->

<!-- wp:preformatted -->
<pre class="wp-block-preformatted">&lt;profiles&gt;
  &lt;profile&gt;
    &lt;id&gt;sonar&lt;/id&gt;
    &lt;activation&gt;
       &lt;activeByDefault&gt;true&lt;/activeByDefault&gt;
    &lt;/activation&gt;
    &lt;properties&gt;
      &lt;!-- as mesmas que você viu no pom.xml! --&gt;
      &lt;!-- O endereço que leva à sua instalação do Sonar --&gt;
      &lt;sonar.host.url&gt;http://localhost:9000&lt;/sonar.host.url&gt;
      &lt;!-- O login do seu usuário --&gt;
      &lt;sonar.login&gt;admin&lt;/sonar.login&gt;
      &lt;!-- a senha de acesso deste usuário --&gt;
      &lt;sonar.password&gt;suasenha&lt;/sonar.password&gt;
    &lt;/properties&gt;
  &lt;/profile&gt;
&lt;/profiles&gt;</pre>
<!-- /wp:preformatted -->

<!-- wp:heading -->
<h2>Segunda receita - JavaScript</h2>
<!-- /wp:heading -->

<!-- wp:image {"align":"center","id":988,"sizeSlug":"large"} -->
<div class="wp-block-image"><figure class="aligncenter size-large"><img src="http://beta.itexto.com.br/wp-content/uploads/2017/08/logotipo.png" alt="" class="wp-image-988"/></figure></div>
<!-- /wp:image -->

<!-- wp:paragraph -->
<p>Um ingrediente importante aqui será o <strong>NPM</strong>. O primeiro passo consistirá em instalar o <em>sonar-scanner</em>: este componente do <em>Sonar</em> é o responsável por realizar a análise estática do código fonte. A instalação é simples:</p>
<!-- /wp:paragraph -->

<!-- wp:preformatted -->
<pre class="wp-block-preformatted">npm install -g sonar-scanner</pre>
<!-- /wp:preformatted -->

<!-- wp:paragraph -->
<p>No diretório raiz que contenha o código fonte do seu projeto você deverá agora criar um arquivo chamado <em>sonar-project.properties</em>. Em seu interior serão incluídas configurações no formato chave/valor tal como no exemplo a seguir:</p>
<!-- /wp:paragraph -->

<!-- wp:preformatted -->
<pre class="wp-block-preformatted"># A identificação do projeto. Nome:versão
sonar.projectKey=nomeDoSeuProjeto:1.0.0
# O nome do projeto
sonar.projectName=Seu lindo projeto
# A partir de que diretório será lido o código fonte.
# Neste exemplo é a partir do mesmo diretório que
# o arquivo criado
sonar.sources=.
# Host do Sonar
sonar.host.url=http://localhost:9000
# Usuário - login
sonar.login=admin
# Senha de acesso
sonar.password=seuSegredoValioso!
# Qual diretório não deve estar na análise.
# Quer ver algo demorar? Inclua a pasta node_modules
# pra ser analisada também. :)
sonar.exclusions=<strong>/node_modules/</strong></pre>
<!-- /wp:preformatted -->

<!-- wp:paragraph -->
<p>Notou que as mesmas propriedades que usamos no exemplo com Java se repetem aqui? Sim, elas são padronizadas, mas há algumas novas aqui. Preste atenção nos comentários que foram incluídos no exemplo acima.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>Com o arquivo gerado e o <em>sonar-scanner</em> instalado, como você analisa seu projeto? Simples! Executando o coamando abaixo no mesmo diretório em que o arquivo <em>sonar-project.properties</em> se encontra.</p>
<!-- /wp:paragraph -->

<!-- wp:preformatted -->
<pre class="wp-block-preformatted">sonar-scanner</pre>
<!-- /wp:preformatted -->

<!-- wp:heading -->
<h2>Incrementando as receitas</h2>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>Você deve ter notado que algumas das chaves de configuração foram usadas tanto no Maven quanto no JavaScript, certo? É por que são padronizadas. Caso queira ver a lista completa de configurações possíveis, acesse este <a href="https://docs.sonarqube.org/latest/analysis/analysis-parameters/">link</a>.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>Naturalmente há outras maneiras de se obter os mesmos resultados, porém o objetivo destas receitas é apenas lhe mostrar um caminho rápido possível pra poder dar seus primeiros passos. Quer incrementar estas receitas? Nos conte suas experiências!</p>
<!-- /wp:paragraph -->

<!-- wp:heading -->
<h2>As Deliciosas Receitas da itexto</h2>
<!-- /wp:heading -->

<!-- wp:image {"align":"center","id":1584,"sizeSlug":"large"} -->
<div class="wp-block-image"><figure class="aligncenter size-large"><img src="http://beta.itexto.com.br/wp-content/uploads/2020/04/receitas_itexto_block.png" alt="" class="wp-image-1584"/></figure></div>
<!-- /wp:image -->

<!-- wp:paragraph -->
<p>Resolvemos recentemente abrir nosso livro de receitas que contém soluções rápidas para os principais problemas enfrentados por profissionais de desenvolvimento de software. Há uma metodologia na criação deste livro de receitas, e você pode aprender a escrever o seu conosco lendo este <a href="https://www.itexto.com.br/site/receitas-da-itexto/">post</a>.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>Esperamos que estas duas receitas rápidas lhe ajudem no dia a dia. Pode aguardar que mais receitas já estão a caminho, até lá!</p>
<!-- /wp:paragraph -->