Initial commit

2025-11-30 08:47:33 +08:00
commit e430757b63
23 changed files with 5332 additions and 0 deletions
--- a/commands/learn.md
+++ b/commands/learn.md
@@ -0,0 +1,173 @@
+# /learn - Angular Learning Paths
+
+## Overview
+Start your Angular learning journey with guided, structured learning paths tailored to your experience level and goals.
+
+## Interactive Learning Paths
+
+### Beginner Path (0-3 months)
+Perfect for developers new to Angular who want to build a solid foundation.
+
+**Phase 1: TypeScript Fundamentals** (Weeks 1-2)
+- Basic types and interfaces
+- OOP concepts
+- Decorators (Essential for Angular)
+- Async/await patterns
+- **Agent**: TypeScript Fundamentals Agent
+- **Estimated Hours**: 20-30 hours
+- **Hands-on Projects**:
+  - Build a TypeScript utility library
+  - Create typed API client
+  - Implement design patterns
+
+**Phase 2: Angular Core Basics** (Weeks 3-4)
+- Components and templates
+- Services and dependency injection
+- Basic routing
+- Modules
+- **Agent**: Angular Core Architecture Agent
+- **Estimated Hours**: 25-35 hours
+- **Hands-on Projects**:
+  - Build a Todo application
+  - Create a user dashboard
+  - Multi-page application with routing
+
+**Phase 3: Forms & Validation** (Weeks 5-6)
+- Template-driven forms
+- Form validation
+- Custom validators
+- **Agent**: Forms, Validation & Directives Agent
+- **Estimated Hours**: 15-20 hours
+- **Hands-on Projects**:
+  - User registration form
+  - Multi-step wizard
+  - Dynamic form generation
+
+**Milestone**: Your first production-ready Angular app with forms, routing, and services.
+
+### Intermediate Path (3-6 months)
+For developers comfortable with Angular basics wanting to master advanced concepts.
+
+**Phase 4: Reactive Programming** (Weeks 7-8)
+- RxJS fundamentals
+- Observables and subjects
+- Common operators
+- Higher-order observables
+- **Agent**: Reactive Programming & RxJS Agent
+- **Estimated Hours**: 25-35 hours
+- **Hands-on Projects**:
+  - Real-time data streaming dashboard
+  - Search with debouncing
+  - Multi-source data combination
+
+**Phase 5: Advanced Routing** (Weeks 9-10)
+- Lazy loading
+- Route guards
+- Code splitting
+- Change detection optimization
+- **Agent**: Routing, Performance & Advanced Patterns Agent
+- **Estimated Hours**: 20-25 hours
+- **Hands-on Projects**:
+  - Large-scale application with lazy-loaded modules
+  - Role-based access control
+  - Performance-optimized routing
+
+**Phase 6: State Management** (Weeks 11-12)
+- NgRx fundamentals
+- Actions and reducers
+- Selectors
+- Effects
+- **Agent**: State Management & APIs Agent
+- **Estimated Hours**: 30-40 hours
+- **Hands-on Projects**:
+  - E-commerce cart system
+  - Real-time notification system
+  - Complex form state management
+
+**Milestone**: Build a scalable application with proper state management and advanced routing.
+
+### Advanced Path (6+ months)
+Master enterprise patterns and optimization techniques.
+
+**Phase 7: Testing & Performance** (Weeks 13-16)
+- Unit testing with Jasmine
+- E2E testing with Cypress
+- Build optimization
+- Deployment strategies
+- **Agent**: Testing, Build & Deployment Agent
+- **Estimated Hours**: 35-50 hours
+- **Hands-on Projects**:
+  - Fully tested component library
+  - Production deployment pipeline
+  - Performance-optimized PWA
+
+**Phase 8: Advanced Patterns** (Weeks 17-20)
+- Entity adapters
+- Custom state selectors
+- Micro frontends
+- Angular Signals
+- Akita patterns
+- **Agents**: Multiple agents collaboration
+- **Estimated Hours**: 40-60 hours
+- **Hands-on Projects**:
+  - Enterprise application with multiple features
+  - Custom framework/library
+  - Micro-frontend architecture
+
+**Milestone**: Enterprise-ready Angular applications with comprehensive testing and optimization.
+
+## Learning Tips
+
+### Study Tips
+1. **Code Along**: Don't just watch, write every example
+2. **Practice Exercises**: Do the hands-on projects
+3. **Build Real Apps**: Apply knowledge to real problems
+4. **Code Review**: Study well-written Angular code
+5. **Teach Others**: Explain concepts to reinforce learning
+
+### Development Environment Setup
+```bash
+# Install Node.js 18+
+node --version
+
+# Install Angular CLI
+npm install -g @angular/cli
+
+# Create new project
+ng new my-app
+cd my-app
+ng serve
+
+# Generate components
+ng generate component components/user-list
+ng generate service services/user
+ng generate module modules/shared
+```
+
+### Resources
+- Official Documentation: https://angular.io
+- Angular API Reference: https://angular.io/api
+- Community Forum: https://gitter.im/angular/angular
+- Stack Overflow: Tag: `angular`
+
+## Assessment & Progress
+
+After each phase, test your knowledge:
+- Use `/assess` command to evaluate understanding
+- Review weak areas and practice more
+- Move to next phase when comfortable
+
+## Next Steps
+
+1. Choose your path based on experience level
+2. Start with Phase 1 content
+3. Complete hands-on projects
+4. Move through phases sequentially
+5. Use `/projects` to find practice challenges
+6. Use `/explore` to dive deeper into topics
+
+---
+
+**Start Now**: Choose your path and begin learning! 🚀
+
+Use `/explore` to see all 7 agents and their specialties.