ÍGNEA Hub
Uma página pública que reúne as ferramentas da ÍGNEA DATA para o setor mineral, como MineCheck, ReportGeo e Calendário Mineral, explica o que cada uma faz e leva até ela. Gestores, equipes de conformidade e engenheiros chegam pela mesma página, então ela precisava funcionar para os três.
Trabalhei no hub desde a primeira versão, em 2025, e fui o único desenvolvedor dele de janeiro a maio de 2026.
O problema
A ÍGNEA DATA oferece várias ferramentas separadas para o setor mineral, cada uma no seu próprio domínio. A primeira versão do hub, feita em 2025, era um portal com login, dashboard, painel administrativo e banco de dados próprio. A empresa precisava de uma página pública onde qualquer pessoa visse todas as ferramentas, entendesse o que cada uma faz e conseguisse abri-la. A lista de ferramentas também mudava bastante, com produtos entrando, trocando de nome e saindo do ar, então o site tinha que acompanhar isso sem mexer no layout.
Decisões
Cortar o back-end que o site não usava mais
Depois que o hub virou um catálogo estático, a produção ainda rodava seis containers, entre eles dois bancos PostgreSQL e dois pgAdmin, que juntos ocupavam os 2 GB de RAM do servidor e derrubavam a máquina. Tirei o Prisma, o código de autenticação, as rotas de API e o Redux, reduzi o deploy a um container e deixei um arquivo compose separado para desenvolvimento local.
Uma página com estado em vez de uma rota por produto
Mantive o hub inteiro em uma página e troquei de produto pelo estado do React. A barra lateral e o idioma escolhido ficam como estão enquanto a pessoa navega, e isso basta para um catálogo de dez itens. O custo é que a página de um produto não tem URL própria para compartilhar.
Uma marca só em vez de um logo por produto
A equipe decidiu não criar um logo para cada sistema. Registrei a mudança numa especificação curta e depois tirei os logos e ícones de cada produto da barra lateral e dos cards, escondi a lista de produtos com a barra recolhida, já que não havia mais ícone para mostrar, e coloquei a marca ÍGNEA DATA em todas as páginas de detalhe, para os produtos aparecerem como partes de um mesmo conjunto.
O que eu fiz
- Partes do front-end da primeira versão, em 2025, com React e Tailwind CSS: os componentes de card e de menu, o menu hambúrguer no mobile, um modal com mais detalhes ao clicar num card, a interface do painel administrativo (dashboard, gestão de usuários e configurações) e uma página de documentação do front-end.
- A nova página pública: fiz um protótipo num repositório separado em dezembro de 2025, migrando de Vite para Next.js, e levei para o repositório principal em janeiro de 2026 com hero, grade de produtos, página de detalhe, CTA, rodapé e uma barra lateral que recolhe sozinha abaixo de 1024 px.
- Um modelo de conteúdo bilíngue e tipado em TypeScript: cada texto de produto fica guardado como par português e inglês, e um botão no pé da barra lateral troca o idioma da página inteira.
- Um estado pendente para produtos sem texto oficial ou sem URL de produção: um texto neutro de “em revisão”, status em âmbar no painel de detalhe e botão de acesso desativado com o rótulo “Link pendente”. Com isso o catálogo passou de cinco sistemas ativos para dez, seis deles pendentes, sem informação inventada nem link quebrado.
- Um setup Docker enxuto para o AWS Lightsail: saída standalone do Next.js, imagem Node 20 Alpine em dois estágios, limite de memória no container e no heap do Node, init para limpar processos zumbis e health check com wget em vez de abrir um segundo processo Node.
- Correções de segurança e de carregamento: atualizei o Next.js da 15.4.7 para a 15.5.12 para corrigir a CVE-2025-66478, removi cerca de 67 MB de imagens que nenhuma página usava e parei de buscar a textura de fundo num site externo, primeiro hospedando o arquivo no próprio projeto e depois embutindo como data URI.
Como funciona
O hub é uma única página em Next.js 15. Um componente de cliente guarda três estados: o produto selecionado, se a barra lateral está recolhida e o idioma atual (português ou inglês). Barra lateral, grade de produtos e rodapé leem a mesma lista de produtos, e escolher um produto troca a visão geral pela página de detalhe ali mesmo, sem mudar de rota. Em janeiro de 2026 fiz as rotas antigas (login, dashboard, admin e documentação) redirecionarem para a página inicial, e em fevereiro apaguei essas rotas junto com o back-end.
O conteúdo dos produtos fica em um arquivo TypeScript tipado, que tirei de dentro do componente da página em maio de 2026. Cada produto tem id, nome, descrição e categoria nos dois idiomas, uma lista de funcionalidades com título e descrição bilíngues, um link opcional para o app, uma flag de ativo e um status de conteúdo, pronto ou pendente. Os componentes mostram o que está nesse arquivo e mais nada, então incluir, esconder ou renomear um produto é só mudar dados. Os textos da interface, como “Visão Geral” e “Voltar ao Hub”, seguem o mesmo estado de idioma.
O build gera um servidor standalone do Next.js dentro de uma imagem Docker em dois estágios, que roda com usuário sem privilégios de root e com health check, e sobe com Docker Compose numa instância do AWS Lightsail. O GitHub Actions roda ESLint, checagem de TypeScript e build de produção nos pull requests para as branches dev e main e nos pushes para dev.
Tecnologias
- Front-end
- Next.js 15, React 19, TypeScript, Tailwind CSS, ícones Lucide
- Infraestrutura
- Docker, Docker Compose, Node.js 20 (Alpine), AWS Lightsail
- Ferramentas
- GitHub Actions, ESLint