O Refund é uma aplicação interativa desenvolvida para facilitar a organização e solicitação de reembolsos. O foco principal deste projeto foi aplicar conceitos avançados de manipulação de estados no Front-end utilizando JavaScript puro, garantindo uma interface fluida e uma experiência de usuário (UX) otimizada.
- Entrada Inteligente: Formatação automática de moeda (BRL) em tempo real enquanto o usuário digita.
- Gestão Dinâmica: Adição e remoção de despesas sem a necessidade de recarregar a página.
- Cálculos em Tempo Real: Atualização automática do contador de despesas e do valor total acumulado.
- Categorização Visual: Identificação automática de ícones com base na categoria selecionada (Alimentação, Hospedagem, Serviços, Transporte e Outros).
- Interface Responsiva: Layout adaptável para dispositivos móveis, tablets e desktops.
- HTML5: Estrutura semântica.
- CSS3: Estilização com Flexbox, Grid e variáveis CSS para temas.
- JavaScript (Vanilla): Lógica de negócio e manipulação de DOM.
- Regex (Expressões Regulares): Utilizadas para sanitização de inputs e máscaras financeiras.
- Event Delegation: Técnica otimizada para capturar cliques em elementos gerados dinamicamente.
- DOM API: Criação e renderização de elementos via script (
createElement,append,closest). - Tratamento de Exceções: Implementação de blocos
try/catchpara garantir a robustez da aplicação. - Internacionalização: Uso de
toLocaleStringpara formatação precisa de valores monetários.
Este projeto faz parte do meu portfólio como desenvolvedor Fullstack. Durante o desenvolvimento, busquei aplicar os princípios de código limpo e organização de dados que venho estudando em literaturas como "Entendendo Algoritmos" e "Estruturas de Dados e Algoritmos com JavaScript".
O objetivo foi simular um fluxo real de uma empresa onde a precisão dos dados financeiros e a facilidade de uso são cruciais.
- Clone o repositório:
git clone [https://github.com/matssgit/refund-project.git](https://github.com/matssgit/refund-project.git)