🌱 VizGit

Visualiza tus contribuciones de GitHub de forma elegante

Demo · Reportar Bug · Solicitar Feature

---

📋 Tabla de Contenidos

• Sobre el Proyecto
• Características
• Demo
• Tecnologías
• Instalación
• Configuración
• Uso
• Scripts Disponibles
• Estructura del Proyecto
• Contribuir
• Licencia
• Contacto

---

🎯 Sobre el Proyecto

VizGit es una aplicación web que transforma tus contribuciones de GitHub en hermosas visualizaciones interactivas. Analiza tu actividad, descubre patrones en tus commits y comparte tus estadísticas con un diseño elegante y personalizable.

¿Por qué VizGit?

• 📊 Visualización Clara: Heatmaps interactivos al estilo GitHub
• 🎨 Personalizable: 5 temas diferentes y opciones de customización
• 📈 Análisis Completo: Estadísticas detalladas de tu actividad
• 💾 Exportación: Descarga tus estadísticas como imagen PNG de alta calidad
• ⚡ Rápido: Construido con Next.js 16 y optimizado para rendimiento
• 🌐 SEO Optimizado: Metadata completa y Open Graph

---

✨ Características

📊 Visualización de Datos

• Heatmap de Contribuciones: Calendario anual con todos tus commits
• Nivel de Actividad: Sistema de gamificación con 6 niveles (Novato → Leyenda)
• Estadísticas Generales: Repos, estrellas, forks, seguidores, PRs, issues
• Lenguajes Más Usados: Top 8 lenguajes con porcentajes y colores
• Análisis Semanal: Gráfico de barras por día de la semana

🎨 Personalización

• 5 Temas Predefinidos: GitHub, Ocean, Sunset, Purple, Dark
• Customizador Avanzado: Ajusta tamaño, espaciado y bordes de los cuadrados
• Responsive Design: Funciona perfectamente en móviles, tablets y desktop
• Animaciones Suaves: Transiciones y efectos visuales agradables

💾 Funcionalidades Extra

• Exportar como Imagen: Descarga tu perfil completo en PNG de alta resolución
• SEO Completo: robots.txt, sitemap.xml, Open Graph, Twitter Cards
• PWA Ready: Manifest configurado para instalación como app
• Structured Data: Schema.org para mejor indexación

---

🚀 Demo

Prueba la aplicación en vivo: vizgit.novtiq.com

Ejemplos:

• Ver perfil de ejemplo
• Torvalds

Screenshots:

📸 Ver capturas de pantalla

Desktop

Mobile

---

🛠️ Tecnologías

Core

• Next.js 16 - Framework React con App Router
• TypeScript - Tipado estático
• Tailwind CSS - Estilos utility-first

APIs y Librerías

• GitHub GraphQL API - Obtención de datos
• html-to-image - Exportación a imagen
• clsx - Utilidades de className

Herramientas de Desarrollo

• ESLint - Linting
• Prettier - Formateo de código
• pnpm - Gestor de paquetes (recomendado)

---

📦 Instalación

Prerrequisitos

• Node.js 18.17 o superior
• pnpm (recomendado), npm o yarn
• Cuenta de GitHub para generar token de API

1. Clonar el repositorio

git clone https://github.com/rody-huancas/vizgit.git
cd vizgit