https://github.com/gmartins-dev/react-superbid
teste react superbid
https://github.com/gmartins-dev/react-superbid
Last synced: about 1 year ago
JSON representation
teste react superbid
- Host: GitHub
- URL: https://github.com/gmartins-dev/react-superbid
- Owner: gmartins-dev
- Created: 2022-05-28T10:04:10.000Z (almost 4 years ago)
- Default Branch: main
- Last Pushed: 2022-05-31T14:06:26.000Z (almost 4 years ago)
- Last Synced: 2025-02-01T17:25:33.306Z (over 1 year ago)
- Language: TypeScript
- Homepage: react-superbid.vercel.app
- Size: 336 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
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
8. 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](https://fonts.google.com/specimen/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.
```bash
$ git clone https://github.com/guilhermemm-dev/react-superbid
$ cd react-superbid
```
Para iniciá-lo, siga os passos abaixo:
```bash
# 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/