ChatApp

Este é um componente React que implementa uma aplicação de chat em tempo real utilizando o Socket.IO. Ele possui um estado local (useState) para armazenar as mensagens que são enviadas e recebidas. O socket.io-client é importado e conectado a um servidor na porta 4000, com o qual o componente irá se comunicar.

Funcionalidades

• O componente ChatApp permite que os usuários enviem e recebam mensagens em tempo real através do Socket.IO.
• As mensagens são armazenadas em um estado local e exibidas no componente.
• A cor de fundo da mensagem é alternada entre rosa e branco a cada vez que um novo remetente envia uma mensagem. Se a mensagem atual tiver o mesmo remetente da mensagem anterior, a cor de fundo não é alterada.

Como usar

1. Clone o repositório para o seu computador.
2. Abra o terminal na pasta raiz do projeto e instale as dependências com o comando npm install.
3. Inicie o servidor com o comando npm run server.
4. Abra outro terminal na mesma pasta e inicie o cliente com o comando npm start.
5. Abra o navegador e acesse http://localhost:3000.

API

Funções

• handleSubmit(event): é chamada quando o usuário clica no botão "Enviar" no formulário de entrada de mensagens. Ela envia uma mensagem para o servidor via socket.io com a mensagem digitada pelo usuário e, em seguida, limpa o estado local da mensagem.

Estado

• message: estado local que armazena a mensagem digitada pelo usuário.
• messages: estado local que armazena todas as mensagens recebidas.

Dependências

• React
• Socket.IO-client

Contribuição

1. Fork do repositório.
2. Crie um branch para a sua nova funcionalidade (git checkout -b feature/nome-da-funcionalidade).
3. Comite as mudanças (git commit -m 'Adiciona nova funcionalidade').
4. Envie para o seu fork (git push origin feature/nome-da-funcionalidade).
5. Abra um Pull Request.