This article was first published on the WeChat public account: Big Move to the World, my WeChat: qq449245884, I will share with you the front-end industry trends, learning methods, etc. as soon as possible.
For more open source works, please see GitHub https://github.com/qq449245884/xiaozhi , including the complete test sites, materials and my series of articles for interviews with first-tier manufacturers.

foreword

In the process of self-studying DevOps recently, I found that in addition to understanding the basic CI/CD process, it is more important to understand which tools can be used to assist the entire CI process. Today, I will introduce a useful code detection platform: SonarQube .

Although many times in today's development, code review and various linter are used for development, but there is always a sparseness in one hundred secrets. At this time, SonarQube can help developers check some potential bugs, which may be in development. The linter did not report an error, and it may have been overlooked during code review. If SonarQube can be added to the CI process to scan the entire codebase, then the code of the entire project can be of higher quality.

What is SonarQube

SonarQube is a set of code detection and quality management platform based on Java development. Since this tool is developed in Java, you must first remember to install the Java Development Kit (JDK) , so that you can successfully start SonarQube in the future.

SonarQube also provides many services like:

  • web-based operation
  • Supports analysis and detection of a wide variety of programming languages
  • Provides reports on code duplication, potential bugs, test coverage, etc.
  • Provides automated analysis combined with mainstream CI tools
  • Provide code improvement suggestions
  • Integrate external tools such as JIRA, Mantis, LDAP, Fortify
  • Provide historical records for follow-up

Since SonarQube provides too many services, here are only a few points that I think are most worthy of sharing with you. Interested readers can go to the official website to read the relevant information.

Start SonarQube

Since I am using a mac system, I will introduce the operation mode of mac here. First, you can enter the folder /bin/macosx-unversal-64 in the terminal, and ./sonar.sh start this command starts SonarQube Serve.

image.png

After starting the service, you can type localhost:9000 in the browser to open the SonarQube web page, the default account and password are admin , after entering, you can start using the SonarQube provided by SonarQube on the local side Check out the service.

image.png

SonarQube Operating Instructions

After logging in, you can start to create a Project. The Project here is mainly to facilitate the developers to control the quality of the project. After the Project is created, you can start to detect the repository you want to detect.

image.png

We can also see that SonarQube integrates a lot of mainstream tools for creating projects, such as GitHub , Jira, etc. If the readers themselves are using these tools for project management, they can also directly integrate the existing architecture , here for the convenience of introduction, so choose to manually create a Project .

image.png

After the project is established, you can see that SonarQube also supports the CI mechanism of many mainstream platforms. This is also for the convenience of introduction, so choose manual testing local repository .

image.png

Before we want to analyze and detect, we also need to generate a set of private tokens. Using this set of tokens, we can ensure that the results of the detection will be placed in this project when we conduct the detection later.

image.png

After that, you can choose which language the code to be detected belongs to and the OS of the current computer. After selecting, you can go to the official website to download the most important analysis tool, SonarScanner . This scanner is the tool responsible for detecting the code.

image.png

After downloading, you can copy the instructions below to test the code!

image.png

SonarScanner test results

After the detection in the above steps, we can return to the SonarQube platform to see that the newly created project has a preliminary detection report. If there is no potential problem in the code, we can see that the report will be green Passed.

image.png

But if the code has potential problems, then the report will show a red Failed and indicate that there are several bugs generated.

image.png

Then click on the issues tab to see which line of the file the current potential bug is generated from.

image.png

After clicking again, you will see the error message of the potential bug. We can find that the length of the array must be greater than or equal to 0, but I wrote less than 0 , so this if judgment condition will never pass.

image.png

But when we go back to the code, we can find that even if we have installed linter, we will not check out this seemingly problematic way of writing, because linter usually checks for syntax errors, so SonarScanner helps us to make changes. In-depth inspection.

image.png

SonarScanner configuration

In fact, SonarScanner can also perform some custom configurations. At this time, you need to create a file called sonar-project.properties . This file can set some SonarScanner provided analysis parameter , because of these configurations There are too many parameters, so I will not introduce them one by one here. Interested readers can refer to the official website , which has a detailed introduction of all parameters. The overall writing method will be like the following figure:

image.png

Summarize

This time, I introduced the SonarQube code detection platform. Since the author is a front-end engineer, I will only use ESLint or TSLint to enter the code, but there will still be some potential bugs in the code, which may not be detected by these linters. At this time SonarQube has played a big role in helping us to conduct more in-depth analysis during development. If readers have to do some CI processes in the future, they may also consider SonarQube.


The bugs that may exist in editing cannot be known in real time. In order to solve these bugs afterwards, a lot of time is spent on log debugging. By the way, here is a useful BUG monitoring tool , Fundebug .

Author: Andy Chen Translator: Xiaozhi Source: medium

Original: https://medium.com/starbugs/%E5%8E%9F%E4%BE%86%E7%A8%8B%E5%BC%8F%E7%A2%BC%E5%93%81%E8 %B3%AA%E4%B9%9F%E5%8F%AF%E4%BB%A5%E8%A2%AB%E6%AA%A2%E6%B8%AC-%E5%88%9D%E6% 8E%A2-sonarqube-14e99687806e

comminicate

If you have dreams and dry goods, you can search for [Great Move to the World] on WeChat and pay attention to this Shawanzhi who is still washing dishes in the early hours of the morning.

This article GitHub https://github.com/qq449245884/xiaozhi has been included, there are complete test sites, materials and my series of articles for interviews with first-line manufacturers.


王大冶
68k 声望104.9k 粉丝