CodeForge

supercurso 05

Angular 21 de Cero a Experto

Signals, standalone components, RxJS y tiempo real a escala empresarial.

11 módulos65 lecciones publicadas~27 h de contenidointermedio

Temario

01Fundamentos0/6
  1. Qué es Angular: el framework con baterías incluidas20m20
  2. Componentes standalone: el molde que se basta solo20m20
  3. Templates y binding: el puente entre la clase y la pantalla22m20
  4. Control flow: @if, @for y @switch (adiós *ngIf)24m20
  5. input() y output(): datos que bajan, eventos que suben22m20
  6. Reto: Mi Bolsillo, tu primer árbol de componentes30m60
02Signals a fondo0/7
  1. Signals: el valor que avisa cuando cambia24m20
  2. computed: el valor derivado que se recalcula solo22m20
  3. effect: reaccionar al mundo cuando las señales cambian22m20
  4. Por qué signals reemplazaron a zone.js20m20
  5. Inputs como señales y model(): comunicación reactiva22m20
  6. linkedSignal y resource(): estado derivado y datos async22m20
  7. Reto: construye tu propio sistema de señales40m100
03Servicios y DI0/6
  1. Servicios e inyección de dependencias: lógica compartida22m20
  2. inject(): la forma moderna de pedir dependencias20m20
  3. Servicios con signals: el store reactivo de Angular24m20
  4. Jerarquía de inyectores: dónde vive cada servicio20m20
  5. Tokens de inyección: inyectar lo que no es una clase20m20
  6. Reto: el BolsilloStore, cerebro reactivo de la app30m60
04Routing0/6
  1. El router de Angular: convertir componentes en páginas22m20
  2. Parámetros de ruta como señales22m20
  3. Lazy loading: cargar cada página solo cuando se visita20m20
  4. Guards funcionales: el portero de cada ruta22m20
  5. Resolvers: los datos listos antes de entrar a la página18m20
  6. Reto: el mapa de rutas de Mi Bolsillo con guard35m60
05Formularios0/6
  1. Formularios: template-driven vs reactivos20m20
  2. Formularios reactivos tipados: FormGroup y FormControl22m20
  3. Validaciones: integradas, custom y asíncronas24m20
  4. Estados y errores accesibles: el formulario que se oye22m20
  5. Formularios dinámicos con FormArray20m20
  6. Reto: el formulario de nuevo gasto, validado y accesible35m60
06RxJS y observables a gran escala0/7
  1. Observables: streams de valores en el tiempo24m20
  2. Operadores y pipe: transformar el stream24m20
  3. Higher-order observables y switchMap24m20
  4. Combinar streams y multicast (share)22m20
  5. Errores y reintentos en RxJS20m20
  6. Interop signals ↔ observables: toSignal y toObservable22m20
  7. Reto: un buscador reactivo desde cero40m100
07HTTP y datos0/6
  1. HttpClient: hablar con el backend22m20
  2. Estados de carga y error: cargando, error, datos22m20
  3. Interceptores funcionales: el filtro de toda petición22m20
  4. Caché: no pedir dos veces lo mismo20m20
  5. httpResource: datos declarativos con señales20m20
  6. Reto: la capa de datos de Mi Bolsillo con caché35m60
08Estado a gran escala0/5
  1. Escalar el estado: del store simple a los features20m20
  2. NgRx SignalStore: stores estructurados con señales24m20
  3. Arquitectura por features: organizar una app que dura22m20
  4. El patrón facade: una fachada simple sobre lo complejo20m20
  5. Reto: un SignalStore de features para Mi Bolsillo40m100
09Tiempo real y sistemas distribuidos0/6
  1. Por qué tiempo real: del preguntar al empujar20m20
  2. WebSocket nativo: los cuatro momentos de una conexión22m20
  3. Socket.io con Angular: eventos con nombre y un socket vivo24m20
  4. Reconexión y backpressure: tiempo real robusto22m20
  5. Dashboard en vivo y presencia20m20
  6. Reto: panel colaborativo de gastos en tiempo real40m100
10Nivel producción0/6
  1. SSR e hidratación incremental22m20
  2. Zoneless y rendimiento: medir antes de optimizar22m20
  3. @defer: cargar partes de la vista bajo demanda20m20
  4. Testing: probar como usa un usuario24m20
  5. i18n y monorepos con Nx18m20
  6. Reto: la suite de tests de Mi Bolsillo35m60
11Proyecto final0/4
  1. Arquitectura del tablero: planear antes que codear22m20
  2. Proyecto: tablero colaborativo de gastos en tiempo real60m150
  3. Reto: de demo a producto — extiende el tablero40m100
  4. Cierre: lo que ahora sabes hacer con Angular15m20