/angular-user-update-form

O "Angular User Update Form" é um aplicativo Angular 17 para atualização de dados de usuários, com foco na eficiência e no uso avançado de recursos como formulário reativo e requisições HTTP. Prioriza a organização e reutilização do código, seguindo as melhores práticas de desenvolvimento Angular.

Primary LanguageTypeScript

Projeto Formulário de Atualização de Usuários

Este é um projeto de formulário de atualização de usuários desenvolvido com Angular 17, Tailwind CSS e Angular Material. O objetivo deste projeto é demonstrar o uso de vários conceitos avançados do Angular, incluindo requisições HTTP, formulário reativo, RxJS, Observables, além da aplicação de todas as boas práticas de criação de componentes reutilizáveis e utilização dos principais recursos do Angular, como criação de pipes, diretivas e códigos reutilizáveis.

Visão Geral

Este aplicativo permite a atualização dos dados dos usuários, permite realizar operações de CRUD (Create, Read, Update, Delete) em uma base de dados de usuários. Além disso, utiliza Angular 17 para proporcionar uma experiência de usuário dinâmica e eficiente.

Recursos Principais

  • Formulário Reactivo: Utiliza formulários reativos do Angular para gerenciar a entrada de dados e validação do formulário.
  • Requisições HTTP: Utiliza o módulo HttpClient do Angular para realizar requisições HTTP para um backend.
  • Tailwind CSS: Framework CSS utilizado para estilização do aplicativo, fornecendo uma abordagem baseada em classes para criação de estilos.
  • Angular Material: Componentes de interface de usuário do Angular Material são integrados para fornecer uma interface moderna e responsiva.
  • RxJS e Observables: Utiliza o Reactive Extensions for JavaScript (RxJS) e observables para lidar com streams de dados assíncronos de forma eficiente.
  • Rotas: Utiliza o roteamento do Angular para navegação entre diferentes componentes da aplicação.
  • Componentes Reutilizáveis: Todas as boas práticas de criação de componentes reutilizáveis são aplicadas para promover a modularidade e a manutenibilidade do código.
  • Códigos Reutilizáveis em Utils: Utilização de módulos Utils para armazenar códigos reutilizáveis, promovendo a organização e a reutilização de funcionalidades.
  • Enums: Criação de enums para representar constantes e melhorar a legibilidade e manutenibilidade do código.
  • Máscaras de Entrada com ngx-mask: Utiliza a biblioteca ngx-mask para aplicar máscaras de entrada em campos de formulário, como CPF, telefones, entre outros, garantindo que os dados sejam inseridos em um formato específico e padronizado.
  • API CountriesNow: O projeto consome a API CountriesNow para obter dados relacionados a países, como lista de países e suas cidades.

⚙️ Como Executar

Para executar a aplicação localmente, siga os passos abaixo:

  1. Clone este repositório:
  git clone https://github.com/JoneilsonLima/angular-user-update-form.git
  cd reactive-forms
  1. Instale as dependências
  npm install
  1. Inicie a aplicação
  ng serve