Curso de Desenvolvimento de Aplicativos Móveis Cross-Platform com Ionic 8

Introdução ao Ionic e ao Cenário Cross-Platform

• O que é o Ionic e quando escolhê-lo em vez de nativo ou Flutter
• Arquitetura de Web Components que impulsiona a interface do Ionic
• Suporte a frameworks nos ecossistemas Angular, React e Vue
• Casos de uso reais para PWAs combinados com aplicativos móveis

Configuração do Ambiente de Desenvolvimento

• Instalação e configuração do Node.js e npm
• Instalação da CLI do Ionic
• Criação e scaffolding (estrutura base) de um novo projeto Ionic
• Execução de aplicativos no navegador e em modo de dispositivo conectado

Estrutura do Projeto e Arquitetura em Profundidade

• Páginas, módulos e componentes reutilizáveis
• Compreensão e configuração do sistema de roteamento
• Serviços e padrões de injeção de dependência
• Diretórios de ativos e configuração de ambiente

Componentes Principais de UI e Layout

• Uso de ion-header, ion-toolbar e ion-content para estrutura da página
• Controles de entrada: ion-input, ion-select, ion-checkbox
• Botões, FAB (Floating Action Button), cartões, listas e sistema de grade
• Convenções modernas de controles de formulário no Ionic
• Mão na massa: construindo uma página de login e layout do painel

Estratégias de Navegação e Roteamento

• Integração do Angular Router e React Router
• Padrões de navegação entre páginas e deep linking (vinculação profunda)
• Lazy loading (carregamento sob demanda) para performance
• Padrões de navegação por abas e menu lateral

Estilização e Temas

• Variáveis CSS e o sistema de cores do Ionic
• Implementação de suporte a modo escuro
• Fontes dinâmicas e personalização de paleta no Ionic 8
• Estilização responsiva em diferentes breakpoints de dispositivo

Formulários e Validação

• Framwork de formulários reativos para Angular
• Hooks personalizados e padrões de validação para React
• Tratamento de erros e feedback visual de validação
• Criação e validação de formulários complexos em múltiplos passos

Serviços e Integração com API

• Configuração do cliente HTTP e interceptores
• Realização de chamadas de API RESTful e manipulação de respostas
• Melhores práticas de gerenciamento de estado
• Limites de erro (error boundaries) e recuperação de falhas de rede

Capacitor e Recursos Nativos do Dispositivo

• Compreensão do bridge (conector) do Capacitor e do ecossistema de plugins
• Instalação e configuração do Capacitor em um projeto existente
• Acesso à câmera e seletor de imagens
• Integração de geolocalização e mapas
• Armazenamento nativo e preferências
• Mão na massa: capturando imagens e armazenando dados no dispositivo

Componentes Avançados de UI

• Modais, popovers (balões) e alertas no Ionic moderno
• Notificações do tipo Toast e sobreposições de carregamento
• Melhorias do Ionic 8 na arquitetura de eventos e overplays
• Considerações de performance para overlays de UI complexos

Técnicas de Otimização de Performance

• Code splitting (divisão de código) e melhores práticas de lazy loading
• Redução do tamanho do bundle e evitação de armadilhas comuns
• Otimização de renderização para listas e grandes conjuntos de dados

Progressive Web App (PWA) e Pipeline de Build

• Conversão do aplicativo em um Progressive Web App
• Configuração de service workers e capacidades offline
• Manifesto do aplicativo e prompts de instalação de PWA

Processos de Build e Implantação

• Build e bundling para produção no Android e iOS
• Configuração dos requisitos de submissão às lojas de aplicativos e metadados
• Gestão da configuração de ambiente entre staging e produção

Projeto Final: Construindo um Mini Aplicativo Completo

• Desenho da arquitetura do app e fluxo de navegação
• Implementação de uma página de login com autenticação
• Construção de um painel (dashboard) com integração de dados em tempo real
• Adição de uma funcionalidade nativa de câmera via Capacitor
• Revisão de código, testes e preparação para implantação