ギャラリー
アプリケーション領域ごとに整理した .gg 図の集成です。どの例も ライブレンダリング — 以下の gg-diagram フェンスブロックは ビルド時にパース・解決・描画されます。
目的は「範囲の広さ」を示すこと。Gridgram の DSL は当初想定された 「クラウドアーキテクチャの箱と矢印」の用途をはるかに超えて機能 します。ここに集めた例は全体として、リージョン・ノート・バッジ・ 破線・テーマ上書き・中継点・sizeScale・labelScale など、あらゆる 機能を行使します。カテゴリを通読すれば機能ツアーにもなります。
領域
技術 & エンジニアリング
- インフラ — クラウドトポロジ、ゾーン、フェイルオーバー
- マイクロサービス — サービスメッシュ、API ゲートウェイ、サーガ
- ソフトウェアアーキテクチャ — レイヤー、ヘキサゴナル、プラグイン
- データベース — レプリカ、シャード、CDC、キャッシュ
- API 設計 — リクエストライフサイクル、バージョニング、ミドルウェア
- イベント駆動 — pub/sub、イベントソーシング、CQRS
- CI / CD — ビルドパイプライン、マルチ環境、機能プレビュー
- テスト — テストピラミッド、マトリクス、環境
- リリース & ロードマップ — ロールアウト、廃止、トレイン
- セキュリティ & 認証 — OAuth2、mTLS、ゼロトラスト
- AI / ML — 学習、RAG、エージェントトポロジ、サービング
- データパイプライン — ETL、ストリーミング、ラムダ、ウェアハウス
- IoT / ハードウェア — センサ、ゲートウェイ、エッジ推論
ビジネス & 人
- 業務ワークフロー — 承認、請求、チケット
- カスタマージャーニー — AARRR、オンボーディング、サポート
- 組織図 — レポーティング、マトリクス、スクワッド
- プロジェクト計画 — 依存関係、スプリント、マイルストーン
- セールスファネル — 海賊指標、B2B ステージ、セグメンテーション
オペレーション & 物流
知識 & コミュニケーション
ギャラリーの描画方法
各ページは gg-diagram フェンス付きコードブロックを使用します。 docs/.vitepress/plugins/gg-diagram.ts プラグインがビルド時に すべてのフェンスをパースして得られた SVG をインライン化するので、 ギャラリーは生の .gg テキストをブラウザに送らず — 描画済みの 図が直接表示されます。
このモードで使えるのは Tabler 組み込みとインライン生 SVG のみで、 @alias/ パス・URL・ファイル参照はスキップされます(markdown-it から await できない非同期ローダが必要になるため)。これらを 独自ページで使いたい場合は examples/<name>/ エントリを追加し、 <Example> コンポーネントを利用してください。