Back to Skills

angular-new-app

Creates a new Angular app using the Angular CLI. This skill should be used whenever a user wants to create a new Angular application and contains important guidelines for how to effectively create a modern Angular application.

344stars28forksUpdated 5/14/2026

Security Assessment

Safe(100/100)
Security Score100/100

About angular-new-app

The `angular-new-app` skill provides developers with a streamlined method to create new Angular applications using the Angular CLI. It addresses the challenges of setting up modern Angular projects by guiding users through prerequisite checks, application scaffolding, and configuration setup, ensuring adherence to Angular best practices. By automating and standardizing these steps, the skill reduces setup errors and accelerates the development of maintainable, performant, and accessible Angular applications.

Key capabilities of this skill include verifying the presence of the Angular CLI, facilitating the creation of new Angular projects with customizable options, and loading AI configuration for consistent code generation aligned with modern Angular standards. It supports commonly used flags for stylesheets, routing, server-side rendering, component prefixes, and test inclusion. Additionally, the skill provides structured guidelines for generating Angular code elements such as components, services, directives, pipes, guards, interceptors, resolvers, enums, and classes. Integration with Tailwind CSS is also supported through a simple addition command, allowing developers to leverage modern styling frameworks seamlessly.

This skill is ideal for web developers, frontend engineers, and software teams focused on Angular and TypeScript projects. It is particularly useful for those who want to quickly scaffold new applications while maintaining consistency with industry best practices. Use cases include creating new single-page applications, implementing server-side rendering projects, or setting up projects ready for AI-assisted code generation. It is suited for environments where Node.js, npm, and internet access are available, and for teams aiming to standardize project setup and accelerate development workflows.

FAQ

How do I check if the Angular CLI is installed?

On Unix-based systems, run `which ng`. On Windows, use `where ng` or in PowerShell, `gcm ng`. If not installed, you can install it globally with `npm install -g @angular/cli`.

What are the minimum system requirements for using this skill?

You need Node.js, npm, and an active internet connection to create and manage Angular applications with this skill.

Can I customize the new Angular application when creating it?

Yes, you can specify the stylesheet format (`scss`, `css`, `less`), enable routing, server-side rendering, set a component selector prefix, and optionally skip tests. AI configuration options can also be specified to align with the developer environment.

How do I generate Angular components and other elements?

Use the Angular CLI commands via this skill, such as `npx ng generate component <component-name>`, `npx ng generate service <service-name>`, and similar commands for directives, pipes, guards, interceptors, resolvers, enums, interfaces, and classes.

Does this skill support modern styling frameworks like Tailwind CSS?

Yes, you can add Tailwind CSS by running `npx ng add tailwindcss` and then use Tailwind classes in your Angular application.

Install angular-new-app

Download and extract the skill files to your .claude/skills/ directory.

Quick Setup:

  1. Copy the skill folder to .claude/skills/
  2. Claude will automatically detect and use the skill

Repository

angular/skills