BEST PRACTICES - ANGULAR

BEST PRACTICES FOR CLEAN CODE IN ANGULAR DEVELOPMENT

Code ethics is important because it defines clearly, a procedure to follow during development. This is to ensure code maintainability avoiding confusions between current developers and coders who might attempt updating such a code base at a later age.

Bear in mind, there is no strict universal rule pertaining to this and as such, guidelines differ and mostly depend on company policies.

However, some lay down code ethics is needed during angular development and we discuse such below.

1. Documentation

Always document the code. It will help you to later know what the code was about and helping new and young developers to equally understand the code base as well.

A bardly formated code is like a nut in the desert. It vanishes without any trace and never to be found. 

2. State management

This helps in managing state transitions by storing the state of any form of data: Ok buttons, text fields, radio buttons, submit buttons and more.  

3. Don’t use type ‘any’

Type ‘any’ could resolve in unintended bugs. Declare variables with types as it gives a surest root to clean code with less bugs.

4. Lazy loading

Load components only when it is needed. Reducing sluggishness of an application whilst reducing load time is a plus for both the developer and application users. 

Lazy loading a component or module only when it is needed increase application boot time.

5. Const and Let

When certain a value is not going to be changed, use const instead of let and vice versa.

6. 400 lines per file

As a general coding standard, maintain the 400 lines per file ethic and try not to exceed. Obviously, a 1000+ lines in a file can be messy when something goes wrong.

7. Don’t bloat functions

Bloating functions in code logics can be prone to many errors and sluggish code. As a general rule, maintain 75 lines perf unction and use es6 to minify the code.

8. Angular CLI

Folder structure in an application is highly important. This can be messy when building everything from scrach. Luckily with angular cli, it helps organized application into cohesive structure when used to bootstrap an application, in creating components, modules and services.

9. camel case naming

Properties and method names should be in lower camel case

10. Tslint

Tslint will help improve code formating for clearity of code expression.