Daniele Cammarata

When building a web application, maintaining high code quality is essential to prevent bugs and security vulnerabilities from creeping into your project. One popular tool for continuous code quality analysis is SonarQube. SonarQube helps in static code analysis, detecting bugs, code smells, and security vulnerabilities across multiple programming languages.

In this blog post, we’ll walk through how to integrate SonarQube into your web application using Docker Compose. This setup ensures that you can easily run SonarQube in your development or CI environment without complex installation processes.

What You’ll Need

Before we get started, make sure you have the following installed:

Step 1: Create a `docker-compose.yml` for SonarQube

In your web application’s root directory, create a docker-compose.yml file. We’ll define the services for both SonarQube and PostgreSQL, which SonarQube uses as its database.

version: '3'

services:
  sonarqube:
    image: sonarqube:community
    container_name: sonarqube
    ports:
      - "9000:9000"
    environment:
      - SONAR_JDBC_URL=jdbc:postgresql://db:5432/sonarqube
      - SONAR_JDBC_USERNAME=sonar
      - SONAR_JDBC_PASSWORD=sonar
    depends_on:
      - db
    networks:
      - sonarnet

  db:
    image: postgres:alpine
    container_name: postgres
    environment:
      - POSTGRES_USER=sonar
      - POSTGRES_PASSWORD=sonar
      - POSTGRES_DB=sonarqube
    networks:
      - sonarnet

networks:
  sonarnet:

Explanation:

SonarQube Service: This uses the sonarqube:community Docker image, exposes port 9000, and connects to the PostgreSQL database.
PostgreSQL Service: This uses the postgres:alpine image for lightweight PostgreSQL support and creates a sonarqube database.
Networks: Both services are connected to a shared network (sonarnet) to enable internal communication.

Step 2: Start SonarQube with Docker Compose

Run the following command in your project directory to spin up the SonarQube and PostgreSQL containers:

docker-compose up -d

This command will download the necessary Docker images (if not already available) and start the containers in detached mode (-d).

Check if SonarQube is Running:

You can check if the containers are running by using:

docker-compose ps

If everything is working correctly, you should see both SonarQube and the PostgreSQL containers up and running.

Access SonarQube:

Once the containers are up, open your web browser and navigate to:

http://localhost:9000

By default, SonarQube will ask for a login. The default credentials are:

Username: admin
Password: admin

Once logged in, you’ll be prompted to change the default password.

Step 3: Analyze Your Web Application’s Code

Now that SonarQube is running, we can analyze our web application’s code.

Install SonarQube Scanner

To scan your project code with SonarQube, you need to install SonarQube Scanner in your project. If you’re using a JavaScript or Node.js project, you can install it via npm:

npm install --save-dev sonarqube-scanner

Add SonarQube Configuration

Create a sonar-project.properties file in the root directory of your web application. This file will contain the configuration for running the SonarQube analysis.

sonar.projectKey=my-web-app
sonar.projectName=My Web App
sonar.projectVersion=1.0
sonar.sources=src
sonar.host.url=http://localhost:9000
sonar.login=your-sonarqube-token

sonar.projectKey: A unique identifier for your project in SonarQube.
sonar.sources: The directory where your source code is located (in this case, it’s src).
sonar.host.url: The URL where SonarQube is running (http://localhost:9000).
sonar.login: Your SonarQube authentication token. You can generate a token from your SonarQube profile in the web UI.

Run the SonarQube Scanner

Add a script in your package.json to run the SonarQube scan:

"scripts": {
  "sonar": "sonarqube-scanner"
}

Then, run the script using:

npm run sonar

This will send your code to the running SonarQube instance for analysis.

Step 4: View the Analysis Results

Once the scan is complete, head back to the SonarQube dashboard (http://localhost:9000), and you should see your project listed. Click on the project to view detailed reports on code quality, security vulnerabilities, and code smells.

Conclusion

SonarQube is a powerful tool for ensuring high-quality code, and integrating it into your development process can help you identify and fix issues early. With Docker Compose, setting up a SonarQube instance becomes incredibly easy, allowing you to maintain a lightweight, containerized environment for your code analysis.

By following the steps in this guide, you’ve set up SonarQube to analyze your web application’s code and monitor it for quality, security, and maintainability.

How to Add SonarQube to Your Web Application Using Docker Compose