Read it in English

O projeto deste repositório é uma aplicação de controle financeiro onde o usuário pode cadastrar suas entradas e saídas financeiras mensais. Este projeto foi desenvolvido como desafio técnico para o processo seletivo da Empbank para o cargo de Desenvolvedor Fullstack Júnior.

Nota: O banco de dados PostgreSQL e a hospedagem da API foi feita via Railway, que possui limitação de horas mensais para funcionamento, colocando a aplicação em hibernação ao fim deste limite (o limite é renovado no mês seguinte).

Na data de 15/02, o limite de tempo estava pouco acima de 300h, o que deve durar tempo suficiente para que a análise da Empbank seja concluída nos próximos dias.

🪧 Vitrine. Dev
✨ Nome	Empbank: controle financeiro
🏷️ Tecnologias	React, TypeScript, Mantine, Sass, PostgreSQL, Prisma, Firebase, Node, Express, Railway
🚀 URL	https://empbank-angela.vercel.app/
🎨 Design	Figma

✅ Requisitos técnicos

• Front-end: React, Typescript e Mantine.
• Back-end: Node, Typescript, Express e ORM à escolha.
• Banco de dados: PostgreSQL.

🖧 Funcionalidades

Tela de Login

• Login por email e senha

Tela de Cadastro

• Cadastro de usuário com nome completo, email e senha.

Tela Wallet

• Dashboard com entrada, saída e valor total;
• Listagem de todas as transações segmentadas por data, com paginação;
• Barra de busca por título e nome da categoria;
• Botão para adicionar nova transação;
• Modal para nova transação;
• Tabela de transações com título, valor, categoria e entrada ou saída.

Opcionais

• Aplicação responsiva.

⚙️ Como usar

• Cadastre-se na aplicação na tela de Cadastro (você pode usar um e-mail fictício);
• Se o cadastro der certo, você será redirecionado para a tela de Login para acesso;
• Caso não queira efetuar cadastro, basta acessar a aplicação com o email [email protected] e senha 123456;
• Na tela Wallet, você pode cadastrar uma Nova Transação no botão do canto superior direito;
• As transações cadastradas são mostradas na mesma tela em forma de tabela;
• Para pesquisar transações, basta digitar na barra de busca;
• Para sair da aplicação, clique na mensagem de boas vindas na parte superior da tela.

🔼 Voltar ao topo

---

🔎 Overview

The project in this repository is an web app for financial control where the user may register her/his monthly cash inflow and outflows. This project was developed as a technical test for Empbank's Junior Fullstack Developer opening.

Note: The database and the API url are hosted via Railway, which has a monthly working-time limit and which puts the app under hybernation after this limit is reached (it renews the next month).

In Feb/12, the time limit was a little bit higher than 300h, which may be enough time for the analysis of Empbank to occur in the next few days.

✅ Technical requirements

• Front-end: React, Typescript and Mantine.
• Back-end: Node, Typescript, Express and ORM of my choice.
• Banco de dados: PostgreSQL.

🖧 Features

Login screen

• Login with email and password

Register screen

• User registration with name, email and password

Wallet screen

• Dashboard with inflows, outflows and total values;
• List of all transactions shown by date (descendant) and with pagination;
• Search bar for title and category;
• Button for new transaction;
• Modal for new transaction;
• Table of transactions with title, value, category and type (inflow/outflow).

Optionals

• Responsive app.

⚙️ How to use it

• Register to the app in the Register page (you can use a fake email);
• If the registration is successful, you will be redirected to Login screen for access;
• In case you do not wish to register, you can enter the application with the emmail [email protected] and password 123456;
• On Wallet screen, you can add a new transaction by clicking the button on the top right corner;
• The new transactions will be shown on this same screen in the form of a table;
• To search transactions, you can type directly on the search bar;
• To log out of the application, click on the welcome message on the top center of the screen.

🔼 Back to top

---

Developed with 🧡 by @sucodelarangela