Web-Chat
Introdução
O Web-Chat é um projeto com o intuito de criar um chat de ajuda, que contém uma experiência dinâmica e salva as informações preenchidas pelo usuário usando um formulário.
📁
Acesso ao projeto
Você pode baixar o projeto, via github, ou acessa-lo pelo a seguir link para testá-lo.
https://app.netlify.com/sites/elegant-monstera-1527bc/deploys/631f6e6979a001000867e041
📼
Instalação
Instalação de dependências
: Para instalar as dependências, use o comando a seguir:
npm install
ou, se preferir use o yarn:
yarn
Inicialização do projeto
: Para iniciar o projeto, use o comando a seguir:
npm run init
🔨
Requisitos do projeto
Requisito 1
Experiência dinâmica
: Apresentar uma experiência dinâmica, onde o usuário preenche um campo por vez, e ao preencher o primeiro campo, mostra o segundo, e assim por diante.Requisito 2
Máscara para validação de data e e-mails válidos
: O sistema precisa ter uma máscara de validação de valores de todos os inputs necessários.Requisito 3
Estado diferente quando estiver com dados incorretos
: Deve-se ter um estado diferente no componente de input, ao usuário digitar um valor inválido e clicar em salvar.Requisito 4
Autocomplete para as cidades
: Ter um autocomplete no campo de "Cidade", mostrando todas as cidades disponíveis para seleção.Requisito 5
Testes unitários
: Escrita de testes em componentes possíveis com JEST, react-test-library e storybook.Requisito 6
Simulação de API
: Enviar os dados escritos para a URL 'https://mockapi.io'para simular uma conexão.Requisito 7
Responsividade
: A aplicação deve se comportar em todos os tipos de tela.
✔️
Técnicas e tecnologias utilizadas
Typescript
React
Jest
Formik
Yup
Axios
React-Test-Library
Styled-Components
Font-Awesome