Actualizar README para proyecto Infra (Python/Flask)
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -1,112 +1,83 @@
|
||||
# 📊 Dashboard LABS — JIRA Story Points
|
||||
# 📊 Dashboard Infra — Tickets
|
||||
|
||||
Un dashboard en tiempo real para visualizar métricas, progreso de Story Points (SP), y la velocidad del equipo utilizando datos extraídos directamente de la API de Jira.
|
||||
|
||||
Este proyecto está diseñado con un frontend ligero sin frameworks pesados y un backend *Serverless* preparado para ser desplegado en plataformas como Vercel o funcionar de manera local.
|
||||
Dashboard en tiempo real para visualizar la carga de trabajo y métricas del equipo de Infraestructura, usando datos extraídos directamente de la API de Jira.
|
||||
|
||||
---
|
||||
|
||||
## 🏗️ Stack Tecnológico
|
||||
|
||||
- **Frontend:** HTML5 + Vanilla TypeScript/JavaScript + [Chart.js (v4.4.1)](https://www.chartjs.org/)
|
||||
- **Backend:** Node.js Serverless Function
|
||||
- **Frontend:** HTML5 + Vanilla JavaScript + [Chart.js (v4.4.1)](https://www.chartjs.org/)
|
||||
- **Backend:** Python + Flask
|
||||
- **API:** Integración directa con Jira REST API v3
|
||||
- **Autenticación:** Basic Auth mediante Email y API Token de Jira
|
||||
- **Caching:** Caché en memoria (24hs) + CDN-level Cache con "stale-while-revalidate"
|
||||
|
||||
## ✨ Características Principales
|
||||
|
||||
1. **Estado Actual del Equipo:**
|
||||
- Visualización de KPIS clave: SP en Progreso, SP por Hacer, SP Completados y Desarrolladores Activos.
|
||||
- Gráficos detallados del progreso por desarrollador.
|
||||
- Tabla que resume el porcentaje de carga de trabajo de cada uno.
|
||||
|
||||
2. **Histórico por Período:**
|
||||
- Resumen mensual de los Story Points completados.
|
||||
- Velocidad histórica del equipo a lo largo del tiempo.
|
||||
- Gráfico de top Épicas y distribución de SP.
|
||||
|
||||
3. **Performance Optimizado:**
|
||||
- Consulta eficiente con parámetros JQL directos.
|
||||
- Sistema de caché dual (Node memory + Vercel Edge) para evitar excesos de *Rate Limiting* en Jira y cargar instantáneamente.
|
||||
|
||||
---
|
||||
|
||||
## 🚀 Instalación y Configuración Local
|
||||
|
||||
### 1. Clonar el repositorio
|
||||
Cloná este repositorio y accedé a la carpeta del proyecto:
|
||||
|
||||
```bash
|
||||
git clone https://github.com/kvilches1410/dashlabs.git
|
||||
cd dashlabs
|
||||
git clone https://git.beldo.duckdns.org/jpbeldomenico/dashboard-infra.git
|
||||
cd dashboard-infra
|
||||
```
|
||||
|
||||
### 2. Instalar el CLI de Vercel
|
||||
Para correr las funciones *serverless* del backend (`api/data.js` de Vercel) localmente, necesitas instalar Vercel CLI de forma global:
|
||||
### 2. Instalar dependencias Python
|
||||
|
||||
```bash
|
||||
npm install -g vercel
|
||||
pip install -r requirements.txt
|
||||
```
|
||||
|
||||
### 3. Configurar Variables de Entorno
|
||||
Copiá el archivo de entorno de ejemplo como `.env` en la raíz del proyecto.
|
||||
|
||||
Copiá el archivo de ejemplo y completá con tus credenciales:
|
||||
|
||||
```bash
|
||||
cp ex.env .env
|
||||
```
|
||||
Luego, editá el `.env` e ingresá tus credenciales de Jira:
|
||||
|
||||
Editá el `.env`:
|
||||
|
||||
```env
|
||||
# Ejemplo de .env
|
||||
JIRA_EMAIL=tu-email@tudominio.com
|
||||
JIRA_HOST=invera.atlassian.net
|
||||
JIRA_EMAIL=tu-email@dominio.com
|
||||
JIRA_TOKEN=tu-jira-api-token
|
||||
JIRA_PROJECT=IO
|
||||
USE_TICKET_COUNT=true
|
||||
```
|
||||
> **Nota:** Podés generar un API Token de Jira en tu la configuración de seguridad de tu cuenta de Atlassian.
|
||||
|
||||
### 4. Entorno de Desarrollo
|
||||
Para levantar el proyecto y la API simulando el entorno de Vercel, ejecutá:
|
||||
> Podés generar un API Token en: https://id.atlassian.com/manage-profile/security/api-tokens
|
||||
|
||||
### 4. Levantar el servidor
|
||||
|
||||
```bash
|
||||
vercel dev
|
||||
python server.py
|
||||
```
|
||||
Luego, abrí `http://localhost:3000` en tu navegador.
|
||||
|
||||
---
|
||||
|
||||
## 🔧 Configuración del Modelo de Datos de JIRA
|
||||
|
||||
Los campos personalizados (Custom Fields) varían según cada entorno de Jira. Actualmente, el mapeo de campos está de la siguiente manera:
|
||||
|
||||
| Campo / Tipo | Código (Custom Field) | Descripción |
|
||||
| :--- | :--- | :--- |
|
||||
| **Story Points Estimate** | `customfield_10016` | La estimación de SP original del ticket |
|
||||
| **Story Points Finales** | `customfield_11217` | SP finales acordados (Suele tener prioridad) |
|
||||
| **Desarrollador** | `customfield_10628` | Campo Multi-usuario para asignación de tareas |
|
||||
Abrí el navegador en: `http://localhost:8888`
|
||||
|
||||
---
|
||||
|
||||
## 📁 Estructura del Proyecto
|
||||
|
||||
```text
|
||||
dashlabs/
|
||||
├── index.html # Frontend central. Contiene todo el layout, CSS y JS con Chart.js
|
||||
├── package.json # Dependencias y scripts
|
||||
├── vercel.json # Configuración para despliegue en Vercel
|
||||
├── .gitignore
|
||||
├── ex.env # Variables de entorno de ejemplo (TEMPLATE)
|
||||
└── api/
|
||||
├── config.js # [Opcional] Configuración modular para el Request de JIRA
|
||||
└── data.js # Vercel Serverless Function: Maneja el fetch, transformación de datos y caché
|
||||
dashboard-infra/
|
||||
├── index.html # Frontend: layout y gráficos
|
||||
├── js/
|
||||
│ └── app.js # Lógica del dashboard (Chart.js, KPIs, filtros)
|
||||
├── css/
|
||||
│ └── styles.css # Estilos
|
||||
├── server.py # Backend Flask: fetch de Jira y endpoint /api/data
|
||||
├── requirements.txt # Dependencias Python
|
||||
├── ex.env # Ejemplo de variables de entorno
|
||||
└── .gitignore
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 🌐 Despliegue en Producción (Vercel)
|
||||
## 📊 Métricas disponibles
|
||||
|
||||
El proyecto está diseñado para funcionar nativamente dentro de [Vercel](https://vercel.com/).
|
||||
|
||||
1. Conectá el repositorio en el panel de Vercel.
|
||||
2. Agregá en Vercel **Environment Variables**:
|
||||
- `JIRA_EMAIL`
|
||||
- `JIRA_TOKEN`
|
||||
3. Dale a **Deploy**.
|
||||
|
||||
La carpeta `/api` será parseada de manera automática y transformada en endpoints `/api/data` para que el `index.html` los consuma.
|
||||
|
||||
---
|
||||
- **Carga de trabajo actual:** tickets En Progreso y Por Hacer por desarrollador
|
||||
- **Alertas de salud:** tickets estancados, vencidos, sin asignar
|
||||
- **Resultados del período:** tickets completados, promedio semanal, solicitudes por semana
|
||||
- Filtro por desarrollador y por rango de tiempo (hoy, 7d, 30d, 90d, 1 año, histórico)
|
||||
|
||||
Reference in New Issue
Block a user