Angular 58: Capstone — A producción
easy⏱ 5 mincourseangular
Todo lo que aprendiste, en un solo archivo
Los signals (signal, computed), los componentes standalone con clases tipadas, la sintaxis de control de flujo @for/track y @if, inject() para inyección de dependencias, y [(ngModel)] de FormsModule para binding bidireccional aparecen todos aquí juntos: los mismos bloques de construcción de las lecciones 1 a la 57, ahora combinados en una funcionalidad real en lugar de estudiados por separado.
computed() marca la línea de meta
allDone = computed(() => this.items().every((item) => item.done)) se vuelve a calcular automáticamente cada vez que items cambia, y solo se lee como true cuando el indicador done de absolutamente todos los elementos es true. El template reacciona con @if (allDone()), sin necesitar sincronización manual en ningún lado.
allDone = computed(() => this.items().every((item) => item.done));
Un servicio, inyectado a la manera moderna, agrega elementos nuevos
ChecklistService se inyecta con private checklistService = inject(ChecklistService); en lugar de un parámetro de constructor, el mismo patrón inject() usado para HttpClient en el módulo de servicios. Devuelve un ChecklistItem con la forma correcta, manteniendo la generación de ids completamente fuera del componente.
Lo lograste — así se ve el envío a producción
Todo en este componente es exactamente lo que ng build --configuration production compilaría, minificaría y convertiría en hashes dentro de una carpeta dist/ real, lista para Firebase Hosting, Netlify o cualquier servidor de archivos estático. Desde signal(0) en la lección 1 hasta una lista de verificación completa con DI y formularios aquí: eso es zero to hero.