QUALITY GATES

OF WEB DEVELOPMENT

SPEAKER

{
	"name": "ng-henry-ruhs",
	"description": "Senior Frontend Engineer at Avantgarde Labs",
	"version": "1.9.82",
	"license": "GPL-3.0",
	"keywords":
	[
		"CMS Founder",
		"Frontend Architect",
		"JavaScript Evangelist",
		"WPO Expert",
		"GitHub Fanboy"
	],
	"website": "https://redaxmedia.com",	
	"twitter": "https://twitter.com/redaxmedia",
	"github": "https://github.com/redaxmedia"
}

QUALITY GATES

OVERVIEW

WHY IT MATTERS

CODE ANALYSIS

COMPREHENSIVE TESTING

CONTINUOUS WORKFLOW

REALTIME MONITORING

WORKING IN A TEAM

CONLUSIONS WE DRAW

QUALITY GATES

WHY IT MATTERS

1. Readability

2. Scalability

3. Modularity

4. Performance

5. Security

QUALITY GATES

CODE ANALYSIS

"Enforcing coding conventions"

ESLINT


npm install eslint


npm install eslint-plugin-security

TSLINT


npm install tslint


npm install tslint-eslint-rules

COPY PASTE DETECTOR


npm install jscpd

"No detector for dead code"

STYLELINT


npm install stylelint

COLORGUARD


npm install colorguard

BEM LINTER


npm install postcss-bem-linter

NCSS LINTER


npm install ncss-linter

HTMLLINT


npm install htmllint

JSONLINT


npm install jsonlint

QUALITY GATES

COMPREHENSIVE TESTING

"Don't turn things upside down"

1. Unit Testing

2. Integration Testing

3. System Testing

4. Acceptance Testing

"There are tons of other types"

QUALITY GATES

CONTINUOUS WORKFLOW

"Time to put things together"

LINT


npm run lint

TEST


npm run test

BUILD


npm run build

DEPLOY


npm run deploy

REPORT


npm run report

"Lower chance to break quality"

QUALITY GATES

REALTIME MONITORING

"Notify me on failures"

1. Server Health

2. Performance Score

3. Convertion Rate

4. Error Rate

QUALITY GATES

WORKING IN A TEAM

1. Use the Git workflow

2. Always perform code reviews

3. Protect branches with policies

4. Use commit or push hooks

5. Write more documentation

6. Make quality everyone's job

QUALITY GATES

CONCLUSIONS WE DRAW

1. Program with quality in mind

2. Automate quality assurance

3. Motivate your team for quality

4. Avoid to be a hero developer

"Ask your question now"


process.exit();

THANK YOU