claude-dev-toolkit

# Claude Dev Toolkit - Angular Development

This skill provides automated workflows for Angular development tasks.

## Capabilities

### 1. Angular Application Scaffolding
When the user requests an Angular app, create a well-structured Angular application with:
- Routing configuration
- Authentication guards
- Service structure
- Component architecture
- Core and Shared modules
- Best practices for folder organization

**Command to execute:**
```bash
ng new {app-name} --routing --style=scss
cd {app-name}
ng generate guard auth/guards/auth
ng generate service auth/services/auth
ng generate module core
ng generate module shared
ng generate component core/components/layout
```

Create folder structure:
- `src/app/core/` - Core functionality (singletons, guards, interceptors)
- `src/app/shared/` - Shared components, directives, pipes
- `src/app/features/` - Feature modules
- `src/app/auth/` - Authentication logic

After generation, create a README explaining the structure.

### 2. Angular Component Generation
Generate Angular components with proper structure:
```bash
ng generate component {path}/{component-name}
```

Include component, template, styles, and spec file. Use proper naming conventions.

### 3. Angular Service Generation
Generate Angular services:
```bash
ng generate service {path}/{service-name}
```

Follow singleton pattern for core services, place in appropriate module.

### 4. Angular Module Generation
Generate feature modules with routing:
```bash
ng generate module {module-name} --routing
```

### 5. Git Repository Initialization
Initialize a git repo with Angular-specific best practices:
- Create `.gitignore` for Angular/Node.js projects
- Initialize git
- Create initial commit
- Create a basic README with Angular commands
- Include common Angular build artifacts in .gitignore

### 6. Angular Guards & Interceptors
Generate guards and HTTP interceptors:
```bash
ng generate guard {path}/{guard-name}
ng generate interceptor {path}/{interceptor-name}
```