SonarQube Integration in NodeJS

A few highlights of today’s Topic are:

• What is SonarQube?
• Why SonarQube?
• Benefits of SonarQube
• How does it work?
• How to install it in your system?
• SonarLint with SonarQube

SonarQube is a tool used for analyzing static code which has become a universal standard in the IT industry. SonarQube can make the code cleaner, simpler, and easy to read.

Moving ahead, let us understand how SonarQube works.

What is SonarQube?

SonarQube is an open-source platform that is developed by SonarSource to inspect or analyze developers’ code on a continuous basis. It analyses or scans all the static codes, written by developers, and provides detailed reports of a number of Bugs, Vulnerabilities, Code smells, Duplication of codes and Security issues.

No matter whatever programming languages you have written your code, SonarQube supports 25+ programming languages through built-in rule sets. You can also extend that rule set using various plugins. You can find all the supported languages from this reference – https://rules.sonarsource.com/

Benefits of SonarQube

• Sustainability

Reduces complexity, possible vulnerabilities, and code duplications, as well as optimizes the life of applications.

• Increase productivity

Reduces the scale, cost of maintenance, and risk of the application; as such, it eliminates the need to spend more time changing the code

• Quality Code

Code quality control is an inseparable part of the software development process.

• Detect Errors

Detects errors in the code and alerts developers to fix them automatically before submitting them for output.

• Increase consistency

Determines where the code criteria are breached and enhance the quality.

• Business scaling

No restriction on the number of projects to be evaluated

• Enhance developer skills

Regular feedback on quality problems helps developers to improve their coding skills.

Why SonarQube?

So far we have discussed SonarQube and its benefits. Now let’s look into why we should use SonarQube. 

As you know, developers are doing too much coding in their life due to many reasons such as achieving project timelines, and deliveries and fixing bugs on products to fulfill client requirements and make production stable. In that case, devs don’t look back on the quality of the code and just fix the issues hurriedly. Also, leads do not have the time to review code fixes and they directly move the buggy or non-quality code to the product which leads to failure of production performance at any time and alternatively it creates impacts on costs for clients.

Ideally, this is a very wrong impression of devs and against the best practices which affect the developer’s career.

To avoid such scenarios and to maintain good code quality we have great tools in the IT industry which are free of cost. One of them is SonarQube which improves and delivers the best code quality on production each time devs change or add new code.

Time to set up and use SonarQube

Here we have seen the benefits and its features. Now it’s time to implement SonarQube into your system to leverage its features. Let’s start with what we require and how to set it up

Before starting the setup of SonarQube you need to check the below prerequisites in your system:

• JAVA (Oracle JRE 11 or OpenJDK 11), you can also find more [details]
• Should have NodeJS version 8 or higher installed

Download SonarQube and Sonar Scanner

1. Download SonarQube

A. There are two options for downloading Sonar Scanner, you can choose any one

1. Get the LTS version from [https://www.sonarqube.org/downloads/]
2. Using Docker image [https://hub.docker.com/_/sonarqube]

2. Sonar Scanner

A. There are two options for downloading Sonar Scanner, you can choose any one

1. Using following this link: [https://docs.sonarqube.org/latest/analysis/scan/sonarscanner]
2. Using npm package [https://www.npmjs.com/package/sonarqube-scanner]

Follow the steps to run SonarQube

Below are commands that can be run from your cmd or terminal either Windows or other OS to set SonarQube bin folder path and choose the platform and run the following command

#For Windows(cmd):

C:\sonarqube\bin\windows-x86-64>StartSonar.bat

#For other OS (terminal): 

C:\sonarqube\bin\[OS]>sonar.sh

If you are running SonarQube using a docker image there is no need to set up the above command.

Now SonarQube will be run on http://localhost:9000/ and log in using default credentials (login: admin, password: admin)

Once you are logged in we need to set up an analysis project.

1. Go to “Create Project” on the right top side of the page and click on manually tab

2. Enter a project name and key name which will be used in the future in sonar properties

3. Now click on sonar analysis setup for ‘Locally’

4. Select ‘Generate a Token’

5. Select the Programming Language that you are using in your project and the OS used

6. Now you can run the sonar scanner by executing the command that is provided in the above screenshot

7. OR you can add the scanner property in your project and use the sonar-scanner command in package.json

For that need to add the below dependency package to your project

"sonar-scanner": "^3.1.0",

And use the below script to run the scanner from the command

"scripts": {

     "sonar":  "node_modules/sonar-scanner/bin/sonar-scanner",

Now run the below command to run the scanner

npm run sonar; 

sonar property file will look like this in the root folder:

sonar-project.properties

sonar.host.url=http://localhost:9000/

sonar.projectKey=test-nodejs

sonar.projectName=test-nodejs

sonar.login=****************************

sonar.projectVersion=1.0

sonar.sources=.

sonar.coverage.exclusions=node_modules/*,app.js,package.json,.scannerwork,.env,public/*,db/*,test/*

You define your files in exclusions or in inclusion based on your needs

8. Once scanner analysis is done it will be able to see the scanner report under the projects section for your project will be looks like the one below.

SonarLint with SonarQube

As you now have more knowledge of SonarQube and Scanner to improve your code quality and implement best code practices, there is also one package or extension available to check errors and issues in your local IDE before committing your code and before running the SonarQube. Yes, you are right, we are discussing the SonarLint extension which is available for almost all IDE editors. 

Here we are going to explain how to use SonarLint in VS Code. With this, you will have clean code in advance before pushing your code to your branch.

Steps to download and install SonarLint in VS Code

1. Open your VS Code IDE and click on the “Extensions” menu from the left side pane

2. Now search “sonarlint” and it will appear in the first place like below

3. Now click on install and it will start installing in your VS code. Once it’s done it will show you the page where you will find all the details and it’s.

4. Once it’s installed it will auto-enable in your current working directory project like below in the “PROBLEMS” section. With its pre-resolution suggestion.

When you click on any problem it will redirect you to the problem which will be like

Now you are an expert developer so you know how to fix it!!! Please fix it and commit it. So you don’t have to wait till you commit your code and run SonarQube. Using this SonarLint you can identify your issues and errors priorly and fix them. This will reduce your time and do not have to wait for the Sonar Scanner output. With this, productivity will increase and there will be less chances to have bugs on production levels.

Summary

So the final conclusion or summary of these SonarQube documents is to grow developers’ code quality and to increase developers’ productivity with zero bugs. Also, introduce one more extension SonarLint which will be also helpful to developers by identifying errors or issues in advance to reduce the multiple iteration time. 

Hopefully, this quick tutorial document will help you to kick start with SonarQube integration in your project by consuming its core functionality. Gain more technical knowledge by reading our latest blogs.