Aplicação completa de gestão de treinos para academias — funciona 100% offline como PWA
4Fit é um sistema completo de gestão de treinos desenvolvido como Progressive Web App (PWA) com Next.js 14 e App Router. A aplicação permite que usuários acompanhem seus treinos, monitorem sua evolução física e mantenham a motivação através de um sistema de gamificação com streaks — tudo isso funcionando offline após a primeira instalação.
| Feature | Descrição |
|---|---|
| PWA Completo | Instalável e funcional 100% offline |
| Sistema Booster | Gamificação com streak de treinos consecutivos |
| Dashboard | Acompanhamento diário intuitivo |
| Calculadora IMC | Ferramenta integrada de saúde |
| Treinos Detalhados | Exercícios com vídeos e instruções completas |
| Dark Mode | Suporte completo a tema escuro |
| 100% Responsivo | Design adaptado para qualquer dispositivo |
Sequência atual de treinos consecutivos
Maior sequência registrada
Total de treinos realizados
Reset automático ao pular um dia
A gamificação com streaks aumenta o engajamento e mantém os usuários motivados a não quebrar a sequência.
users → Usuários do sistema
workout_plans → Planos de treino personalizados
workouts → Treinos individuais (A, B, C...)
exercises → Catálogo completo de exercícios
workout_exercises → Vínculo exercícios ↔ treinos
workout_logs → Histórico completo de treinos
user_booster → Sistema de streak e gamificação
body_measurements → Medidas corporais e evolução
partners → Parceiros da academia
notifications → Sistema de notificações| Tecnologia | Papel no Projeto |
|---|---|
| Next.js 14 | Framework fullstack com App Router |
| TypeScript | Tipagem estática end-to-end |
| Tailwind CSS | Estilização utility-first |
| SQLite (better-sqlite3) | Banco de dados leve e embarcado |
| next-pwa | Service Worker + manifest automático |
| Lucide React | Ícones modernos e acessíveis |
4fit/
├── public/
│ ├── icons/ # Ícones PWA (múltiplas resoluções)
│ ├── images/ # Assets visuais
│ ├── videos/ # Vídeos dos exercícios
│ └── manifest.json # PWA Manifest
├── src/
│ ├── app/ # App Router (Next.js 14)
│ │ ├── bmi/ # Calculadora de IMC
│ │ ├── dashboard/ # Dashboard do usuário
│ │ ├── workout/ # Detalhes do treino
│ │ ├── layout.tsx # Layout global
│ │ └── page.tsx # Landing page
│ ├── components/ # Componentes reutilizáveis
│ ├── lib/
│ │ ├── database.ts # Configuração SQLite
│ │ └── utils.ts # Funções utilitárias
│ ├── styles/ # Estilos globais
│ └── types/ # Tipos TypeScript
└── data/ # Banco SQLite (gerado automaticamente)
# Clone o repositório
git clone https://github.com/Jairotsb/4fit.git
cd 4fit
# Instale as dependências
npm install
# O banco de dados é criado automaticamente na 1ª execução
# Modo desenvolvimento
npm run dev
# Build de produção
npm run build
# Servidor de produção
npm startAcesse
http://localhost:3000e instale como PWA para a experiência completa!
Mobile (Android / iOS)
1. Acesse o site pelo navegador
2. Toque no menu do navegador
3. Selecione "Adicionar à tela inicial"
4. Confirme a instalação
Desktop (Chrome / Edge)
1. Acesse o site
2. Clique no ícone de instalação na barra de endereços
3. Clique em "Instalar"
- Sistema de autenticação completo
- Migração para Supabase (substituindo SQLite local)
- Upload de vídeos dos exercícios
- Notificações push de lembretes de treino
- Gráficos de evolução corporal
- Exportação de relatórios em PDF
- Integração com wearables (smartwatch)
- Chat com personal trainer
- Sistema de agendamento de treinos
Desenvolvido por Jairo Tunisse