🎯

angular-forms

🎯Skill

from gentleman-programming/gentleman-skills

VibeIndex|
What it does

Provides AI-guided best practices and code generation for creating Signal Forms and Reactive Forms in Angular with optimized, type-safe implementations.

πŸ“¦

Part of

gentleman-programming/gentleman-skills(24 items)

angular-forms

Installation

git cloneClone repository
git clone https://github.com/Gentleman-Programming/Gentleman-Skills.git
πŸ“– Extracted from docs: gentleman-programming/gentleman-skills
10Installs
-
AddedFeb 4, 2026

Skill Details

SKILL.md

Overview

# Gentleman-Skills

> Community-driven AI agent skills for Claude Code, OpenCode, and other AI assistants.

Skills are specialized instruction sets that teach AI assistants how to work with specific frameworks, libraries, and patterns. They provide on-demand context so the AI writes code following best practices and conventions.

Philosophy

  • Curated Skills - Personally crafted and battle-tested by [@Gentleman-Programming](https://github.com/Gentleman-Programming). These reflect MY way of thinking about code architecture - Scope Rule, file naming conventions, signals-first approach, and more. Some skills (like testing and Python) have been developed in collaboration with the team at [Prowler](https://github.com/prowler-cloud).
  • Community Skills - Created by the community, for the community. These go through a democratic voting process before being accepted.

Curated Skills

These skills represent patterns and practices I've personally tested and refined over years of development.

Contributing to this Repo?

> Start here! Use the [github-pr](curated/github-pr) skill to create proper PRs with conventional commits.

| Skill | Description | Trigger |

|-------|-------------|---------|

| [github-pr](curated/github-pr) | Create quality PRs with conventional commits | When creating PRs or contributing |

| [skill-creator](curated/skill-creator) | Create new skills | When creating new AI agent skills |

Frontend

| Skill | Description | Trigger |

|-------|-------------|---------|

| [angular/core](curated/angular/core) | Standalone components, signals, inject, zoneless | When creating Angular components |

| [angular/forms](curated/angular/forms) | Signal Forms, Reactive Forms | When working with Angular forms |

| [angular/performance](curated/angular/performance) | NgOptimizedImage, @defer, lazy loading, SSR | When optimizing Angular apps |

| [angular/architecture](curated/angular/architecture) | Scope Rule, project structure, file naming | When structuring Angular projects |

| [react-19](curated/react-19) | React 19 patterns with React Compiler | When writing React components |

| [nextjs-15](curated/nextjs-15) | Next.js 15 App Router patterns | When working with Next.js |

| [typescript](curated/typescript) | TypeScript strict patterns | When writing TypeScript code |

| [tailwind-4](curated/tailwind-4) | Tailwind CSS 4 patterns | When styling with Tailwind |

| [zod-4](curated/zod-4) | Zod 4 schema validation | When using Zod for validation |

| [zustand-5](curated/zustand-5) | Zustand 5 state management | When managing React state |

Backend & AI

| Skill | Description | Trigger |

|-------|-------------|---------|

| [ai-sdk-5](curated/ai-sdk-5) | Vercel AI SDK 5 patterns | When building AI chat features |

| [django-drf](curated/django-drf) | Django REST Framework patterns | When building REST APIs with Django |

Testing

| Skill | Description | Trigger |

|-------|-------------|---------|

| [playwright](curated/playwright) | Playwright E2E testing | When writing E2E tests |

| [pytest](curated/pytest) | Python pytest patterns | When writing Python tests |

Workflow

| Skill | Description | Trigger |

|-------|-------------|---------|

| [jira-task](curated/jira-task) | Jira task creation | When creating Jira tasks |

| [jira-epic](curated/jira-epic) | Jira epic creation | When creating Jira epics |

Community Skills

Skills contributed by the community and approved through our voting process.

| Skill | Description | Author |

|-------|-------------|--------|

| [electron](community/electron) | Electron patterns for building cross-platform desktop applications. | @gentleman-programming |

| [elixir-antipatterns](community/elixir-antipatterns) | Core catalog of 8 critical Elixir/Phoenix anti-patterns covering error handli... | @tsardinasGitHub |

| [hexagonal-architecture-layers-java](community/hexagonal-architecture-layers-java) | Hexagonal architecture layering for Java services with strict boundaries. | @diegnghrmr |

| [java-21](community/java-21) | Java 21 language and runtime patterns for modern, safe code. | @diegnghrmr |

| [react-native](community/react-native) | React Native patterns for mobile app development with Expo and bare workflow. | @gentleman-programming |

| [spring-boot-3](community/spring-boot-3) | Spring Boot 3 patterns for configuration, DI, and web services. | @diegnghrmr |

Installation

For Claude Code / OpenCode

Copy the skills you want to use to your Claude configuration:

```bash

# Clone the repository

git clone https://github.com/Gentleman-Programming/Gentleman-Skills.git

# Copy curated skills to Claude config

cp -r Gentleman-Skills/curated/* ~/.claude/skills/

# Or copy specific skills

cp -r Gentleman-Skills/curated/react-19 ~/.claude/skills/

cp -r Gentleman-Skills/curated/typescript ~/.claude/skills/

```

Manual Installation

  1. Create the skills directory if it doesn't exist:

```bash

mkdir -p ~/.claude/skills

```

  1. Copy the skill folder(s) you want:

```bash

cp -r curated/react-19 ~/.claude/skills/

```

  1. Reference the skill in your project's CLAUDE.md or global ~/.claude/CLAUDE.md:

```markdown

## Skills

When working with React, read ~/.claude/skills/react-19/SKILL.md first.

```

How Skills Work

Each skill contains a SKILL.md file with:

  1. Trigger conditions - When the AI should load this skill
  2. Patterns and rules - Specific coding conventions to follow
  3. Code examples - Reference implementations
  4. Anti-patterns - What to avoid

When the AI detects a matching context (e.g., editing a React component), it reads the skill file and applies those patterns to its responses.

Contributing

We welcome community contributions! See [CONTRIBUTING.md](CONTRIBUTING.md) for the full process.

> Pro tip: Load the [github-pr](curated/github-pr) skill to create PRs that follow our conventions!

Quick Overview

  1. Fork this repository
  2. Create your skill following the [skill template](SKILL_TEMPLATE.md)
  3. Submit a Pull Request to the community/ folder using [conventional commits](https://www.conventionalcommits.org/)
  4. Community votes for 7 days using reactions
  5. Accepted if more positive than negative votes

Voting System

  • Vote with reactions on the PR
  • Voting period: 7 days
  • Acceptance criteria: positive votes > negative votes
  • Maintainers can fast-track exceptional contributions

Skill Structure

```

skill-name/

β”œβ”€β”€ SKILL.md # Main skill file (required)

β”œβ”€β”€ examples/ # Code examples (optional)

└── README.md # Skill documentation (optional)

```

Other Resources

Looking for official Vercel skills? Check out [vercel-labs/agent-skills](https://github.com/vercel-labs/agent-skills).

License

MIT License - See [LICENSE](LICENSE) for details.

---

Made with care by [Gentleman Programming](https://github.com/Gentleman-Programming) and the community.