Skip to content
Skillv1.0.0

angular-best-practices-material

Angular Material and CDK best practices. Covers selective imports, M3 theming, CDK utilities, and component test harnesses. Activates when working with @angular/material and @angular/cdk. Do not use f

by alfredoperez(0) 0 installs
Free
Sign in to install

Free account. Installing gives you the manifest plus copy-paste snippets.

See reviews

About

Imported from alfredoperez/angular-best-practices (skills/angular-best-practices-material/SKILL.md) via skills.sh. Install upstream with npx skills add alfredoperez/angular-best-practices --skill angular-best-practices-material. Copyright stays with the author (MIT).

Angular Material Best Practices

Angular Material and CDK rules for component usage, theming, and testing. Use with the core angular-best-practices skill for comprehensive Angular coverage.

Links

When to Apply

  • Importing and configuring Material components
  • Setting up M3 theming with design tokens
  • Using CDK utilities for overlays, drag-and-drop, or virtual scrolling
  • Writing tests for Material components

Rules

Rule Impact Description
Import Material Modules Selectively MEDIUM Tree-shake unused components with standalone imports
Use Angular Material Theming System MEDIUM M3 theme API with CSS custom properties
Use CDK Utilities Over Custom Implementations MEDIUM Battle-tested overlays, virtual scroll, and a11y primitives
Use Test Harnesses for Material Components HIGH Stable tests that survive internal DOM changes

Install

Install from skills.sh/alfredoperez/angular-best-practices:

Use it

Copy one of these into your project. Installing also returns the manifest and these snippets.

yaml
targets:
  - https://api.opensmartroute.ai/api/v1/registry/alfredoperez-angular-best-practices-angular-best-practic-2ceb4d/manifest   # or paste the manifest below

Manifest

An Open Capability Manifest: the router reads it to know what this does, what it costs and when to pick it.

alfredoperez-angular-best-practices-angular-best-practic-2ceb4d.ocm.jsonjson
{
  "ocm": "1",
  "id": "alfredoperez-angular-best-practices-angular-best-practic-2ceb4d",
  "kind": "skill",
  "name": "angular-best-practices-material",
  "description": "Angular Material and CDK best practices. Covers selective imports, M3 theming, CDK utilities, and component test harnesses. Activates when working with @angular/material and @angular/cdk. Do not use for PrimeNG, Spartan UI, or other component libraries. Install alongside angular-best-practices for full coverage.",
  "publisher": "alfredoperez",
  "version": "1.0.0",
  "capabilities": {
    "domains": [
      "general"
    ],
    "tags": [
      "skill-md",
      "angular",
      "material",
      "cdk",
      "ui-components",
      "skills-sh"
    ],
    "languages": [
      "en"
    ]
  },
  "quality_prior": 0.6,
  "examples": [
    "Angular Material and CDK best practices. Covers selective imports, M3 theming, CDK utilities, and component test harnesses. Activates when working with @angular/material and @angular/cdk. Do not use for PrimeNG, Spartan UI, or other component libraries. Install alongside angular-best-practices for full coverage."
  ],
  "primary": false,
  "metadata": {
    "source": {
      "provider": "skills.sh",
      "repository": "https://github.com/alfredoperez/angular-best-practices",
      "path": "skills/angular-best-practices-material/SKILL.md",
      "ref": "HEAD",
      "url": "https://www.skills.sh/alfredoperez/angular-best-practices/angular-best-practices-material",
      "key": "alfredoperez/angular-best-practices/skills/angular-best-practices-material/SKILL.md"
    },
    "license": "MIT"
  },
  "instructions": "# Angular Material Best Practices\n\nAngular Material and CDK rules for component usage, theming, and testing. Use with the core\n[angular-best-practices](https://skills.sh/alfredoperez/angular-best-practices/angular-best-practices)\nskill for comprehensive Angular coverage.\n\n## Links\n\n- [Core Skill: angular-best-practices](https://skills.sh/alfredoperez/angular-best-practices/angular-best-practices)\n- [Browse All Skills](https://skills.sh/alfredoperez/angular-best-practices)\n- [GitHub Repository](https://github.com/alfredoperez/angular-best-practices)\n\n## When to Apply\n\n- Importing and configurin",
  "cost": {
    "context_tokens": 413
  }
}

Fetch it by URL: GET /api/v1/registry/alfredoperez-angular-best-practices-angular-best-practic-2ceb4d/manifest?version=1.0.0

Reviews

Star ratings from people who tried it. One review per account; edit yours any time.

No reviews yet. Install it, try it, and be the first to rate it.