CLP Eng Best Practices

Official Angular 2 Style Guide

  • Current Version:
    https://angular.io/docs/ts/latest/guide/style-guide.html
     
  • Angular 1 Version:
    https://github.com/johnpapa/angular-styleguide/blob/master/a1/README.md#style-y120
     
  • Angular 1 Sample Project:
    https://github.com/johnpapa/ng-demos/tree/master/modular

Application Structure

https://angular.io/docs/ts/latest/guide/style-guide.html#!#overall-structural-guidelines

Top Changes

  • Folders-by-Feature structure
  • `feature.type.js` naming convention
  • `shared` folder

 

Key Differences/Proposals

  • Continue to keep view layouts separately while still using Angular 1.x: Angular 1 [Y151] style rule
  • Prefix `shared` folder as `$shared`

CLP Proposed Structure

app/
+-- client/
|   +-- $shared/
|       +-- group/
|           +-- group.model.js        // Eliminate by just using Tyr models?
|           +-- group.service.js
|       +-- user/
|           +-- user.model.js         // Eliminate by just using Tyr models?
|           +-- user.service.js
|   +-- alignment/
|       +-- triangle-layer-item.controller.js      // Sub-folders as needed
|       +-- triangle-layer-item.directive.js
|       +-- triangle-layer-item.service.js
+-- common/
|   +-- mixins/                       // Eliminate by just using Tyr models?
|       +-- common-mixin.js
|       +-- group-mixin.js
|       +-- user-mixin.js
+-- server/
|   +-- $shared/
|       +-- group/
|           +-- group.model.js
|           +-- group.service.js                  // Combine with Tyr model?
|       +-- user/
|           +-- user.model.js
|           +-- user.service.js                   // Combine with Tyr model?
|   +-- alignment/
|       +-- triangle.controller.js
|       +-- presentation-notes.controller.js
lib/
+-- client/
+-- common/
+-- server/

Misc Notes

  • Ideal: Feature folders could be refactored into a standalone client or server module
  • Move some classes out of `lib/` to `app/`
    • Ex: `lib/angularUtils/client/services/user.js`
  • Use import barrels (link)

Analytics (Telemetry)

  • When to log from client vs server
    • Sharing functionality between Tyr and $angulartics
    • Argument format: ObjectIds on server, strings on client
  • Naming convention
    • Past vs present tense

CLP Eng Best Practices

By Christian Yang

CLP Eng Best Practices

  • 406