Conteúdo

Os dispositivos móveis já fazem parte do dia a dia da maioria da população. São duas as maiores plataformas móveis atualmente disponíveis (iOS e Android), mas várias são as ferramentas para desenvolvimento de aplicações para elas, quer seja de forma nativa ou híbrida. O Ionic é um framework para aplicações cross-platform, que podem ser executadas em dispositivos móveis e web, desenvolvidas em HTML e TypeScript.

Neste livro, Everton Coimbra de Araújo aborda o Ionic 6, junto de frameworks específicos, como o Capacitor, que possibilita a transformação de uma aplicação Ionic em uma aplicação híbrida. Você vai aprender na prática com um projeto de exemplo que pode ser executado, com recursos nativos, nos sistemas operacionais iOS e Android, testando-o em emuladores e em dispositivos físicos. Dentre as funcionalidades exploradas, estão: persistência de dados, tanto local como por meio do SQLite e Firestore, criação da interface com o usuário, navegação entre páginas, operações CRUD, e ainda, o uso de recursos como câmera e álbum de fotografia.

Edição atualizada em 01/2022: o livro teve uma sensível mudança para o Ionic 6. Nesta atualização, o foco foi o uso do Capacitor e não mais do Cordova.

Saiba o que você vai aprender

Sumário

• 1 Dispositivos móveis, desenvolvimento cross-platform e Ionic
• 1.1 Os dispositivos móveis na atualidade
• 1.2 O desenvolvimento móvel cross-platform
• 1.3 O Ionic Framework

• 2 Ionic — Instalação e testes
• 2.1 Ferramentas, downloads e instalação
• 2.2 Testando a instalação do ambiente com um projeto básico
• 2.3 Execução de forma nativa no iOS
• 2.4 Execução de forma nativa no Android
• 2.5 Depuração

• 3 A primeira aplicação Ionic
• 3.1 A estrutura básica de um projeto Ionic
• 3.2 Os componentes básicos do template home
• 3.3 A execução da aplicação
• 3.4 Criação da página de clientes
• 3.5 Mudanças na interface com o usuário
• 3.6 Recuperação dos dados informados
• 3.7 Uso de binding de componentes e formulários
• 3.8 Angular Reactive Forms
• 3.9 Não exibir mensagens de erro antes da submissão e alteração
• 3.10 Validação do Reactive Form no componente TypeScript
• 3.11 Um componente específico para data
• 3.12 Confirmando a inserção com o usuário

• 4.1 Criação e execução inicial do projeto
• 4.2 Populando a página com itens
• 4.3 Navegação para uma página de detalhes de um tipo de serviço
• 4.4 Recuperação do tipo de serviço selecionado
• 4.5 Alteração dos dados exibidos na página de detalhes
• 4.6 Navegação para uma página de inserção de dados utilizando classes de negócio
• 4.7 Remoção de um item da lista

• 5 Persistindo dados fisicamente em aplicações Ionic
• 5.1 Criação dos artefatos de modelo e de registro
• 5.2 Persistência no Ionic com Storage para a inserção de dados
• 5.3 Recuperação de dados persistidos com Storage
• 5.4 Recuperação de uma peça selecionada na listagem
• 5.5 Implementação e validação das operações CRUD
• 5.6 SQLite e Cordova como mecanismo de persistência
• 5.7 A interface com o usuário para as Ordens de Serviço
• 5.8 A aplicação em execução

• 6 Sidemenu, CRUD com SQLite e o componente Select
• 6.1 Criação do Sidemenu
• 6.2 A tabela de clientes na base de dados
• 6.3 Service para clientes
• 6.4 A inserção de ordens de serviço
• 6.5 Acesso a um atendimento existente
• 6.6 Gravação dos dados do atendimento
• 6.7 Removendo um atendimento já registrado

• 7 CRUD com Firestore para acesso a dados remoto e uma página de pesquisa
• 7.1 Preparação do projeto para o Firestore
• 7.2 Populando a base de dados do Firestore
• 7.3 Visualização dos clientes registrados
• 7.4 Consulta e alteração de um cliente
• 7.5 Visualização dos atendimentos registrados no Firestore
• 7.6 A pesquisa de clientes para o atendimento
• 7.7 A criação de um atendimento com acesso à pesquisa por clientes
• 7.8 Eventos na comunicação entre componentes de visão
• 7.9 O registro do atendimento com o cliente selecionado
• 7.10 A alteração de um atendimento já registrado
• 7.11 A remoção de um atendimento já registrado

• 8 Câmera e álbum de fotos no CRUD de clientes e Storage do Firebase
• 8.1 Adaptação de nossa página de clientes
• 8.2 Interação com a câmera e o álbum de imagens
• 8.3 Armazenando no dispositivo a imagem capturada
• 8.4 Visualização das imagens dos clientes na listagem
• 8.5 Remoção da imagem física do dispositivo
• 8.6 Vamos manter a foto também na nuvem
• 8.7 A remoção da imagem no Storage

• 9 Autenticação e criação de usuários no Firebase e uso de Tabs
• 9.1 Preparação do projeto para a autenticação
• 9.2 O login para acessar a aplicação
• 9.3 A aplicação acessível por Tabs
• 9.4 A página para listagem de clientes registrados
• 9.5 Proibindo o acesso anônimo
• 9.6 Criação de novos usuários diretamente pela aplicação

• 10 Integração com Google Maps
• 10.1 Criando nossa aplicação no Google Cloud
• 10.2 Preparação da aplicação para a visualização de mapas
• 10.3 A aplicação em execução
• 10.4 Inserção do mapa na aplicação
• 10.5 Identificação da localização do dispositivo
• 10.6 A busca por um endereço
• 10.7 Ícone da aplicação e SplashScreen

• 11 Os estudos não param por aqui