Projeto simples, esstruturado em Clean Architecture com organização de código e componentes modernos, para fins de analíse e referência. A aplicação faz uma busca de CEP utilizando a API https://viacep.com.br/ws/{cep}/json/, e foi desenvolvido com Ionic 6 + Angular 13 + Capacitor 3, com o objetivo de demonstrar a arquitetura e as boas práticas aplicadas.
O projeto mobile foi estruturado obedecendo ao padrão Clean Architecture que divide a aplicação em camadas por área de responsabilidades, como por exemplo, camada de modelo de dados, manipulação de dados e exibição de dados. Assim, utilizamos um modelo arquitetural que melhor se adequa aos nossos critérios de produtividade e seguraça no desenvlvimento, claro que haverá diferença do modelo puro canonico da Clean Arquiteture, mas o objetivo não está na implementação ipsis litteris mas sim, num modelo referencial correto que atenda às tarefas. Segue abaixo a estrutura de diretórios do modelo:
└── src/
├── assets
├── core/
│ ├── base
│ ├── domain
│ ├── interceptor
│ ├── repositories
│ └── usecases
├── data/
│ └── repository
├── environment
├── presentation/
│ └── pages
└── shared/
├── components
├── directive
├── pipes
└── store
Toda a estrutura foi prefixada, neste caso, com o prefixo "cep", isto adiciona ao seletor dos componentes um prefixo que customiza e facilita a localização dos componentes em meio ao código, bem como padroniza a nomeclatura dos elementos.
O projeto tem foco no uso de componentes reutilizáveis, uma vez que se permitem ser facilmente replicados, configurados e mantidos. O projeto traz o componente <cep-search></cep-search>.
O projeto conta com gerenciamento reativo de estado dos componentes utilizando a biblioteca ngRx, tornando a aplicação mais poderosa quando se trata de comunicação entre os componentes locais e globais.
Utilizado no pré-carregamento de dados quando o usuário está navegando de uma rota para outra. Com resolver é possível carregar dados antes que a navegação em uma rota conclua, antecipando a validação de dados ou chamadas em APIs.
A criação de módulos compartilhados permite organizar e otimizar seu código. Você pode colocar diretivas, canais e componentes comumente usados em um módulo e, em seguida, importar apenas esse módulo para onde for necessário em outras partes de seu aplicativo.
A criação de módulos compartilhados permite organizar e otimizar seu código. Você pode colocar diretivas, canais e componentes comumente usados em um módulo e, em seguida, importar apenas esse módulo para onde for necessário em outras partes de seu aplicativo.
O projeto traz linhas customizadas na seção script do package.json, tonando mais simples e rápida a passagem dos command lines NPM para buildar o projeto, bem como para criar components, pages, services, pipes etc..
Todo o projeto segue boas práticas em javascript e typescript, podendo-se observar os arquivos .ts nas implementações das classes, interfaces, métodos, requisições http com Observable (RxJs), tipos genericos e etc...