SiteWatch | Projeto de Gabriel

O Problema

Garantir que um sistema web esteja sempre online é crítico para qualquer negócio. Porém, descobrir que o seu site caiu através da reclamação de um cliente gera uma péssima experiência e prejuízos.

A necessidade era construir um sistema autônomo e confiável que não apenas verificasse o status de múltiplas URLs em intervalos regulares, mas que também armazenasse o histórico de latência para análise e alertasse os responsáveis instantaneamente.

A Solução

O SiteWatch foi desenvolvido como uma plataforma SaaS baseada em microsserviços. O Backend (Node.js) atua como um 'motor' contínuo de checagens usando cron jobs assíncronos.

O Frontend (Next.js) fornece um dashboard moderno e analítico onde o usuário cadastra seus sites e visualiza o uptime e o tempo de resposta através de gráficos detalhados construídos com Recharts.

Quando uma queda é detectada, o sistema automaticamente abre um 'Incidente' e dispara alertas via Webhooks (Discord/Slack) e e-mails transacionais (Resend).

Arquitetura e Desafios Técnicos

Desenvolver um sistema de monitoramento contínuo exige atenção redobrada à performance e gerenciamento de processos assíncronos.

Principais Tecnologias:

Frontend hibrído utilizando as novas features do Next.js 15 (App Router) e React 19.
Estilização ágil com Tailwind CSS v4 para uma interface 'Glassmorphism' fluida.
Backend Express blindado com JWT e bcrypt para segurança de usuários.
Banco de dados PostgreSQL orquestrado via Prisma ORM.

Desafios Enfrentados:

1. Múltiplos Cron Jobs Dinâmicos Como cada usuário pode definir se quer checar seu site a cada 1, 5 ou 15 minutos, criar cron jobs fixos não era viável.
→ Solução: Implementei um gerenciador de rotinas onde cada site possui seu próprio cron atrelado no node-cron dinamicamente.

2. Visualização de Dados Temporais Plotar o histórico de respostas HTTP de forma clara.
→ Solução: Utilização da biblioteca Recharts com formatação customizada de eixos X/Y para apresentar latência (ms) de forma amigável.

Resultados e Evolução

O SiteWatch consolidou-se como a aplicação mais robusta do portfólio, integrando comunicação ponta a ponta com TypeScript e práticas modernas de desenvolvimento web.