Skip to content

Interface SPA desenvolvida em Angular 21 utilizando Signals para gerenciamento de estado e RxJS para consumo de API REST (Spring Boot).

Notifications You must be signed in to change notification settings

cesarburil/simple-angular-crud

Repository files navigation

User Management Frontend (Angular + Signals)

Este é o módulo frontend de uma aplicação Fullstack de gerenciamento de usuários. O projeto foi construído utilizando as funcionalidades mais recentes do Angular, com foco em reatividade moderna através de Signals e uma interface funcional integrada a um backend Spring Boot.


Tecnologias e Funcionalidades

Core Tech Stack

  • Angular: Utilizando a nova API de Signals para um gerenciamento de estado reativo, performático e moderno.
  • TypeScript: Desenvolvimento orientado a objetos e tipagem forte.
  • RxJS & HttpClient: Gerenciamento de fluxos de dados assíncronos e consumo de APIs REST.
  • Forms: Utilização de FormsModule para vinculação bidirecional de dados (Two-way data binding).
  • Bootstrap: Interface responsiva e componentes estilizados.

Funcionalidades Implementadas

  • Listagem Dinâmica: Renderização eficiente da lista de usuários via Signals.
  • Fluxo CRUD Completo: Interface para criação, leitura, atualização e exclusão de registros.
  • Gerenciamento de Estado Imutável: Uso de .update() e .map() para garantir que a UI reflita instantaneamente as mudanças do servidor.
  • Modo de Edição: Alternância inteligente entre estados de cadastro e edição no mesmo componente.

Como Executar o Projeto

Nota: Este frontend depende do Backend em Spring Boot para funcionar corretamente.

  1. Clone o repositório:

    git clone https://github.com/cesarbarts/simple-angular-crud.git
  2. Instale as dependências (Node.js necessário):

    npm install
  3. Inicie o servidor de desenvolvimento:

    ng serve
  4. Acesse a aplicação: Navegue para http://localhost:4200/.


Arquitetura do Sistema

O projeto segue uma estrutura organizada para facilitar a manutenção:

  • src/app/models/: Definição da classe User.
  • src/app/services/: Centralização das chamadas HTTP via UserService.
  • src/app/components/: Lógica de interface e manipulação dos Signals.

Próximos Passos (Roadmap)

  • Implementar validações avançadas nos campos de input.
  • Adicionar tratamento global de erros HTTP.
  • Implementar Dockerfile para conteinerização.

Desenvolvido por Cesar Buril - Conecte-se comigo no LinkedIn.

About

Interface SPA desenvolvida em Angular 21 utilizando Signals para gerenciamento de estado e RxJS para consumo de API REST (Spring Boot).

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published