Angular Community Coding Challenge: 30 Days of Modern Angular

Contest Overview

Detail	Description
Contest Name	30 Days of Modern Angular Challenge: Performance & Signals
Theme	Building high-performance, modern Angular applications using Signals, OnPush, and Zoneless principles.
Goal	Encourage community members to master the latest Angular reactive primitives and performance optimization techniques.
Duration	30 Days
Audience	Angular developers of all skill levels (Beginner to Expert).

---

📅 Challenge Schedule (30 Days)

The challenge will be structured around core skills, moving from reactive state management to complex feature implementation.

Week	Focus Theme	Key Concepts & Directives	Submission Requirement
Week 1	Reactive State Mastery	Signals, computed(), effect(), Input Signals (signal: true)	Build: A simple but complete state management solution (e.g., a Shopping Cart counter) using only Signals, without any external library or RxJS subjects.
Week 2	Performance & Rendering	ChangeDetectionStrategy.OnPush, Zoneless Setup, Immutable Data Practices	Build: A component displaying a large list of items (500+ rows). Implement it using OnPush and show how only specific children update when an item is toggled, proving performance gains.
Week 3	Modern Feature Implementation	Standalone Components, Functional Interceptors, New Router Features	Build: A small, fully standalone application (e.g., a simple task tracker) that utilizes Router Input Binding and Functional Interceptors for a basic API mock or logging.
Final 7 Days	Showcase & Submission	Final polish, detailed performance report, and public demo link.	Submit: Link to a public repository (GitHub) and a live demo (StackBlitz/Netlify/Vercel), along with a short Performance Report documenting optimizations used.

---

🏆 Prizes and Recognition

Prizes will be awarded based on Performance Score (demonstrated efficiency/low resource usage), Code Quality (clean structure, use of Signals/best practices), and Completeness.

• Grand Prize Winner (1):
  • Featured post on the Angular blog or social media.
  • A remote code review and mentorship session with an Angular GDE (Google Developer Expert).
• Top Submissions (3):
  • Recognition and link to their GitHub/demo in the official Angular newsletter.
• Participation Recognition:
  • Digital "30 Days of Modern Angular Challenger" badge for LinkedIn/GitHub profiles for all valid submissions.

---

📝 Rules and Submission Guidelines

1. Framework: Submissions must use a recent, supported version of Angular (20+).
2. Core Requirement: Must extensively use Angular Signals for state management and demonstrate a clear understanding of OnPush change detection.
3. Code: Code must be publicly accessible on GitHub/GitLab/etc.
4. Documentation: The repository must include a README.md explaining the application, the key performance optimizations, and a link to the live demo.
5. Judging Criteria:
   • 50% Performance & Reactivity: Correct implementation of Signals and OnPush leading to minimal change detection cycles (as demonstrated in the report).
   • 30% Code Quality: Clean, modular structure using modern features like Standalone components and functional APIs.
   • 20% Completeness & Usability: Functional, well-designed, and complete implementation of the weekly themes.

---

🤝 How to Join

1. Register: Sign up on the challenge landing page (Link TBD!).
2. Connect: Follow the challenge hashtag on X/Twitter and Discord: #30DaysModernAngular
3. Start Coding!

Let's build faster, leaner, and more reactive Angular applications together!