{"id":3736,"date":"2020-03-17T22:04:50","date_gmt":"2020-03-17T21:04:50","guid":{"rendered":"https:\/\/www.angulararchitects.io\/?p=3736"},"modified":"2020-03-17T22:04:50","modified_gmt":"2020-03-17T21:04:50","slug":"automating-your-angular-architecture-with-workspace-schematics-part-1-rules-and-parameters","status":"publish","type":"post","link":"https:\/\/www.angulararchitects.io\/en\/blog\/automating-your-angular-architecture-with-workspace-schematics-part-1-rules-and-parameters\/","title":{"rendered":"Automating Your Angular Architecture with Workspace Schematics – Part 1: Rules and Parameters"},"content":{"rendered":"

Defining an architecture is exciting. However, implementing it can also be boring because it involves dealing with the same patterns and practices time and again. Automating this task with scaffolding is the solution. Fortunately, the Angular CLI itself comes with a scaffolding tool called Schematics.<\/p>\n

In this article series, I show how to use Schematics within a monorepo. For this, I'm using Workspace Schematics provided by Nx. While everything I show also works with an classic Angular project, Nx provides some tooling and hence increases the convenience.<\/p>\n

As always, the source code<\/a> can be found in my GitHub account<\/a>.<\/p>\n

Example<\/h2>\n

The architecture I automate in this article series is subdividing a big application into (more or less) self contained sub domains:<\/p>\n

\"Architecture<\/p>\n

This style which I described in my blog series about Domain Driven Design<\/a> decouples the domains from each other and hence makes breaking changes between domains more unlikely. Also, it limits the complexity. If you already know this article, you can directly proceed with the next section.<\/p>\n

In our architecture, each domain has several libraries within a monorepo. Feature libraries implement use cases with smart components. Domain libraries consist of our domain logic and a domain model. Also, there are some other types of libraries as outlined in the mentioned blog series<\/a>.<\/p>\n

To prevent that the individual libraries depend too much on each other there are access rules. They are implied by the arrows in the last picture. According to that, one layer is only allowed to access layers below. In the simplified version here this means that a feature can access the domain but not vice verse. The more important access rule, however, states that libraries in one domain can only access other libraries in the very same domain as well as in the shared slice.
\nWithin the mononorepo's lib<\/code> folder there is one sub folder per domain. This folder contains the domain's libraries:<\/p>\n

\"Folders<\/p>\n

Nx allows us to enforce the mentioned access rules between libraries. For this, we have to assign tags to each library within nx.json<\/code>:<\/p>\n

[...]\n"catalog-domain": {\n    "tags": ["domain:catalog", "type:domain-logic"]\n},\n"ordering-domain": {\n    "tags": ["domain:ordering", "type:domain-logic"]\n},\n[...]<\/code><\/pre>\n
Then, within tsconfig.json<\/code> we can use the rule nx-enforce-module-boundaries<\/code> to define restrictions <\/p>\n
[...]\n"nx-enforce-module-boundaries": [\n  true,\n  {\n    "allow": [],\n    "depConstraints": [\n      {\n        "sourceTag": "*",\n        "onlyDependOnLibsWithTags": ["*"]\n      },\n      {\n        "sourceTag": "domain:catalog",\n        "onlyDependOnLibsWithTags": ["domain:catalog", "shared"]\n      },\n      {\n        "sourceTag": "domain:ordering",\n        "onlyDependOnLibsWithTags": ["domain:ordering", "shared"]\n      }\n    ]\n  }\n],\n[...]<\/code><\/pre>\n
As you can imagine, while this architecture is clear and prevents coupling, creating all the building blocks as well as configuring the linting rule is monotonous and time-consuming. Fortunately, as the next sections show, we can automate all this with Schematics.<\/p>\n
More about this very architecture can be found in my other blog articles here. Also, working with architectures like this one is a big topic in our Angular Workshops<\/a>.<\/p>\n
<\/p>\n
<\/p>\n
<\/a><\/p>\n
About Workspace Schematics<\/h2>\n
To scaffold files the Angular CLI uses a tool called Schematics. Every time we call ng new<\/code>, ng generate<\/code>, ng add<\/code>, and ng update<\/code> the CLI delegates to it. However, it also allows to write custom code generators which are also called schematics.<\/p>\n
While we can directly setup a Schematics project and distribute it via npm, Nrwl's Nx provides a more convenient way: It allows to scaffold a new schematic within a workspace like we scaffold components or services. Also, it provides a command to compile and execute it in the same workspace.<\/p>\n
As the schematics are part of the monorepo where they are used, this approach is the right one for generating code which is very project specific. <\/p>\n
Scaffolding a workspace schematic<\/h2>\n
After creating an Nx workspace using<\/p>\n
npx create-nx-workspace@latest e-proc<\/code><\/pre>\n
we can scaffold a workspace schematic:<\/p>\n
ng g workspace-schematic demo-lib<\/code><\/pre>\n
This creates two files -- an index.ts<\/code> with the schematic's implementation and a schema.json<\/code> describing the parameters we can pass to the schematic:<\/p>\n
\"ng<\/p>\n
The generated schema.json<\/code> looks like this:<\/p>\n
{\n  "$schema": "http:\/\/json-schema.org\/schema",\n  "id": "domain",\n  "type": "object",\n  "properties": {\n    "name": {\n      "type": "string",\n      "description": "Library name",\n      "$default": {\n        "$source": "argv",\n        "index": 0\n      }\n    }\n  },\n  "required": ["name"]\n}<\/code><\/pre>\n
It just defines a required parameter name<\/code>. According to the $default<\/code> property, it gets the value of the first passed parameter if not specified explicitly using --name<\/code>. Hence, we can call it with the Nx CLI using <\/p>\n
nx workspace-schematic domain myDomain<\/code><\/pre>\n
or using<\/p>\n
nx workspace-schematic domain --name myDomain<\/code><\/pre>\n
The generated implementation within index.ts<\/code> just contains a rule factory:<\/p>\n
import { chain, externalSchematic, Rule } from '@angular-devkit\/schematics';\n\nexport default function(schema: any): Rule {\n  return chain([\n    externalSchematic('@nrwl\/workspace', 'lib', {\n      name: schema.name\n    })\n  ]);\n}<\/code><\/pre>\n
Rules are the individual steps needed to scaffold files. The returned rule is a chain<\/code> which just calls other rules in sequence. The only rule chain<\/code> currently delegates to is externalSchematic<\/code>. As the name indicates, it is calling another schematic. In this case it is the lib<\/code> schematic which is also called when running ng generate lib<\/code> by hand.<\/p>\n
Please also note the schema<\/code> parameter. It contains all passed command line parameters and has the structure described by the schema.json<\/code> file.<\/p>\n
After looking at these generated files, let's now find out how to modify them for our own goals.<\/p>\n
Generating a TypeScript Interface for schema.json<\/h2>\n
As using any for the schema parameter is somewhat unpretty, let's provide a type for it. In order to not repeat ourselves we should generate it out of the schema.json<\/code>. The npm package json-schema-to-typescript<\/code> can help with this:<\/p>\n
\"npm<\/p>\n
We can call it within a simple node script I'm calling json-schema-to-ts.js<\/code>:<\/p>\n
const toTypeScript = require('json-schema-to-typescript');\nconst fs = require('fs');\n\ntoTypeScript\n    .compileFromFile('tools\/schematics\/domain\/schema.json')\n    .then(ts => fs.writeFileSync('tools\/schematics\/domain\/schema.ts', ts));<\/code><\/pre>\n
For calling it, I've also defined an npm script in my package.json<\/code>:<\/p>\n
[...]\n"scripts": {\n    [...]\n    "build:schema": "node tools\/schematics\/json-schema-to-ts.js"\n} \n[...]<\/code><\/pre>\n
Now, after running<\/p>\n
\"npm<\/p>\n
we get this file:<\/p>\n
export interface Domain {\n  \/**\n   * Library name\n   *\/\n  name: string;\n  [k: string]: any;\n}<\/code><\/pre>\n
Perhaps you've noticed that the name of this interface is the value of the id<\/code> property in the schema.json<\/code>.<\/p>\n
Step 3: Defining Options<\/h2>\n
Now, let's add an additional parameter addApp<\/code>:<\/p>\n
{\n  "$schema": "http:\/\/json-schema.org\/schema",\n  "id": "domain-options",\n  "type": "object",\n  "properties": {\n    "name": {\n      "type": "string",\n      "description": "Domain name",\n      "$default": {\n        "$source": "argv",\n        "index": 0\n      }\n    },\n    "addApp": {\n      "type": "boolean",\n      "description": "Add an app for the domain?",\n      "default": false\n    }\n  },\n  "required": ["name"]\n}<\/code><\/pre>\n
If set to true<\/code>, it shall also generate an app for the domain we're scaffolding. Also, I've set the id<\/code> property to DomainOptions<\/code> to influence the name of the generated interface.<\/p>\n
After calling<\/p>\n
\"npm<\/p>\n
one more time, we get this:<\/p>\n
export interface DomainOptions {\n  \/**\n   * Domain name\n   *\/\n  name: string;\n  \/**\n   * Add an app for the domain?\n   *\/\n  addApp?: boolean;\n  [k: string]: any;\n}<\/code><\/pre>\n
Also, we can now type the options property with this interface:<\/p>\n
export default function(options: DomainOptions): Rule {\n    [...]\n}<\/code><\/pre>\n
Calling Existing Rules<\/h2>\n
As we have a property for the addApp<\/code> command line option now, we can use it within the rule:<\/p>\n
  return chain([\n    externalSchematic('@nrwl\/angular', 'lib', {\n      name: 'domain',\n      directory: options.name,\n      tags: domain:${options.name},type:domain-logic<\/code>,\n      style: 'scss',\n    }),\n    (!options.addApp) ? \n      noop() : \n      externalSchematic('@nrwl\/angular', 'app', {\n        name: options.name,\n        tags: domain:${options.name},type:app<\/code>,\n        style: 'scss',\n      }),\n  ]);<\/code><\/pre>\n
This enhanced rule is chaining the noop<\/code> (no operation) rule, if addApp<\/code> is false<\/code>. In this case, nothing happens. Otherwise, it executes the app<\/code> schematic using externalSchematic<\/code>.<\/p>\n
Both externalSchematic<\/code> calls also get some parameters, like the library's directory which is the domain name or tags for nx.json<\/code>.<\/p>\n
Creating a Custom Rules<\/h2>\n
So far, we used existing rules for our needs. But when it comes to updating the linting rules within tsconfig.json<\/code>, we need to write a custom one.<\/p>\n
For this rule, we need a factory with the parameters we want to pass:<\/p>\n
export function updateLintingRules(domainName: string): Rule {\n    return (host: Tree, context: SchematicContext) => {\n        [...]\n    }\n}<\/code><\/pre>\n
The retuned rule is also just a function taking a Tree<\/code> and a SchematicContext<\/code>. The Tree<\/code> represents your file system. Honestly, it is more of a staging area representing your file system. <\/p>\n
This is an important concept of Schematics: The changes in the staging environment are only written to hard disk if everything worked. If there was an error, no change is written. This prevents getting an inconsistence state.<\/p>\n
The full implementation of this rule is just reading the tslint.json<\/code>. After parsing, the resulting object graph is changed and written back to the same file:<\/p>\n
import { Rule, Tree, SchematicContext  } from '@angular-devkit\/schematics';\n\nexport function updateLintingRules(domainName: string): Rule {\n    return (host: Tree, context: SchematicContext) => {\n      const text = host.read('tslint.json').toString();\n      const rules = JSON.parse(text);\n\n      \/\/ Make sure, rules['rules']['nx-enforce-module-boundaries'][1]['depConstraints'] exists!\n\n      const depConst = rules['rules']['nx-enforce-module-boundaries'][1]['depConstraints'];\n\n      depConst.push({\n        'sourceTag': domain:${domainName}<\/code>,\n        'onlyDependOnLibsWithTags': [domain:${domainName}<\/code>, 'shared']\n      });\n\n      const newText = JSON.stringify(rules, undefined, 2);\n      host.overwrite('tslint.json', newText);\n    }\n  }<\/code><\/pre>\n
As you see here, it adds an access restriction preventing libraries in the added domain to access libraries in other domains. The only exception is the shared slice. <\/p>\n
After providing this rule, we can call it in our schematic:<\/p>\n
  return chain([\n    externalSchematic('@nrwl\/angular', 'lib', {\n      name: 'domain',\n      directory: options.name,\n      tags: domain:${options.name},type:domain-logic<\/code>,\n      style: 'scss',\n    }),\n    (!options.addApp) ? \n      noop() : \n      externalSchematic('@nrwl\/angular', 'app', {\n        name: options.name,\n        tags: domain:${options.name},type:app<\/code>,\n        style: 'scss',\n      }),\n    \/\/ Added Rule vvvvvv\n    updateLintingRules(options.name),\n  ]);<\/code><\/pre>\n
Calling the Workspace Schematic<\/h2>\n
Now, let's call our workspace schematic. To make my live easier, I've installed the Nx CLI for that globally:<\/p>\n
\"npm<\/p>\n
Using it, we can execute our schematic:<\/p>\n
\"ng<\/p>\n
It created the domain library, the application and adds the access rules to the tslint.json<\/code>.<\/p>\n
Conclusion and Outlook<\/h2>\n
Nx makes creating workspace schematics really easy. We can scaffold them with ng generate<\/code> and execute them with nx workspace-schematic<\/code>. <\/p>\n
For defining parameters, we modify the schema.json<\/code>. To access them in a typed way, we should generate an interface out of it.<\/p>\n
The automation of our repeating tasks is accomplished by rules which are just functions. Besides using existing rules like externalSchematic<\/code> we can also write our own ones.<\/p>\n
Besides this, schematics can also modify existing files and generate new ones by copying templates<\/strong>. The latter ones can contain placeholders which are populated with concrete values. The next article of this series will show more about this possibility.<\/p>\n","protected":false},"excerpt":{"rendered":"
Defining an architecture is exciting. However, implementing it can also be boring. Automation with scaffolding is the solution. <\/p>\n","protected":false},"author":9,"featured_media":3716,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_price":"","_stock":"","_tribe_ticket_header":"","_tribe_default_ticket_provider":"","_ticket_start_date":"","_ticket_end_date":"","_tribe_ticket_show_description":"","_tribe_ticket_show_not_going":false,"_tribe_ticket_use_global_stock":"","_tribe_ticket_global_stock_level":"","_global_stock_mode":"","_global_stock_cap":"","_tribe_rsvp_for_event":"","_tribe_ticket_going_count":"","_tribe_ticket_not_going_count":"","_tribe_tickets_list":"[]","_tribe_ticket_has_attendee_info_fields":false,"footnotes":""},"categories":[1],"tags":[],"class_list":["post-3736","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-unkategorisiert"],"acf":[],"yoast_head":"\nAutomating Your Angular Architecture with Workspace Schematics - Part 1: Rules and Parameters - ANGULARarchitects<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.angulararchitects.io\/en\/aktuelles\/automating-your-angular-architecture-with-workspace-schematics-part-1-rules-and-parameters\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Automating Your Angular Architecture with Workspace Schematics - Part 1: Rules and Parameters - ANGULARarchitects\" \/>\n<meta property=\"og:description\" content=\"Defining an architecture is exciting. However, implementing it can also be boring. Automation with scaffolding is the solution.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.angulararchitects.io\/en\/aktuelles\/automating-your-angular-architecture-with-workspace-schematics-part-1-rules-and-parameters\/\" \/>\n<meta property=\"og:site_name\" content=\"ANGULARarchitects\" \/>\n<meta property=\"article:published_time\" content=\"2020-03-17T21:04:50+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2020\/03\/cover21.gif\" \/>\n\t<meta property=\"og:image:width\" content=\"640\" \/>\n\t<meta property=\"og:image:height\" content=\"427\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/gif\" \/>\n<meta name=\"author\" content=\"Manfred Steyer, GDE\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@daniel\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Manfred Steyer, GDE\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"9 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/www.angulararchitects.io\/en\/aktuelles\/automating-your-angular-architecture-with-workspace-schematics-part-1-rules-and-parameters\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.angulararchitects.io\/en\/blog\/automating-your-angular-architecture-with-workspace-schematics-part-1-rules-and-parameters\/\"},\"author\":{\"name\":\"Manfred Steyer, GDE\",\"@id\":\"https:\/\/www.angulararchitects.io\/en\/#\/schema\/person\/15628efa7af4475ffaaeeb26c5112951\"},\"headline\":\"Automating Your Angular Architecture with Workspace Schematics – Part 1: Rules and Parameters\",\"datePublished\":\"2020-03-17T21:04:50+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.angulararchitects.io\/en\/blog\/automating-your-angular-architecture-with-workspace-schematics-part-1-rules-and-parameters\/\"},\"wordCount\":1265,\"publisher\":{\"@id\":\"https:\/\/www.angulararchitects.io\/en\/#organization\"},\"image\":{\"@id\":\"https:\/\/www.angulararchitects.io\/en\/aktuelles\/automating-your-angular-architecture-with-workspace-schematics-part-1-rules-and-parameters\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2020\/03\/cover21.gif\",\"articleSection\":[\"Unkategorisiert\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.angulararchitects.io\/en\/blog\/automating-your-angular-architecture-with-workspace-schematics-part-1-rules-and-parameters\/\",\"url\":\"https:\/\/www.angulararchitects.io\/en\/aktuelles\/automating-your-angular-architecture-with-workspace-schematics-part-1-rules-and-parameters\/\",\"name\":\"Automating Your Angular Architecture with Workspace Schematics - Part 1: Rules and Parameters - ANGULARarchitects\",\"isPartOf\":{\"@id\":\"https:\/\/www.angulararchitects.io\/en\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.angulararchitects.io\/en\/aktuelles\/automating-your-angular-architecture-with-workspace-schematics-part-1-rules-and-parameters\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.angulararchitects.io\/en\/aktuelles\/automating-your-angular-architecture-with-workspace-schematics-part-1-rules-and-parameters\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2020\/03\/cover21.gif\",\"datePublished\":\"2020-03-17T21:04:50+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/www.angulararchitects.io\/en\/aktuelles\/automating-your-angular-architecture-with-workspace-schematics-part-1-rules-and-parameters\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.angulararchitects.io\/en\/aktuelles\/automating-your-angular-architecture-with-workspace-schematics-part-1-rules-and-parameters\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.angulararchitects.io\/en\/aktuelles\/automating-your-angular-architecture-with-workspace-schematics-part-1-rules-and-parameters\/#primaryimage\",\"url\":\"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2020\/03\/cover21.gif\",\"contentUrl\":\"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2020\/03\/cover21.gif\",\"width\":640,\"height\":427},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.angulararchitects.io\/en\/aktuelles\/automating-your-angular-architecture-with-workspace-schematics-part-1-rules-and-parameters\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.angulararchitects.io\/en\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Automating Your Angular Architecture with Workspace Schematics – Part 1: Rules and Parameters\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.angulararchitects.io\/en\/#website\",\"url\":\"https:\/\/www.angulararchitects.io\/en\/\",\"name\":\"ANGULARarchitects\",\"description\":\"AngularArchitects.io\",\"publisher\":{\"@id\":\"https:\/\/www.angulararchitects.io\/en\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.angulararchitects.io\/en\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.angulararchitects.io\/en\/#organization\",\"name\":\"ANGULARarchitects\",\"alternateName\":\"SOFTWAREarchitects\",\"url\":\"https:\/\/www.angulararchitects.io\/en\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.angulararchitects.io\/en\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2023\/07\/AA-Logo-RGB-horizontal-inside-knowledge-black.svg\",\"contentUrl\":\"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2023\/07\/AA-Logo-RGB-horizontal-inside-knowledge-black.svg\",\"width\":644,\"height\":216,\"caption\":\"ANGULARarchitects\"},\"image\":{\"@id\":\"https:\/\/www.angulararchitects.io\/en\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/github.com\/angular-architects\",\"https:\/\/www.linkedin.com\/company\/angular-architects\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.angulararchitects.io\/en\/#\/schema\/person\/15628efa7af4475ffaaeeb26c5112951\",\"name\":\"Manfred Steyer, GDE\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.angulararchitects.io\/en\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/a0b59539674d8b71ea1c1f4764b11244b5f499203f1d11b40f37d8f3f90be033?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/a0b59539674d8b71ea1c1f4764b11244b5f499203f1d11b40f37d8f3f90be033?s=96&d=mm&r=g\",\"caption\":\"Manfred Steyer, GDE\"},\"sameAs\":[\"https:\/\/x.com\/daniel\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Automating Your Angular Architecture with Workspace Schematics - Part 1: Rules and Parameters - ANGULARarchitects","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.angulararchitects.io\/en\/aktuelles\/automating-your-angular-architecture-with-workspace-schematics-part-1-rules-and-parameters\/","og_locale":"en_US","og_type":"article","og_title":"Automating Your Angular Architecture with Workspace Schematics - Part 1: Rules and Parameters - ANGULARarchitects","og_description":"Defining an architecture is exciting. However, implementing it can also be boring. Automation with scaffolding is the solution.","og_url":"https:\/\/www.angulararchitects.io\/en\/aktuelles\/automating-your-angular-architecture-with-workspace-schematics-part-1-rules-and-parameters\/","og_site_name":"ANGULARarchitects","article_published_time":"2020-03-17T21:04:50+00:00","og_image":[{"width":640,"height":427,"url":"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2020\/03\/cover21.gif","type":"image\/gif"}],"author":"Manfred Steyer, GDE","twitter_card":"summary_large_image","twitter_creator":"@daniel","twitter_misc":{"Written by":"Manfred Steyer, GDE","Est. reading time":"9 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.angulararchitects.io\/en\/aktuelles\/automating-your-angular-architecture-with-workspace-schematics-part-1-rules-and-parameters\/#article","isPartOf":{"@id":"https:\/\/www.angulararchitects.io\/en\/blog\/automating-your-angular-architecture-with-workspace-schematics-part-1-rules-and-parameters\/"},"author":{"name":"Manfred Steyer, GDE","@id":"https:\/\/www.angulararchitects.io\/en\/#\/schema\/person\/15628efa7af4475ffaaeeb26c5112951"},"headline":"Automating Your Angular Architecture with Workspace Schematics – Part 1: Rules and Parameters","datePublished":"2020-03-17T21:04:50+00:00","mainEntityOfPage":{"@id":"https:\/\/www.angulararchitects.io\/en\/blog\/automating-your-angular-architecture-with-workspace-schematics-part-1-rules-and-parameters\/"},"wordCount":1265,"publisher":{"@id":"https:\/\/www.angulararchitects.io\/en\/#organization"},"image":{"@id":"https:\/\/www.angulararchitects.io\/en\/aktuelles\/automating-your-angular-architecture-with-workspace-schematics-part-1-rules-and-parameters\/#primaryimage"},"thumbnailUrl":"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2020\/03\/cover21.gif","articleSection":["Unkategorisiert"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/www.angulararchitects.io\/en\/blog\/automating-your-angular-architecture-with-workspace-schematics-part-1-rules-and-parameters\/","url":"https:\/\/www.angulararchitects.io\/en\/aktuelles\/automating-your-angular-architecture-with-workspace-schematics-part-1-rules-and-parameters\/","name":"Automating Your Angular Architecture with Workspace Schematics - Part 1: Rules and Parameters - ANGULARarchitects","isPartOf":{"@id":"https:\/\/www.angulararchitects.io\/en\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.angulararchitects.io\/en\/aktuelles\/automating-your-angular-architecture-with-workspace-schematics-part-1-rules-and-parameters\/#primaryimage"},"image":{"@id":"https:\/\/www.angulararchitects.io\/en\/aktuelles\/automating-your-angular-architecture-with-workspace-schematics-part-1-rules-and-parameters\/#primaryimage"},"thumbnailUrl":"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2020\/03\/cover21.gif","datePublished":"2020-03-17T21:04:50+00:00","breadcrumb":{"@id":"https:\/\/www.angulararchitects.io\/en\/aktuelles\/automating-your-angular-architecture-with-workspace-schematics-part-1-rules-and-parameters\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.angulararchitects.io\/en\/aktuelles\/automating-your-angular-architecture-with-workspace-schematics-part-1-rules-and-parameters\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.angulararchitects.io\/en\/aktuelles\/automating-your-angular-architecture-with-workspace-schematics-part-1-rules-and-parameters\/#primaryimage","url":"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2020\/03\/cover21.gif","contentUrl":"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2020\/03\/cover21.gif","width":640,"height":427},{"@type":"BreadcrumbList","@id":"https:\/\/www.angulararchitects.io\/en\/aktuelles\/automating-your-angular-architecture-with-workspace-schematics-part-1-rules-and-parameters\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.angulararchitects.io\/en\/"},{"@type":"ListItem","position":2,"name":"Automating Your Angular Architecture with Workspace Schematics – Part 1: Rules and Parameters"}]},{"@type":"WebSite","@id":"https:\/\/www.angulararchitects.io\/en\/#website","url":"https:\/\/www.angulararchitects.io\/en\/","name":"ANGULARarchitects","description":"AngularArchitects.io","publisher":{"@id":"https:\/\/www.angulararchitects.io\/en\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.angulararchitects.io\/en\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.angulararchitects.io\/en\/#organization","name":"ANGULARarchitects","alternateName":"SOFTWAREarchitects","url":"https:\/\/www.angulararchitects.io\/en\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.angulararchitects.io\/en\/#\/schema\/logo\/image\/","url":"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2023\/07\/AA-Logo-RGB-horizontal-inside-knowledge-black.svg","contentUrl":"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2023\/07\/AA-Logo-RGB-horizontal-inside-knowledge-black.svg","width":644,"height":216,"caption":"ANGULARarchitects"},"image":{"@id":"https:\/\/www.angulararchitects.io\/en\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/github.com\/angular-architects","https:\/\/www.linkedin.com\/company\/angular-architects\/"]},{"@type":"Person","@id":"https:\/\/www.angulararchitects.io\/en\/#\/schema\/person\/15628efa7af4475ffaaeeb26c5112951","name":"Manfred Steyer, GDE","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.angulararchitects.io\/en\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/a0b59539674d8b71ea1c1f4764b11244b5f499203f1d11b40f37d8f3f90be033?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/a0b59539674d8b71ea1c1f4764b11244b5f499203f1d11b40f37d8f3f90be033?s=96&d=mm&r=g","caption":"Manfred Steyer, GDE"},"sameAs":["https:\/\/x.com\/daniel"]}]}},"_links":{"self":[{"href":"https:\/\/www.angulararchitects.io\/en\/wp-json\/wp\/v2\/posts\/3736","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.angulararchitects.io\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.angulararchitects.io\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.angulararchitects.io\/en\/wp-json\/wp\/v2\/users\/9"}],"replies":[{"embeddable":true,"href":"https:\/\/www.angulararchitects.io\/en\/wp-json\/wp\/v2\/comments?post=3736"}],"version-history":[{"count":0,"href":"https:\/\/www.angulararchitects.io\/en\/wp-json\/wp\/v2\/posts\/3736\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.angulararchitects.io\/en\/wp-json\/wp\/v2\/media\/3716"}],"wp:attachment":[{"href":"https:\/\/www.angulararchitects.io\/en\/wp-json\/wp\/v2\/media?parent=3736"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.angulararchitects.io\/en\/wp-json\/wp\/v2\/categories?post=3736"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.angulararchitects.io\/en\/wp-json\/wp\/v2\/tags?post=3736"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}