smithery/aj-geddes

angular-module-design

Design Angular modules using feature modules, lazy loading, and dependency injection. Use when organizing large Angular applications with proper separation of concerns.

Installation

$ npx skills add smithery/aj-geddes --skill angular-module-design

Similar popular skills

Related neighbors and high-traction skills in the same topics — useful to compare before installing.

Also in this package

Other skills from smithery/aj-geddes · top by installs.

npx skills add smithery/aj-geddes

Browse all from smithery/aj-geddes

More details

Agent compatibility

Declared targets from SKILL.md / docs. Unmarked agents are not listed — the skill may still install via the CLI.

Claude Code Not declared
Cursor Not declared
Codex Not declared
GitHub Copilot Not declared
Windsurf Not declared
Gemini CLI Not declared
Cline Not declared
OpenCode Not declared

Package contents

Files included with this skill beyond the listing page.

  • skill md SKILL.md 2,361 B
  • docs SUMMARY.md 197 B

History

  1. First recorded snapshot · 0 installs

SKILL.md

Angular Module Design

Table of Contents

  • [Overview](#overview)
  • [When to Use](#when-to-use)
  • [Quick Start](#quick-start)
  • [Reference Guides](#reference-guides)
  • [Best Practices](#best-practices)

Overview

Architect scalable Angular applications using feature modules, lazy loading, services, and RxJS for reactive programming patterns.

When to Use

  • Large Angular applications
  • Feature-based organization
  • Lazy loading optimization
  • Dependency injection patterns
  • Reactive state management

Quick Start

Minimal working example:

// users.module.ts
import { NgModule } from "@angular/core";
import { CommonModule } from "@angular/common";
import { ReactiveFormsModule } from "@angular/forms";
import { UsersRoutingModule } from "./users-routing.module";
import { UsersListComponent } from "./components/users-list/users-list.component";
import { UserDetailComponent } from "./components/user-detail/user-detail.component";
import { UsersService } from "./services/users.service";

@NgModule({
  declarations: [UsersListComponent, UserDetailComponent],
  imports: [CommonModule, ReactiveFormsModule, UsersRoutingModule],
  providers: [UsersService],
})
export class UsersModule {}

Reference Guides

Detailed implementations in the references/ directory:

Guide Contents
[Feature Module Structure](references/feature-module-structure.md) Feature Module Structure
[Lazy Loading Routes](references/lazy-loading-routes.md) Lazy Loading Routes
[Service with RxJS](references/service-with-rxjs.md) Service with RxJS
[Smart and Presentational Components](references/smart-and-presentational-components.md) Smart and Presentational Components
[Dependency Injection and Providers](references/dependency-injection-and-providers.md) Dependency Injection and Providers

Best Practices

✅ DO

  • Follow established patterns and conventions
  • Write clean, maintainable code
  • Add appropriate documentation
  • Test thoroughly before deploying

❌ DON'T

  • Skip testing or validation
  • Ignore error handling
  • Hard-code configuration values