Cuidar de pessoas é cuidar dos resultados
Plataforma web institucional da Equilíbria Soluções - consultoria especializada em saúde mental corporativa, desenvolvimento de liderança e bem-estar organizacional.
- Sobre o Projeto
- Funcionalidades
- Tecnologias
- Instalação
- Uso
- Estrutura do Projeto
- Painel Administrativo
- API Backend
- Contribuindo
- Licença
A Equilíbria Soluções é uma plataforma web desenvolvida para promover serviços de consultoria empresarial focados em:
- Saúde Mental Corporativa: Palestras e treinamentos sobre bem-estar emocional
- Desenvolvimento de Liderança: Capacitação de líderes para alta performance
- Leituras Corporais: Análise de linguagem corporal e comunicação não-verbal
- Gestão de Equipes: Otimização de clima organizacional e produtividade
- 🏠 Home com apresentação institucional
- 🎥 Serviços em Destaque com vídeos demonstrativos dinâmicos
- 💬 Depoimentos de clientes
- 📝 Formulários de Contato dual:
- Formulário para interessados (empresas)
- Formulário para clientes existentes (agendamento)
- 📱 Botão WhatsApp flutuante para contato rápido
- 🎨 Design Responsivo otimizado para todos os dispositivos
- 🔐 Sistema de Login com JWT
- 📹 Gerenciamento de Vídeos:
- Upload de até 3 vídeos simultâneos
- Preview antes do envio
- Substituição de vídeos existentes
- 🖼️ Interface Intuitiva com drag-and-drop visual
- React 19.1.0 - Biblioteca JavaScript
- React Router DOM 7.8.0 - Navegação SPA
- Tailwind CSS 4.1.11 - Framework CSS utilitário
- Vite 7.0.4 - Build tool e dev server
- Axios 1.11.0 - Cliente HTTP
- Lucide React 0.536.0 - Ícones
- React Icons 5.5.0 - Biblioteca de ícones
- Node.js com Express
- JWT para autenticação
- Multer para upload de arquivos
- API REST hospedada no Render
- Frontend: Vercel/Netlify (recomendado)
- Backend: Render.com
- Assets: Cloudinary/AWS S3
- Node.js 16+ instalado
- npm ou yarn
- Git
- Clone o repositório
git clone https://github.com/seu-usuario/equilibria-solucoes.git
cd equilibria-solucoes- Instale as dependências
npm install
# ou
yarn install- Configure as variáveis de ambiente
Crie um arquivo .env na raiz do projeto (se necessário):
VITE_API_URL=https://equilibria-backend-tmoo.onrender.com- Inicie o servidor de desenvolvimento
npm run dev
# ou
yarn dev- Acesse a aplicação
http://localhost:5173
npm run dev # Inicia servidor de desenvolvimento
npm run build # Cria build de produção
npm run preview # Preview do build de produção
npm run lint # Executa linterhttps://seudominio.com/painel
Credenciais devem ser fornecidas pelo administrador do sistema.
equilibria-solucoes/
├── public/
│ ├── logo.svg
│ └── logo-update.png
├── src/
│ ├── components/
│ │ ├── Contact.jsx # Formulários de contato
│ │ ├── Explain.jsx # Seção explicativa com tabs
│ │ ├── FadeInSection.jsx # Animação de entrada
│ │ ├── Footer.jsx # Rodapé
│ │ ├── Header.jsx # Cabeçalho/Menu
│ │ ├── Home.jsx # Hero section
│ │ ├── LandingPage.jsx # Página principal
│ │ ├── Painel.jsx # Painel administrativo
│ │ ├── Services.jsx # Vídeos de serviços
│ │ └── Statements.jsx # Depoimentos
│ ├── css/
│ │ ├── fade.css # Animações
│ │ ├── global.css # Estilos globais
│ │ └── index.css # Tailwind imports
│ ├── img/ # Imagens do projeto
│ ├── App.jsx # Componente raiz
│ └── main.jsx # Entry point
├── .gitignore
├── eslint.config.js
├── index.html
├── package.json
├── README.md
└── vite.config.js
- Login seguro com JWT
- Upload de vídeos (formatos aceitos: mp4, mov, avi)
- Limite de 3 vídeos em destaque
- Preview antes do envio
- Substituição individual de vídeos
- Acesse
/painel - Faça login com credenciais
- Selecione vídeos para cada slot (1, 2 ou 3)
- Visualize preview
- Clique em "Enviar Vídeos Selecionados"
- Aguarde confirmação de upload
GET /videos # Lista vídeos em destaque
POST /contato # Envio de formulário de contato
POST /login # Autenticação de admin
POST /videos # Upload de vídeos (requer token)
// Login
POST https://equilibria-backend-tmoo.onrender.com/login
Content-Type: application/json
{
"username": "admin",
"password": "senha123"
}
// Response
{
"token": "eyJhbGciOiJIUzI1NiIs..."
}A aplicação utiliza variáveis CSS customizadas:
--azul-profundo: #1a3a52 /* Títulos e elementos principais */
--azul-serenity: #a8c5da /* Backgrounds suaves */
--verde-menta: #a8d5ba /* Acentos e CTAs */
--dourado-suave: #d4af6a /* Destaques especiais */
--cinza-neutro: #f0f0f0 /* Backgrounds neutros */
--cinza-escuro: #4a4a4a /* Textos secundários */O projeto é totalmente responsivo com breakpoints:
- Mobile: < 768px
- Tablet: 768px - 1024px
- Desktop: > 1024px
Contribuições são bem-vindas! Para contribuir:
- Fork o projeto
- Crie uma branch para sua feature (
git checkout -b feature/NovaFuncionalidade) - Commit suas mudanças (
git commit -m 'Adiciona nova funcionalidade') - Push para a branch (
git push origin feature/NovaFuncionalidade) - Abra um Pull Request
- Use ESLint configurado no projeto
- Siga convenções de nomenclatura React
- Mantenha componentes pequenos e reutilizáveis
- Comente código complexo
Este projeto está sob a licença MIT. Veja o arquivo LICENSE para mais detalhes.
Equilíbria Soluções
- Website: equilibriasolucoes.com.br
- Instagram: @equilibriasolucoes
- WhatsApp: (14) 98829-1968
Encontrou um bug? Abra uma issue descrevendo:
- Comportamento esperado
- Comportamento atual
- Passos para reproduzir
- Screenshots (se aplicável)
Para dúvidas ou suporte, entre em contato:
- 📧 Email: contato@equilibriasolucoes.com.br
- 💬 WhatsApp: (14) 98829-1968
Desenvolvido com ❤️ para transformar ambientes corporativos através do bem-estar