dt money é perfeito para quem quer gerenciar suas finanças de forma rápida e prática, podendo ter um controle de entradas e saídas de sua conta de uma forma organizada.
Este é um projeto desenvolvido durante o Ignite
Durante o segundo módulo de ReactJS no Ignite desenvolvemos do zero, juntamente com o Diego, o webapp dt money. Nele podemos gerenciar as finanças de maneira prática: basta adicionar uma nova transação com um nome, valor, tipo (entrada ou saída de dinheiro) e uma categoria que será cadastrada uma nova transação, calculando o total, todas as entradas e todas as saídas das já cadastradas.
Trabalhamos com Typescript, StyledComponents, Axios, MirageJS, Context API, componentes, estados e criação de Hooks dentro do ReactJS.
Ao final das aulas, para diferenciar o app dos demais e continuar sempre buscando o próximo nível, adicionei:
Interações com o usuário via Hot Toasts
Nova parte de "Ações" na tabela de transações
Função de edição de transação, possibilitando editar completamente cada transação por um modal
Função de deletar transação por um modal
Se o saldo ficar negativo, o background do total ficará vermelho.
Verificação dos campos para cadastrar uma nova transação, impossibilitando campos vazios
ReactJS
Styled Components
MirageJS
Axios
Typescript
👉 Figma layout design by Tiago Luchtenberg dt money
Para clonar e usar esta aplicação, você irá precisar de: Git Node.js v14.16.1 Yarn v1.22.5
# Clone this repository $ git clone https://github.com/LeoCPeres/02-dtmoney # Go into the repository $ cd 02-dtmoney # Install dependencies $ yarn install # Run Web App $ yarn start
O app estará disponível no seu browser pelo endereço http://localhost:3000