Generador de badges vectoriales (SVG) dinámicos de nivel Pro, ultra-rápidos (< 5ms), 100% compatibles con GitHub Camo Proxy y optimizados para despliegue en Vercel.
- ⚡ Rendimiento Extremo (< 5ms): Motor de renderizado SVG nativo en TypeScript sin dependencias pesadas de Canvas ni navegadores headless. Cero tiempo de arranque en frío.
- 🛡️ 100% Compatible con GitHub Camo: Cabeceras HTTP estrictas (
Cache-Control: no-cache, no-store, must-revalidate,Surrogate-Control: no-store) para evitar que las visitas y métricas se queden congeladas en la caché de GitHub. - 🎨 Estética Pro Split: Bordes sutiles de 1px, profundidad de texto con doble capa, radios de esquina ajustados y gradientes fluidos.
- 🌐 Simple Icons Integrado: Soporte para más de 3,000 marcas y herramientas de desarrollo (Docker, Deno, GitHub, Lefthook, TypeScript, React, Python, etc.).
- 👁️ Contador de Visitas en Vivo: Endpoint
/api/badge/views?id=...con incremento atómico y compatibilidad opcional con Upstash Redis o Vercel KV. - 📊 Conectores Dinámicos Oficiales:
- Métricas de repositorios de GitHub (estrellas, forks, última release, licencia, tamaño).
- Versión en vivo de paquetes de NPM.
- Extractor de APIs JSON personalizadas con notación por punto.
- 🛠️ Interactive Web Studio: Interfaz web moderna (Next.js 16 + Tailwind CSS v4) para diseñar, previsualizar y copiar Markdown con 1 clic.
git clone https://github.com/glastor-dev/apex-badges.git
cd apex-badges
npm installnpm run devAbre http://localhost:3000 para ver el Web Studio interactivo.
npm run build
npm run startPuedes correr el servidor HTTP ultraligero sin sobrecarga de Next.js en el puerto 3001:
# Con Bun
npm run serve:bun # o bun server.ts
# Con Deno
npm run serve:deno # o deno task serveGenera badges SVG directamente en disco durante pipelines de GitHub Actions:
bun cli.ts --label Docker --status ready --color 007ec6 --logo docker --out ./badges/docker.svgnpm test # Ejecuta 21 pruebas en < 400 ms con Bun
npm run test:coverage # Reporte de cobertura detallado
npm run test:deno # Validación cruzada en motor Deno 2.x
npm run test:ci # Pipeline integral (Tests + Linter + Build)GET /api/badge?label=Docker&status=ready&color=007ec6&logo=docker&style=proParámetros:
label: Texto del lado izquierdo (ej.Docker,Deno,Code License).status: Texto del lado derecho (ej.ready,^1.40.0,GPLv3).color: Color de fondo del status (nombre predefinido comodocker,passing,blue,green, o HEX como007ec6).labelColor: Color de fondo del lado izquierdo (por defecto#1f2328).logo: Nombre del icono (ej.docker,deno,lefthook,github,visitas,license,react,python).style:pro(predeterminado),flat,pill,glass,cyber,gradient.height: Altura en píxeles (20o24).
GET /api/badge/views?id=mi-repositorio&label=Visitas&color=8a2be2&logo=visitasNota de GitHub Camo: Este endpoint responde con cabeceras
Surrogate-Control: no-storepara garantizar que cada recarga del README incremente el contador.
GET /api/badge/github/:owner/:repo/:metricMétricas soportadas:
release: Último tag de release publicado.stars: Cantidad de estrellas (ej.1.4k).forks: Cantidad de forks.issues: Cantidad de issues abiertos.license: Licencia del repositorio (identificador SPDX).size: Tamaño del repositorio.language: Lenguaje principal.
GET /api/badge/npm/:packageEjemplo: /api/badge/npm/next o paquetes con scope /api/badge/npm/@types/node.
GET /api/badge/dynamic?url=https://api.ejemplo.com/status&query=version&label=API&color=blueCrea un archivo .env.local para activar funciones persistentes avanzadas:
# Upstash Redis (Para persistir contador de visitas globalmente)
UPSTASH_REDIS_REST_URL="https://tu-instancia.upstash.io"
UPSTASH_REDIS_REST_TOKEN="tu-token"
# GitHub Token (Para evitar rate-limiting en repositorios públicos)
GITHUB_TOKEN="ghp_xxxxxxxxxxxxxxxxxxxx"- Sube tu código a GitHub.
- Importa el repositorio en Vercel.
- Vercel detectará automáticamente Next.js.
- Haz clic en Deploy. ¡Listo en menos de 1 minuto!
Este proyecto está bajo el modelo de Licencia Dual (GPLv3 & CC BY 4.0).