Skip to content

rafaelmfranca/xp-technical-challenge

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Desafio técnico PSel - Turma XP 🚀

Esse projeto tem como objetivo desenvolver um aplicativo de investimento em ações, com algumas funcionalidades de conta digital

Desenvolvido com 💙 por Rafael França 👨‍💻




💭 Abordagem do desafio

  • 🎯 Objetivos principais
    • Foco na experiência e intuição do cliente ao utilizar a aplicação.
    • Desenvolver uma interface bonita e responsiva para diversos dispositivos.
    • Utilizar uma base de dados para simular as ações do cliente.
    • Prover um ambiente em nuvem (deploy e base de dados) para o teste e desenvolvimento da aplicação se assemelhar a um case real.
    • Produzir código limpo e legível.
  • 🔌 Tomadas de decisão
    • Para criar a interface, foram utilizados os frameworks NextJS e o Tailwind CSS em conjunto com a biblioteca de componentes Daisy UI 💄.
    • Com o objetivo de maximizar a experiência do cliente e validar as suas ações em tempo real, foi utilizado a biblioteca React Hook Form em conjunto com Yup para validação de formulários 🚨.
    • O ambiente escolhido para armazenar as informações do cliente foi o Supabase, que oferece um acesso baseado em nuvem a um banco de dados PostgreSQL 🐘.
    • A modelagem das entidades da base de dados e sua comunicação com as ações do cliente, foram realizadas com Prisma ORM e as API Routes do NextJS 🚀.
    • No desenvolvimento de testes unitários, foi utilizado o framework Jest e a React Testing Library 🐙.
  • 💻 Processo de desenvolvimento
    Foram utilizadas tecnologias auxiliares para o processo de desenvolvimento com o objetivo de padronização de commits, formatação e execução dos testes unitários relativos ao escopo das mudanças, prevenindo assim que uma nova feature impactasse no código base.
    • O desenvolvimento da aplicação foi dividido em três fases, sendo as duas últimas cíclicas:

      • 🏗️ Fase 1: Desenvolvimento de um boilerplate com as tecnologias a serem utilizadas na aplicação.
      • ⌨️ Fase 2 (Feature): Desenvolvimento da interface do usuário, posteriormente funcionalidades relativas aquele escopo e por fim testes unitários.
      • ✅ Fase 3: Testes manuais em ambiente de produção, correção e melhorias contínuas.



💻 Instruções de compilação e execução

  1. Esse projeto utiliza o pnpm como gerenciador de pacotes. Para instalá-lo, basta seguir esse passo a passo.

  2. Para rodar a aplicação é necessário um banco de dados Postgres. Para isso, recomendo que o faça com Docker ou simplesmente crie um projeto no Supabase - e copie a URI fornecida para seu .env 😄 (Settings -> Database -> Connection String -> URI).

  3. Clone o repositório do projeto:

    git clone git@github.com:rafaelmfranca/xp-technical-challenge.git
  4. Instale os pacotes

    cd xp-technical-challenge
    pnpm install
  5. Configure um arquivo .env conforme o .env.example na raiz do repositório.

    DATABASE_URL=postgres://USUÁRIO:SENHA@HOST:PORTA/NOME_DO_BANCO?schema=NOME_DO_SCHEMA
  6. Execute as migrações e seeders:

    pnpm prisma migrate dev
    pnpm prisma db seed

    Obs: No arquivo seed.ts é possível verificar as contas que estão elegíveis para fazer login 😁

  7. Execute o projeto:

    pnpm dev