/ng-cash-frontend

Primary LanguageTypeScript

Sobre o projeto

Aplicação feita em um desafio técnico da NG.CASH: Estruturar uma aplicação web fullstack, dockerizada, cujo objetivo seja possibilitar que usuários da NG consigam realizar transferências internas entre si.

Desktop screenshot

Mobile

screenshot

Stacks

Client

Funcionalidades

  • Página para realizar o cadastro na NG informando username e password.

  • Página para realizar o login informando username e password.

  • Com o usuário logado, a página principal deve apresentar:

    • balance atual do usuário;
    • seção voltada à realização de transferências para outros usuários NG a partir do username de quem sofrerá o cash-in;
    • tabela com os detalhes de todas as transações que o usuário participou;
    • mecanismo para filtrar a tabela por data de transação e/ou transações do tipo cash-in/cash-out;
    • botão para realizar o log-out;

Variáveis de ambiente

Para rodar esse projeto, você precisará adicionar as seguintes variaveis de ambiente em um arquivo .env

REACT_APP_BASE_API_URL=http://localhost:3001

Começando

Pré-requisitos

Antes de começar, você precisará ter instalado em sua máquina as seguintes ferramentas: Git, Node.js e Typescript.

Rodar localmanente

Clone o projeto

  git clone https://github.com/zirtaebn/ng-cash-frontend.git

Vá para o diretório do projeto

  cd ng-cash-frontend

Instale as dependências

  npm install

Inicie o servidor

  npm start

Uso

Após criar sua conta, a aplicação te direcionará automaticamente para a página de login. Então, coloque suas infomacões cadastradas anteriormente.

Desktop screenshot screenshot

Mobile

screenshot
screenshot

Página da sua conta. Se esse for seu primeiro acesso, seu balance terá R$ 100,00 automaticamente.

Desktop screenshot
screenshot

Mobile

screenshot
screenshot

Para transferir, aperte o botão "transferir" na página de sua conta. Então, você deverá informar o valor e o username para quem deseja realizar a transferência. O username deve ser válido, ou seja: a conta deve estar cadastrada no sistema. O meu username "zirtaebn" está disponível para transferência.

Desktop screenshot

Mobile

screenshot

Para ver as suas transferências, aperte em "ver transferências" na página de sua conta. Você poderá filtrar as tranferências recebidas e enviadas. Se clicar em uma transferência específica, terá mais detalhes.

Desktop screenshot
screenshot

Mobile

screenshot
screenshot

Contribuição


Contribuições são sempre bem vindas!

Contato

Beatriz Sant'Anna - @zirtaebn - zirtaebndev@gmail.com

Link do projeto: https://github.com/zirtaebn/ng-cash-frontend

Reconhecimentos

Recursos e bibliotecas úteis que utilizei no projeto.