🚌 Interno Rotas - UFMG

Navegue pelo Campus Pampulha com facilidade

🌐 Acessar Aplicação · 🐛 Reportar Bug · 💡 Sugerir Feature

---

📖 Sobre o Projeto

O Interno Rotas é uma aplicação web moderna e interativa para consulta de horários e rotas dos ônibus internos do Campus Pampulha da UFMG. Desenvolvido com foco em experiência do usuário, acessibilidade e performance, o projeto transforma informações fragmentadas em uma interface intuitiva e visualmente clara.

🎯 O Problema

O site oficial da UFMG disponibiliza informações sobre o transporte interno, porém:

• 📍 Utiliza apenas siglas de localização, dificultando a orientação de novos usuários
• 🖥️ Interface pouco intuitiva e não responsiva
• 🗺️ Ausência de visualização geográfica das rotas
• ⏰ Difícil identificar qual linha pegar para chegar a um destino específico

💡 A Solução

Funcionalidade	Descrição
🗺️ Mapa Interativo	Visualização geográfica completa do campus com zoom e pan
🎨 Rotas Animadas	Cada linha com cor única e animação de trajeto
⏱️ Horários em Tempo Real	Próximo ônibus e último que passou
📱 100% Responsivo	Otimizado para mobile, tablet e desktop
🌙 Tema Escuro	Suporte a dark mode nativo
🔍 Busca Inteligente	Encontre linhas rapidamente

---

✨ Funcionalidades

🗺️ Mapa & Rotas ✅ Mapa interativo com OpenStreetMap ✅ Rotas animadas com Leaflet Ant Path ✅ Marcadores de paradas clicáveis ✅ Popup com detalhes de cada parada ✅ Centralização automática na rota selecionada	📊 Horários & Informações ✅ Horários em tempo real ✅ Grade completa de horários ✅ Categorias: Dias Úteis, Sábados, Férias ✅ Indicador de próximo ônibus ✅ Aviso de período de férias/recesso
🎨 Interface & UX ✅ Design System completo ✅ Tema claro/escuro automático ✅ Animações suaves e transições ✅ Componentes acessíveis (ARIA) ✅ Feedback visual em interações	📱 Mobile & Performance ✅ Layout responsivo mobile-first ✅ Menu lateral adaptativo ✅ Touch-friendly interactions ✅ Performance otimizada ✅ Carregamento rápido

---

🎨 Screenshots

🖥️ Desktop

Tela Inicial	Linha Selecionada	Grade de Horários

📱 Mobile

Tela Inicial	Menu Lateral	Detalhes da Linha

---

🛠️ Stack Tecnológica

⚛️ Frontend Core

Tecnologia	Versão	Descrição
	19.x	Framework UI com novos recursos (use, ref as prop)
	5.9	Tipagem estática e IntelliSense
	8.x	Build tool ultrarrápido com HMR

🎨 Estilização

Tecnologia	Versão	Descrição
	4.x	CSS utility-first com @theme
	3.x	Variantes de componentes type-safe
	0.563	Ícones modernos e consistentes

🗺️ Mapas & Visualização

Tecnologia	Descrição
	Biblioteca de mapas interativos
	Tiles de mapa open source
Leaflet Ant Path	Animação de rotas com efeito "formiga"

📦 Outras Dependências

• @base-ui/react - Componentes headless acessíveis
• react-ga4 - Google Analytics 4 integration
• date-fns - Manipulação de datas
• use-debounce - Hooks de debounce

---

🏗️ Arquitetura

app/
├── src/
│   ├── components/          # Componentes React
│   │   ├── ui/              # Design System (Button, Card, Badge, Dialog...)
│   │   └── map/             # Componentes do mapa (MapMarkers, MapRoute...)
│   ├── contexts/            # Context API (RotasContext, ThemeContext)
│   ├── hooks/               # Custom hooks (useAnalytics, useLinhasFilter)
│   ├── services/            # Camada de serviços (RotasService)
│   ├── data/                # Dados estáticos (linhas, paradas)
│   ├── types/               # TypeScript types
│   └── config/              # Configurações (specialPeriods)
├── public/                  # Assets estáticos
└── docs/                    # Documentação técnica

🎯 Design Patterns Utilizados

• Compound Components - Dialog, Tabs, Card
• Context API - Estado global sem prop drilling
• Custom Hooks - Lógica reutilizável
• Service Layer - Abstração de dados
• Composition - Componentes flexíveis e extensíveis

---

🚀 Quick Start

Pré-requisitos

• Node.js 20.19+
• pnpm 8+ (recomendado) ou npm/yarn

Instalação

# Clone o repositório

git clone https://github.com/internorotas/ufmg.git
cd ufmg/app

# Instale as dependências

pnpm install

# Inicie o servidor de desenvolvimento

pnpm dev

# Acesse http://localhost:5173/ufmg/

Scripts Disponíveis

Comando	Descrição
`pnpm dev`	Inicia o servidor de desenvolvimento
`pnpm build`	Gera build de produção
`pnpm preview`	Preview do build local
`pnpm lint`	Executa ESLint
`pnpm format`	Formata código com Prettier

---

🤝 Contribuindo

Contribuições são muito bem-vindas! Este é um projeto open source feito para a comunidade.

Como Contribuir

1. Fork o repositório
2. Crie uma branch para sua feature ```bash git checkout -b feature/minha-feature ```
3. Commit suas mudanças seguindo Conventional Commits ```bash git commit -m "feat: adiciona nova funcionalidade" ```
4. Push para sua branch ```bash git push origin feature/minha-feature ```
5. Abra um Pull Request

Tipos de Commit

Tipo	Descrição
`feat`	Nova funcionalidade
`fix`	Correção de bug
`docs`	Documentação
`style`	Formatação (sem mudança de lógica)
`refactor`	Refatoração de código
`perf`	Melhoria de performance
`test`	Adição/correção de testes
`chore`	Tarefas de manutenção

💡 Ideias para Contribuir

• 🐛 Reportar bugs encontrados
• 💡 Sugerir novas funcionalidades
• 📝 Melhorar documentação
• ♿ Aprimorar acessibilidade
• 🌍 Adicionar internacionalização
• 🎓 Adaptar para outras universidades

---

🗺️ Roadmap

• PWA - Modo offline e instalação
• Notificações - Alertas de horários favoritos
• Geolocalização - Parada mais próxima do usuário
• API Pública - Endpoints para desenvolvedores
• Calendário Acadêmico - Integração automática de férias
• Outros Campi - Expansão para unidades fora do Pampulha

---

📄 Licença

Distribuído sob a licença MIT. Veja LICENSE para mais informações.

---

💙 Desenvolvido com carinho por Igor Martins

---

⭐ Se este projeto foi útil, considere dar uma estrela!