Upgrade to Pro — share decks privately, control downloads, hide ads and more …

SUPER Scalable and Reusable Structures w/Angular Schematics

SUPER Scalable and Reusable Structures w/Angular Schematics

Design and implement super scalable Angular enterprise size monorepo structures, and reuse them across many workspaces, with the power of the schematics cli, by writing your own custom schematics.

REPO: -> https://github.com/anfibiacreativa/plat-schematics

Natalia Venditto

May 22, 2019

More Decks by Natalia Venditto

Other Decks in Technology


  1. SUPER Scalable && Reusable Write it once and write it

    no more! Natalia Venditto @ voxxeddays.com/frontend
  2. Photo by Annie Spratt on Unsplash Common Deps, Vendor, State

    Mgm, ... Project 1 Project 2 Project n
  3. ARCHITECTURE SOLUTION + client-platform --+ projects ----+ client-corelib ------+ src

    --------+ lib --+ node_modules - tsconfig.json - package.json - angular.json
  4. ARCHITECTURE SOLUTION + client-platform --+ projects ----+ client-corelib ----+ client-app-one

    ----+ client-app-one-e2e --+ node_modules - tsconfig.json - package.json - angular.json
  5. SCHEMATICS FEATURES Defining and enforcing conventions Preserving solid patterns and

    best practices Preventing code/ tasks repetition or copy-pasting. AKA, promotes DRY
  6. SCHEMATICS VOCABULARY schematics A collection of descriptive and deterministic code

    generators, that grab a virtual file system (tree: Tree), apply some transformations (Actions) in a staging area, based upon a Rule, applied via a RuleFactory, to then return that modified tree
  7. SCHEMATICS FEATURES Schematics features Safe: they run on dry-run mode

    by default Extensible: you can chain as many schematics, as input to the next. Again, safe.
  8. STRUCTURE OBJECTIVE of our EXERCISE Folders Dedicated folder for every

    symbol type, such as component, service, pipe, etc Effective imports by using an alias
  9. Additional credits • Images are from unsplash.com • Icons are

    Feather Icons (https://github.com/feathericons/feather/blob/master/LICENSE)