Índice — CloudFinOps

Plataforma Web para análise e governança de custos de infraestrutura em nuvem. Boa parte do desperdício em ambientes AWS nasce de decisões de rede — NAT Gateways mal roteados, transferência entre regiões, endereços elásticos ociosos — e fica invisível até a fatura fechar. O CloudFinOps organiza esse diagnóstico em uma trilha única: ver, detectar e agir.

DisciplinaDesenvolvimento Web · 2026.2

CursoCST em Redes de Computadores · IFPB

EtapaConcepção e interface estática

TecnologiasHTML5, CSS3, SVG

Telas7

DadosFictícios (mock)

Telas da aplicação

clique para navegar

dashboard.html Dashboard Visão consolidada do período: custo acumulado, projeção de fechamento, economia potencial, FinOps Score, evolução mensal, alertas e governança de tags. Abrir tela → costs.html Custos Análise detalhada por serviço, ambiente, conta e região, com filtros combináveis e comparação com o período anterior. Abrir tela → anomalies.html Anomalias Desvios de gasto em relação à linha de base histórica, classificados por severidade e acompanhados por status de tratamento. Abrir tela → recommendations.html Recomendações Oportunidades de otimização priorizadas por economia estimada, com diagnóstico, ação sugerida e risco de execução. Abrir tela → budgets.html Orçamentos Acompanhamento de orçamento por escopo, com consumo acumulado, projeção de fechamento e alerta antecipado de estouro. Abrir tela → governance.html Governança Inventário de recursos, taxonomia das tags obrigatórias, conformidade por chave e custo que não pode ser atribuído a nenhuma equipe. Abrir tela →

Sobre esta etapa

o que existe e o que ainda não existe

Implementado

Sete telas estáticas navegáveisHTML semântico e CSS próprio, sem frameworkPronto
Filtros por categoria sem JavaScriptSeletor irmão sobre campos de rádioPronto
Gráfico de evolução em SVGEscrito à mão, sem biblioteca de gráficosPronto
Identidade visual e logoMarca em SVG, tokens de design e tema escuroPronto
Conjunto de dados fictícios coerenteOs valores fecham entre todas as telasPronto

Próximas etapas

Consumo de API simuladajson-server, Fetch e manipulação de DOMProjeto 1.1
Filtros e ordenação em JavaScriptSubstituem a filtragem feita hoje em CSSProjeto 1.1
API REST e banco de dadosExpress.js, Prisma e PostgreSQLProjeto 1.2
Autenticação e autorizaçãoJWT e controle de acesso por perfilProjeto 1.2
Integração real com a AWSCost Explorer, Budgets e CloudWatchFuturo

Protótipo de interface. Todos os números exibidos são fictícios e representam um ambiente AWS plausível com 3 contas e 428 recursos. Nesta etapa a aplicação não se conecta a nenhuma API e não executa ações sobre a infraestrutura: o objetivo é validar a organização das informações, a hierarquia visual e o fluxo de navegação entre as telas.