Coding standard
AVASpace developers are following style guide developed by Angular developers, it is available here.
However, there are some points which are a bit different or needs to be emphasized:
- After each implementation run linting and fix issues,
- Use PascalCase for type names and enum values
- Do not use "I" as a prefix for interface names
- Remove all unnecessary variables, methods, classes, interfaces etc.
- Remove all unnecessary console.log
- Use camelCase for function names, property names and local variables
- Do not use "_" as a prefix for private properties
- Use one class, interface, function, pipe, directive etc. per one file
- Prefer use interfaces over classes
- Do not export types/functions unless you need to share it across multiple components
- Do not introduce new types/values to the global namespace if not needed
- Use JSDoc style comments for functions, interfaces, methods, enums, and classes
- Use single quotes for strings
- Localize all strings visible to the user
- Always surround loop and conditional bodies with curly braces
- Unsubscribe from observables
- Do not use any, always use type
- Use constants over strings
- Use constants for routing, routerLinks, API endpoints, etc. create these files pre module
- Names of functions, variables, methods, etc. should be meaningful
- Use whole words in names (functions, methods, variables, properties, etc.), do not use shortcuts
- Use correct naming of files (e.g. .component.ts, .interface.ts, .service.ts, .module.ts, etc.)
- Properly use protected, private and public accessors
- Protect all variables, methods, constants etc. in classes
- Every single file should have code lines within 400
- Every single function should have the code lines within 75
- Always have a habit of leaving an empty line between all the imports and modules
- Use lazy loading of modules
- Prefer using bootstrap classes over creating scss classes
- Do not use inline styles
- Do not override styles in scss files, all styles should be defined in UI kit
- Use variables from kit, do not create custom variables in scss files
- Do not use providedIn: root for locally used services, use it only for globally used service
- Use feature modules and encapsulate all functions, models, services, components, pipes it needs and uses
- Follow correct folder structure
- Folders should be named in plural
- Do use the @Input() and @Output() class decorators instead of the inputs and outputs properties of the @Directive and @Component metadata
- Delegate complex component logic to services
- Every class should have decorator @Injectable(), @Directive(), @Component etc.
- Use ApiDataService to API communication
- Use relative path instead of absolute path
- Use typed forms
- Try to avoid nested conditions (Minimize nesting article)