onyrius/XP-desafio-Frontend

Desafio XP inc. Frontend

👋 Bem-vindas e bem-vindos!

Olá! Sejam bem-vindas e bem-vindos ao meu repositório! Meu nome é Suelen Arruda e vou apresentar o desafio técnico da XP inc que topei participar! Algo importantíssmo de dizer: Esse desafio foi aceito durante um período mega corrido da Trybe e durante o curso de gerenciamento de projetos do Google , o que tornou ainda mais desafiador aceitá-lo!

E um momento tão corrido, tendo equilibrar os pratos da vida, optei por fazer algo simples e que cumprisse com os requisitos mínimos.

💡 O Desafio 💡

Desenvolver

✅ Tela de Login;

✅ Tela de Depósito e Saque numa conta digital;

✅ Uma tela que liste todas as ações disponíveis, diferenciando as ação que estão na carteira da pessoas daquelas ações que ela não investiu.

✅ Tela de Compra/Venda de Ações;

O Desenvolvimento

Como o tempo está escasso, para desenvolver de forma rápida, escolhi stacks que já tenho familiaridade:

• React js para montar os componentes;
• Redux ToolKit e Hooks para manipular os estados e deixar o código um pouco mais sucinto;

No decorrer do desenvolvimento, encontrei vários desafios, bugs, erros que solucionei estudando as documentações, fazendo pesquisas em fóruns e principalmente: me atentando ao que o erro dizia!, ou seja a linha, os arquivos, o tipo de erro que vem descrito no console. Ao me atentar aos erros, aprendi sobre eles e quando acontecia novamente, já sabia como solucionar. Errar rápido para ir mais longe! 😉

✅ Tela de Login

Na tela de Login, o usuário insere email e senha que passam por verificações:

• senha com caracteres mínimos e email para habilitar o botão.
• o email já deve estar cadastrado na base dados.
• apenas quem cumpre todas as verificações que consegue entrar na aplicação.

✅ Tela que lista todas as ações;

Quando pessoa usuária faz login, entra na página inicial que lista todas ações que ela possui e ações da bolsa:

• é possível selecionar os ativos que quer comprar ou vender;
• é possivel entrar no banco de digital para depositar e para retirar dinheiro;

✅ Tela de Compra/Venda de Ações;

Quando a pessoa seleciona que quer comprar ou quer vender um ativo dela, ou comprar da Bolsa de Valores, ela é redirecionada para uma tela que na qual é possível executar apenas uma das ações: ou compra ou venda:

• só é possível comprar a quantidade disponível pela bolsa.
• é possível adicionar novos ativos à sua carteira;
• só é possível vender a quantidade de ações que a pessoa usuária possui;

✅ Tela de Depósito e Saque na conta digital;

Na tela do banco digital, a pessoa será capaz de:

• depositar valores na sua conta;
• retirar valores da sua conta;

Obs: em toda aplicação é possível visualizar o saldo atualizado na parte superior da aplicação.

Stacks utilizada

Gif da aplicação

🖥️ Para rodar a aplicação em seu computador

A aplicação foi desenvolvida com o node v16.14.2.
Faça um git clone do repositório para seu computador. Entre na pasta do desafio e rode os seguintes comando no terminal.

instalará as dependências :

npm install

iniciará a aplicação localmente:

npm start

Caso não defina outra, aplicação rodará na porta: http://localhost:3000.

Para acessar a aplicação fazer login com as seguintes credencias:

email: suelenArruda@XP.com
senha: 5 caracteres ou mais da sua escolha

Observações: os registros das usuárias e dos usuários estão na pasta src/simulacro/index

---

Observações: Sou adepta dos testes, tanto que sou chamada carinhosamente pela turma como rainha dos testes 🥰🥰🥰, porém, como era a primeira vez que usava o Redux Toolkit, e optei por não fazer TDD, tive dificuldades para aprender a configurar o render do teste dentro do tempo solicitado. 😭😭😭😭