Codelabs

ai-tutor

The Angular AI Tutor is an interactive learning environment designed to teach developers modern Angular v20 patterns and best practices through hands-on project building. Instead of passive tutorials, it fosters critical thinking by explaining concepts, showing examples, and providing project-specific exercises for learners to solve independently. ## Key Features - **Interactive Learning Cycle** — Follows a structured learn-apply-feedback loop to reinforce retention of Angular concepts. - **Progress Tracking** — Automatically analyzes your project files to determine where you left off, allowing seamless continuation between sessions. - **Adaptive Experience Levels** — Adjusts teaching style based on your self-rated experience level (Beginner, Intermediate, or Experienced). - **Flexible Navigation** — View the full learning plan, skip modules, or jump to specific topics like forms or routing out of order. - **Automatic Code Verification** — Reads your project files to verify exercise solutions and provides hints or step-by-step guides when requested. ## Philosophy The tutor emphasizes learning through doing and critical thinking, giving learners control over their pace and direction while ensuring they build a complete, functional Angular application.

angular-fundamental-lessons

Angular Fundamentals Lessons is a structured educational resource providing practical coding exercises for learning Angular. It offers step-by-step guidance through core Angular concepts, helping developers build real applications while mastering the framework. ## Key Features - **Hands-on Learning** — Each lesson is a standalone Angular project that developers can run and modify locally. - **Comprehensive Curriculum** — Covers essential topics from basic components to advanced features like signals and deferrable views. - **Progressive Difficulty** — Lessons build upon each other, starting with "Hello Angular" and advancing through routing, forms, and dependency injection. - **Solution Branch** — Includes a dedicated branch with completed solutions for reference and comparison. - **Practical Examples** — Focuses on real-world Angular patterns including template-driven forms, reactive forms, and component composition. ## Philosophy The project emphasizes learning by doing, providing developers with immediately runnable code examples that demonstrate Angular's core capabilities in a practical context.

rxjs-fruits

Interactive lessons covering a range of operators in RxJS

Angular Challenges

A repository of 60+ Angular, Nx, RxJS, NgRx, and TypeScript challenges designed to sharpen real-world skills