EcoFlow: Gestão de Consumo de Água e Energia

O EcoFlow é uma aplicação web completa (Full Stack) projetada para ajudar indivíduos e empresas a monitorar, registrar e analisar seu consumo de água e energia.

O objetivo principal do projeto é fornecer uma ferramenta clara e visual que incentiva a redução de custos e a conscientização do impacto ambiental, permitindo que os usuários tomem decisões informadas com base em seus próprios dados de consumo.

🚀 Principais Funcionalidades

O sistema oferece uma suíte completa de ferramentas para o gerenciamento de consumo:

• Dashboard Analítico: Uma tela principal que exibe KPIs (Key Performance Indicators) essenciais, como custo total, consumo total de kWh e m³, além de gráficos que detalham o custo por aparelho e a tendência de consumo ao longo do tempo.
• Registro de Consumo Detalhado: Permite ao usuário registrar o uso de aparelhos, especificando o aparelho, a quantidade de uso (em minutos ou usos) e, opcionalmente, a data em que o consumo ocorreu.
• Histórico e Filtragem: Uma página de histórico detalhado onde o usuário pode visualizar todos os lançamentos, com filtros por período (data inicial/final) e tipo de consumo (água ou energia).
• Aparelhos Personalizados: Além de uma lista de aparelhos padrão, o usuário pode cadastrar, editar e excluir seus próprios aparelhos (ex: "Geladeira Brastemp", "PC do Escritório"), especificando sua potência (Watts) ou vazão (Litros/min).
• Tarifas Configuráveis: O usuário pode definir seus próprios valores de tarifa (preço por kWh e preço por m³), garantindo que os cálculos de custo no dashboard reflitam com precisão sua conta de luz e água.
• Gerenciamento de Conta: Usuários podem atualizar seus dados de perfil (nome, e-mail) e alterar suas senhas de forma segura.

🛠️ Pilha Tecnológica (Tech Stack)

O projeto é construído como um monorepo, separando o cliente do servidor:

Frontend (Cliente)

• Framework: React (com Vite)
• Roteamento: React Router
• Estilização: CSS Modules (para estilos escopados por componente)
• Gráficos: Recharts
• Requisições: Axios
• Gerenciamento de Estado: Zustand

Backend (API)

• Framework: Node.js com Express.js
• Banco de Dados: PostgreSQL
• Autenticação: JSON Web Tokens (JWT)
• Segurança: Bcrypt (para hashing de senhas)

Hospedagem (Cloud)

• Frontend: Vercel
• Backend: Render
• Banco de Dados: Neon (PostgreSQL Serverless)