Skip to content

WillRy/hyperchat-front

Repository files navigation

💬 HyperChat - Real-Time Chat

Um aplicativo de chat em tempo real inspirado em mensageiros como o WhatsApp, desenvolvido com Laravel no backend e React no frontend.

O projeto oferece uma experiência moderna de troca de mensagens, com suporte a conversas privadas, grupos, anexos, áudios, emojis e mensagens formatadas em Markdown.


✨ Demonstração

Demo1

Repositórios

BackEnd: https://github.com/WillRy/hyperchat-api

FrontEnd: https://github.com/WillRy/hyperchat-front


🚀 Stack utilizada

Backend

  • Laravel – Framework PHP para construção da API e regras de negócio
  • Laravel Reverb – Comunicação em tempo real via WebSockets
  • REST API – Integração entre backend e frontend

Frontend

  • React – Construção da interface de usuário
  • TypeScript – Tipagem estática para maior segurança no desenvolvimento
  • Redux – Gerenciamento de estado global

📦 Tecnologias

Tecnologia Descrição
Laravel Framework PHP para backend
React Biblioteca para construção de interfaces
TypeScript Superset do JavaScript com tipagem estática
Redux Gerenciamento de estado da aplicação
Laravel Reverb Comunicação em tempo real via WebSockets

✨ Funcionalidades

💬 Conversas privadas

  • Chat em tempo real entre usuários
  • Atualização instantânea de mensagens

👥 Chat em grupo

  • Criação e gerenciamento de grupos
  • Conversas com múltiplos participantes

📎 Envio de anexos

  • Compartilhamento de arquivos diretamente nas conversas

🎙️ Envio de áudios

  • Gravação e envio de mensagens de voz

😀 Emojis

  • Suporte ao envio e visualização de emojis

📝 Markdown

  • Mensagens com formatação via Markdown
  • Destaques, listas, links e outros elementos textuais

⚡ Comunicação em tempo real

O projeto utiliza o Laravel Reverb para fornecer comunicação em tempo real através de WebSockets, permitindo:

  • Envio e recebimento instantâneo de mensagens
  • Atualização automática de conversas
  • Notificações de novas mensagens
  • Sincronização entre múltiplos clientes conectados

🛠️ Instalação

Pré-requisitos

  • PHP 8.2+
  • Composer
  • Node.js 18+
  • npm ou yarn
  • Banco de dados configurado

Backend (Laravel)

git clone https://github.com/seu-usuario/real-time-chat.git
cd real-time-chat

composer install
cp .env.example .env
php artisan key:generate

# Configure o banco de dados no arquivo .env
php artisan migrate

# Inicie o servidor Laravel
php artisan serve

Frontend (React)

cd frontend
npm install

# Inicie o servidor de desenvolvimento
npm run dev

Laravel Reverb

# Inicie o servidor Reverb
php artisan reverb:start

Laravel Queue

# Inicie o servidor Reverb
php artisan queue:work

📌 Roadmap

  • Indicador de usuário digitando
  • Confirmação de leitura
  • Notificações push
  • Pesquisa de mensagens
  • Chamadas de áudio e vídeo

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

Packages

Used by

Contributors

Languages