Gracias por enviar su consulta! Uno de los miembros de nuestro equipo se pondrá en contacto con usted en breve.
Gracias por enviar su reserva! Uno de los miembros de nuestro equipo se pondrá en contacto con usted en breve.
Temario del curso
Introducción a Ionic y el Ecosistema Multiplataforma
- ¿Qué es Ionic y cuándo elegirlo frente a soluciones nativas o Flutter?
- Arquitectura de Web Components que potencia la interfaz de usuario de Ionic
- Soporte de frameworks en los ecosistemas de Angular, React y Vue
- Casos de uso reales para PWA y aplicaciones móviles
Configuración del Entorno de Desarrollo
- Instalación y configuración de Node.js y npm
- Instalación de la CLI de Ionic
- Creación y generación de un nuevo proyecto de Ionic
- Ejecución de aplicaciones en el navegador y modo de dispositivo conectado
Análisis Profundo de la Estructura y Arquitectura del Proyecto
- Páginas, módulos y componentes reutilizables
- Comprensión y configuración del sistema de enrutamiento
- Patrones de servicios e inyección de dependencias
- Directorios de activos y configuración del entorno
Componentes de Interfaz Principal y Disposición
- Uso de ion-header, ion-toolbar e ion-content para la estructura de la página
- Controles de entrada: ion-input, ion-select, ion-checkbox
- Botones, FAB, tarjetas, listas y el sistema de cuadrícula
- Convenciones modernas de controles de formulario en Ionic
- Práctica: construcción de una página de inicio de sesión y un diseño de panel de control
Estrategias de Navegación y Enrutamiento
- Integración de Angular Router y React Router
- Patrones de navegación entre páginas y enlaces profundos
- Carga diferida para mejorar el rendimiento
- Patrones de navegación por pestañas y menú lateral
Estilos y Temas
- Variables CSS y el sistema de colores de Ionic
- Implementación del soporte para modo oscuro
- Fuentes dinámicas y personalización de la paleta en Ionic 8
- Estilos responsivos entre diferentes puntos de quiebre de dispositivos
Formularios y Validación
- Framework de formularios reactivos para Angular
- Ganchos personalizados (hooks) y patrones de validación para React
- Gestión de errores y retroalimentación visual de la interfaz de usuario
- Construcción y validación de formularios complejos en múltiples pasos
Servicios e Integración con API
- Configuración del cliente HTTP y interceptores
- Ejecución de llamadas a API RESTful y manejo de respuestas
- Mejores prácticas para la gestión del estado
- Barreras de error y recuperación ante fallos de red
Capacitor y Funciones Nativas del Dispositivo
- Comprensión del puente de Capacitor y el ecosistema de complementos (plugins)
- Instalación y configuración de Capacitor en un proyecto existente
- Acceso a la cámara y al selector de imágenes
- Geolocalización e integración de mapas
- Almacenamiento nativo y preferencias
- Práctica: captura de imágenes y almacenamiento de datos en el dispositivo
Componentes Avanzados de la Interfaz
- Módulos emergentes, popovers y alertas en Ionic moderno
- Notificaciones Toast y superposiciones de carga
- Mejoras de Ionic 8 en eventos y arquitectura de superposiciones
- Consideraciones de rendimiento para superposiciones de interfaz complejas
Técnicas de Optimización del Rendimiento
- Mejores prácticas para la división de código y carga diferida
- Reducción del tamaño del paquete y evitación de errores comunes
- Optimización del renderizado para listas y conjuntos grandes de datos
Aplicación Web Progresiva (PWA) y Pipeline de Compilación
- Conversión de la aplicación a una Aplicación Web Progresiva
- Configuración de service workers y capacidades sin conexión
- Manifiesto de la aplicación y solicitudes de instalación de PWA
Procesos de Compilación y Despliegue
- Compilación y empaquetado para producción en Android e iOS
- Configuración de requisitos y metadatos para la presentación a las tiendas de aplicaciones
- Gestión de la configuración del entorno entre entornos de prueba y producción
Proyecto Final: Construcción de una Mini Aplicación Completa
- Diseño de la arquitectura de la aplicación y el flujo de navegación
- Implementación de una página de inicio de sesión con autenticación
- Construcción de un panel de control con integración de datos en tiempo real
- Agregado de una característica de cámara nativa a través de Capacitor
- Revisión del código, pruebas y preparación para el despliegue
Requerimientos
- Conocimientos prácticos de HTML, CSS y JavaScript/TypeScript
- Familiaridad con al menos un framework moderno (Angular, React o Vue)
- Experiencia básica en la línea de comandos con Node.js y npm
Público Objetivo
- Desarrolladores front-end que se mudan al desarrollo móvil multiplataforma
- Desarrolladores full-stack que construyen aplicaciones móviles híbridas
- Desarrolladores móviles que buscan una base de código unificada para iOS, Android y PWA
14 Horas