React - Superbid

🗃 Projeto

Aplicação React para cadastro de vendedores em um marketplace.

📝 O que foi solicitado para ser feito nesse teste técnico/prático:

A ideia é ver como você estrutura um projeto e como aplica o conceito de "clean code" e separação de responsabilidades.

O desafio é criar um wizard, como se fosse um cadastro em um e-commerce onde a cada novo step você precisa salvar o anterior no caso dele querer voltar para revisar ou editar algo.

1- Criar um projeto em react

2- Utilizar o styled-components

3- evitar utilizar componentes já prontos de bibliotecas.

Será avaliado o seu conhecimento em CSS tanto em harmonia das informações na tela quanto em responsividade.

💻 Demonstração

Pode ser acessada online atráves do link: https://react-superbid.vercel.app/

Obs: ao final do cadastro é gerado um JSON com a finalidade de ser enviado para um possivel backend, que no momento não está conectado, porém é possivel visualizar o JSON criado ao finalizar o cadastro inspecionando a pagina e visualizando o console log.

🛠 Possiveis melhorias:

1. Conectar o formulário de cadastro ao backend

2. Adicionar mais recursos extras de responsavidade para versão mobile

3. Adicionar verificações/validações aos inputs Ex: verificar se cpf/cpnj/email etc… é valido ou não

4. Adicionar mais campos/inputs ao formulário de cadastro caso necessario

5. Adicionar widget fixo no canto inferior da tela de (“Fale conosco em caso de dúvidas” ) que abra um chatbot por exemplo

6. Apos concluir o cadastro redirecionar para a pagina principal do marketplace

7. Caso você tenha mais alguma sugesão de melhoria sera muito bem vinda, entre em contato comigo ou faça um pull-request nesse repositório.

🧪 Tecnologias

Esse projeto foi desenvolvido principalmente com as seguintes tecnologias:

• React

• TypeScript

• Styled-components

📕 Bibliotecas

Esse projeto foi utilizou das seguintes libs:

• vitejs
• styled-components
• react-dom
• react-svgr

🔖 Layout

• Fonte: Nunito

• Cores:

   Cinza background → #F8F8F8
  
   Preto fonte  primário  →  #131415
  
   Cinza fonte →  #66696F
  
   Laranja primário → #EC660B
  
   Azul primário → #0050A0
  
   Azul claro → #D6EAF5
  

---

🚀 Como executar

Clone o projeto e acesse a pasta do mesmo.

$ git clone https://github.com/guilhermemm-dev/react-superbid
$ cd react-superbid

Para iniciá-lo, siga os passos abaixo:

# Instalar as dependências
$ yarn ou npm install

# Iniciar o projeto
$ yarn start ou npm run dev

O app estará disponível no seu browser pelo endereço http://localhost:3000.

📝 License

Esse projeto está sob a licença MIT.

---

Feito por Guilherme Martins - @guilhermemm-dev

1. LinkedIn: https://www.linkedin.com/in/guilhermemm-dev/

2. GitHub: https://github.com/guilhermemm-dev

3. Portfolio: https://guilhermemm-dev.github.io/portifolio/