Angular Best Practices Material

What it does

This skill provides a curated set of best practices specifically for building Angular applications using Material Design components. It ensures your frontend code adheres to industry standards for structure, styling, and component usage within the Angular ecosystem.

When to use it

• You are scaffolding a new Angular project that requires Material UI components.
• Your team needs consistent guidelines for implementing Material directives and styles.
• You want to refactor existing Angular code to align with Material Design principles.
• You need to ensure accessibility and performance standards specific to Angular-Material integrations.

Key capabilities

• Enforces Angular-specific patterns when utilizing Google's Material Design library.
• Provides standardized approaches for component architecture within Angular projects.
• Guides the implementation of Material theming and styling conventions.
• Offers best practices for state management and data binding in Material components.

Example prompts

• "Generate an Angular service that manages user authentication using Material Design dialogs."
• "Create a responsive Angular dashboard layout utilizing Material Grid and Card components."
• "Refactor this existing Angular form to use Material inputs with proper validation states."

Tips & gotchas

Ensure your project has the @angular/material package installed before applying these practices, as the skill relies on specific library features. While this skill focuses on Material Design, always verify compatibility with your specific Angular version to avoid breaking changes in newer releases.