Rede social · Tempo real

Cats

Rede social de gatos com feed infinito, chat ao vivo e detecção de gatos no navegador.

Desafio

Evoluir um projeto React em uma experiência social com publicações, contas e mensagens em tempo real sem pesar o carregamento inicial.

Como resolvi

Integrei a interface a uma API WordPress headless e ao Socket.io, carregando chat, gráficos e detector apenas quando necessários.

O projeto começou como conclusão de um curso de React e cresceu para uma aplicação com API WordPress headless, sessões JWT, perfis e feed com carregamento infinito.

Ao publicar uma foto, o navegador usa TensorFlow.js e COCO-SSD para detectar gatos na imagem antes do envio. O detector é carregado sob demanda.

O chat reúne sala pública e conversas privadas com presença, indicador de digitação, reconexão e histórico paginado. Mensagens novas aparecem de forma otimista; as não lidas têm contador e podem gerar notificação enquanto a aba está oculta.

Como PWA, o Cats mantém a estrutura estática disponível offline. Consultas autenticadas e mensagens via Socket.io continuam dependentes da rede.

Próximo projetoPassai