Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/gmartins-dev/react-superbid

teste react superbid
https://github.com/gmartins-dev/react-superbid

Last synced: 28 days ago
JSON representation

teste react superbid

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 **React**

- Ts **TypeScript**
- Ts **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



FormStep1



FormStep2



FormStep3



FormStep4

## 🚀 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.

License


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/