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-cepform


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

Last synced: 28 days ago
JSON representation

Awesome Lists containing this project

README 

        

# PROJETO - FORMULÁRIO DE ENDEREÇO



Online: [guilhermemm-dev/react-CEPform

](https://react-cep-form.vercel.app/)



## CHECK LIST:



[X]Instalar depencias iniciais



[X]Consumir API



[X]Criar formulário



[x]Fazer validações/verificações no form



[x]Criar Tela/Pagina 2



[x]Organizar Pastas



[x]Separar Responsabilidades



[x]Componetizar



[x]Typeficar



[x]Criar .env



  

  



### O que é importante de se utilizar?



  



[x] React JS



[x] TypeScript – 3 pontos



[x] Axios – 1 pontos



[x] React Router Dom – 1,5 ponto



[-] React Query – 2 pontos



[x] Chakra UI – 1,5 ponto



[x] Responsividade – 2 pontos



[x] React Router Dom - 1 pontos ??



[x] Context API - 3 pontos



  



Resultado: xxxx



Total: 15 pontos



 


  



### Teste Front-End - Júnior:



Será uma aplicação para consumir uma API pública de CEP.



  



Requisitos:



  



TELA 1:



1 - Formulário com CEP, Logradouro, Bairro, Complemente, Cidade e UF.



2 - Todos os campos são obrigatório, menos o de complemento.



3 - Você precisara pesquisar e utilizar uma API pública de CEP e consumi-la.



4 – Só deve ser feita a requisição para API, caso o CEP esteja com todos os caracteres



obrigatórios digitados no input (O CEP tem um número mínimo de caracteres).



5 – Deve aparecer para o usuário mensagens de erro, caso aperte no botão enviar, sem os campos obrigatórios estarem preenchidos.



  



TELA 2:



6 – Após fazer a requisição e ter esse retorno mostrado nos campos, o usuário deverá ir para



uma próxima tela, do qual vai haver a listagem das informações do CEP que teve de retorno da



API.



7- Na segunda tela, onde vai ter as informações, precisa ter um botão para eu voltar e



pesquisar um novo CEP.



8 – Na segunda tela, precisa ter, todas as listagens dos CEP que eu pesquisei.



9 – Layout: Fica a seu critério, seguindo os itens mencionados a cima e levando em



consideração as tecnologias mencionadas a baixo.



10 – O formulário deve ser validado sem utilização de bibliotecas de terceiros.



  

  



O que é importante de se utilizar?



  



- React JS



- TypeScript – 3 pontos



- Axios – 1 pontos



- React Router Dom – 1,5 ponto



- React Query – 2 pontos



- Chakra UI – 1,5 ponto



- Responsividade – 2 pontos



- React Router Dom - 1 pontos



- Context API - 3 pontos



Total: 15 pontos