GitHub Actions 可視化工具
使用 Mermaid.js 可視化 GitHub Actions 工作流 YAML。解析作業間的依賴關係 (needs) 並以流程圖形式顯示。
GitHub Actions 視覺化工具
視覺化 GitHub Actions workflow 的 jobs、dependencies 與 needs 關係。適合理解複雜 CI/CD pipeline，並找出瓶頸或錯誤依賴。
常見用途
- 檢查 CI/CD 流程：了解 job 執行順序。
- 除錯依賴關係：確認
needs是否符合預期。 - 文件化 pipeline：用更清楚的視圖分享 workflow 結構。
修改重要 workflow 時，也請檢查 permissions、secrets 與 triggers。
這個工具的相關文章
GitHub Actions 工作流可視化：精確理解複雜的流水線
用 Mermaid.js 將數百行 YAML 視覺化，理解 job 之間的依賴關係（needs）。涵蓋 needs 的字串／陣列寫法、扇出／扇入／matrix 模式，以及如何找出循環依賴。
GitHub Actions needs 設計模式集｜加速 CI 的依賴關係組織法與反模式
以模式與反模式對照表整理 GitHub Actions 中 needs 所建立的 job 依賴關係。涵蓋 concurrency 取消重複執行、fail-fast 取捨、matrix 與 needs 組合的陷阱，以及可重複使用工作流程，並附上可直接複製的 YAML 範例。
Recent Articles
從資料表設計自動產生 CREATE TABLE 語句的原理｜DDL 產生器
解析 DDL 產生器的實作：以視覺化方式設計資料表並產生 CREATE TABLE 語句與 ER 圖。內容涵蓋 MySQL/PostgreSQL/SQLite 的型別轉換規則，以及從 JSON 範例推論欄位的演算法。
GitHub Actions needs 設計模式集｜加速 CI 的依賴關係組織法與反模式
以模式與反模式對照表整理 GitHub Actions 中 needs 所建立的 job 依賴關係。涵蓋 concurrency 取消重複執行、fail-fast 取捨、matrix 與 needs 組合的陷阱，以及可重複使用工作流程，並附上可直接複製的 YAML 範例。
Mermaid ER 圖語法完全參考｜關聯符號與實戰範例
完整整理 Mermaid erDiagram 語法：烏鴉腳表示法的基數對照表、一對多與多對多的差異、含 PK/FK 的屬性定義，以及一個完整的電商範例。
如何用 SQL 建構器以視覺化方式組出 SELECT、JOIN 查詢
說明如何在瀏覽器中用視覺化 SQL 建構器組合 SELECT、WHERE、JOIN。涵蓋數值自動加引號的判斷原理、JOIN 使用時機對照表，以及多資料表 JOIN 的寫法。
SQL JOIN 完全參考｜INNER、LEFT、RIGHT、FULL 的差異與結果列數觀念
以對照表與結果列數範例，完整整理 SQL 的 JOIN 種類（INNER/LEFT/RIGHT/FULL/CROSS/SELF）。說明一對多 JOIN 為何會使列數增加、WHERE 子句與 ON 子句在 NULL 判斷上的陷阱，以及多資料表 JOIN 的寫法。
Case Converter ― camelCase、snake_case、kebab-case 等 9 種命名規則一次轉換
說明如何將識別字或變數名稱同時轉換成 camelCase、PascalCase、snake_case、CONSTANT_CASE、kebab-case 等 9 種命名規則。涵蓋連續大寫字母（HTTPServer）與數字的處理方式，以及多行批次轉換。