Saltar al contenido
Visualización CI/CD

Visualizador de GitHub Actions

Visualiza el YAML de flujos de trabajo de GitHub Actions con Mermaid.js. Analiza las dependencias entre trabajos (needs) y las muestra como un diagrama de flujo.

Guía: Cómo usarlo y características

  • Pega tu YAML de GitHub Actions en el cuadro "Introduce el YAML del flujo de trabajo".
  • Haz clic en el botón "Visualizar" para renderizar el diagrama a la derecha.
  • Las dependencias entre trabajos (needs) se dibujan como flechas (-->).
  • Haz clic en "Copiar código Mermaid" para obtener el código y usarlo en el Markdown de GitHub u otras herramientas compatibles con Mermaid.

Ejemplos: Ejemplos de entrada y salida

Dependencias básicas entre trabajos

Entrada

jobs:
  build:
    runs-on: ubuntu-latest
  test:
    needs: build
    runs-on: ubuntu-latest
  deploy:
    needs: test
    runs-on: ubuntu-latest

Salida

graph TD
  build
  test
  build --> test
  deploy
  test --> deploy

FAQ: Preguntas frecuentes

  • ¿Puede visualizar flujos de trabajo grandes?

    Sí, pero para flujos con muchísimos trabajos (decenas o más), el diagrama puede ser enorme y difícil de leer. En esos casos, considera visualizar partes lógicas más pequeñas.
  • ¿Admite dependencias que no sean "needs"?

    Actualmente, la herramienta solo visualiza dependencias a nivel de trabajo definidas por la propiedad "needs". No se visualizan los pasos individuales dentro de los trabajos.
  • ¿Son seguros mis datos YAML?

    Totalmente. Todo el procesamiento ocurre localmente en tu navegador. No se envían datos a nuestros servidores, por lo que es seguro para configuraciones privadas o empresariales.

Casos de uso: Usos habituales

  • Entender las dependencias del flujo de trabajo

    Visualiza las conexiones entre trabajos a través de `needs` para comprender intuitivamente el orden de ejecución y los posibles cuellos de botella.

  • Apoyo en la revisión de Pull Requests (PR)

    Visualiza el YAML modificado y comparte el diagrama para ayudar a los revisores a captar rápidamente los cambios en la configuración de los trabajos.

  • Optimización de la documentación

    Genera código Mermaid para insertarlo en READMEs o Wikis de GitHub, manteniendo tus diagramas de flujo de trabajo actualizados sin esfuerzo.

graph TD A[Start] --> B[Input YAML] B --> C[Visualize]

Visualizador de GitHub Actions

Visualiza workflows de GitHub Actions para entender jobs, dependencias y relaciones needs. Ayuda a revisar pipelines complejos y detectar cuellos de botella o dependencias incorrectas.

Usos comunes

  • Revisar CI/CD: entiende el orden de ejecución de jobs.
  • Depurar dependencias: comprueba si needs refleja el flujo esperado.
  • Documentar pipelines: comparte una vista más clara del workflow.

Antes de modificar un workflow crítico, revisa también permisos, secrets y triggers.

Artículos para esta herramienta

Artículos recientes

Caso de uso
2026-08-07

Opciones de curl: qué hacen realmente -X, -H y -d

Referencia de las opciones de curl que aparecen en el trabajo diario con APIs: por qué -d ya implica POST, en qué se diferencia de --data-raw, la @ inicial que lee un archivo sin avisar, comillas simples frente a dobles, y por qué -k y -L merecen más cuidado del habitual.

Introducción
2026-08-06

Convertir entre JSON Schema y Zod: cómo se corresponden required y .optional()

Por dentro de un conversor bidireccional que transforma JSON Schema en un esquema de Zod y el código Zod de vuelta a JSON Schema. Incluye los valores por defecto invertidos entre required y .optional(), la tabla de correspondencia de restricciones y cómo se analiza Zod sin ejecutar código.

Caso de uso
2026-08-06

Orden de evaluación en SQL: por qué WHERE no ve el alias del SELECT

El orden en que escribe las cláusulas de SQL no es el orden en que se ejecutan. Referencia del orden lógico (FROM → WHERE → GROUP BY → HAVING → SELECT → ORDER BY → LIMIT), por qué fallan los alias en WHERE, cuándo usar WHERE y cuándo HAVING, ONLY_FULL_GROUP_BY y la trampa de LEFT JOIN con WHERE.

Caso de uso
2026-08-06

Formato unified diff: cómo leer las cabeceras @@ de git diff

Cómo leer el formato unified diff que genera git: qué significan los cuatro números de @@ -12,7 +12,9 @@, por qué un cambio de un solo carácter aparece como línea completa reemplazada, las trampas de los espacios y los finales de línea, \ No newline at end of file, los diffs combinados @@@ en los merges y la detección de renombrados.

Caso de uso
2026-08-06

Conversión UTC⇄JST: tabla del desfase de 9 horas y errores de zona horaria

Convierta entre UTC y la hora de Japón (JST) con una tabla de referencia, y vea por qué la diferencia con España cambia entre 7 y 8 horas según el horario de verano. Incluye el significado de Z y +09:00 en ISO 8601, cuándo JavaScript desplaza las fechas, el comportamiento de MySQL/PostgreSQL y por qué el cron de GitHub Actions siempre corre en UTC.

Caso de uso
2026-08-04

Referencia de CREATE TABLE: tipos y restricciones en MySQL, PostgreSQL y SQLite

Referencia de CREATE TABLE (DDL) con tablas comparativas entre bases de datos: tipos de datos, autoincremento (AUTO_INCREMENT / IDENTITY / rowid), comportamiento de ON DELETE en claves foráneas y la restricción CHECK que MySQL ignora en silencio.

Anuncio

Anuncio