メインコンテンツへスキップ

​
Monaco エディタ

クエリエディタは Monaco（VS Code と同じエンジン）を基盤にし、GraphQL 用の language worker により次を提供します。
  • GraphQL のオペレーション、フィールド、引数、ディレクティブ向けの シンタックスハイライト
  • スキーマ連動のオートコンプリート — Ctrl+Space で、ライブスキーマに基づく利用可能なフィールド・引数・型を表示
  • リアルタイムのエラー検出 — 無効なフィールド名、不足引数、型の不一致に対する赤い下線とエラーマーカー
  • 波括弧、括弧、文字列の 括弧対応 と 自動クローズ
  • 一括編集向けの マルチカーソル
オートコンプリートはスキーマを認識します。Cube 内（例: DEXTrades）で入力すると、その Cube で有効なフィールドと引数だけが候補に現れます。

​
エディタのパネル

エディタ領域の下部に 3 つのタブがあります。リクエストの各部分を切り替えて設定します。

​
Query パネル

GraphQL クエリを書くメイン領域です。Monaco のオートコンプリート、ハイライト、エラー検出がここで有効になります。 
query {
  Solana {
    DEXTrades(
      limit: {count: 10}
      orderBy: {descending: Block_Time}
    ) {
      Block { Time }
      Transaction { Hash }
      Trade {
        Buy { Currency { MintAddress } Amount PriceInUSD }
        Sell { Currency { MintAddress } Amount }
        Dex { ProtocolName }
      }
    }
  }
}

​
Variables パネル

パラメータ化されたクエリに JSON variables を渡します。クエリ本文を編集せずに variable の値だけ変えられるため、再利用しやすくなります。 
query LatestTrades($limit: Int!) {
  Solana {
    DEXTrades(
      limit: {count: $limit}
      orderBy: {descending: Block_Time}
    ) {
      Block { Time }
      Trade {
        Buy { Currency { MintAddress } Amount PriceInUSD }
        Sell { Currency { MintAddress } Amount }
      }
    }
  }
}

​
Headers パネル

すべてのリクエストに付与する HTTP ヘッダーを設定します。Headers パネルは デフォルトで表示され、X-API-KEY ヘッダーが事前設定されています。 
{
  "X-API-KEY": "your_api_key"
}
必要に応じて追加のカスタムヘッダーも設定できます。すべてのヘッダーは GraphQL エンドポイントへの POST リクエストの一部として送信されます。
Content-Type: application/json ヘッダーは自動で付与されます — 手動で設定する必要はありません。

​
ツールバー

ツールバーはエディタ上部にあり、よく使う操作にすぐアクセスできます。
ボタン操作説明
Execute (▶)クエリ実行現在のクエリ（variables と headers を含む）を GraphQL エンドポイントに送信
Prettifyクエリ整形インデントと改行を揃えて自動整形
Copyクエリをコピー現在のクエリ本文をクリップボードにコピー
Mergeフラグメントをマージインラインフラグメントを 1 つのフラットなクエリに統合
Save Queryローカル保存タイトルと任意のタグ付きで現在のクエリを保存
Export Codeスニペットをエクスポート選択した言語で現在のクエリのコードスニペットを生成

​
クエリの実行

クエリを実行する手順:
  1. エディタにクエリを書くか読み込む
  2. Headers パネルで X-API-KEY を設定する
  3. ツールバーの Execute (▶) をクリックするか、Ctrl/Cmd+Enter を押す
レスポンスはエディタ右側の Results Panel に表示され、JSON のシンタックスハイライト付きです。クエリにエラーがある場合は、メッセージと位置情報付きのエラーレスポンスが表示されます。

​
Results パネル

結果パネルには GraphQL エンドポイントからの JSON レスポンスが表示されます。
  • JSON のキー、文字列、数値、真偽値の シンタックスハイライト
  • 深くネストしたレスポンスを辿る 折りたたみ可能なノード
  • 右クリックメニューからの レスポンスのコピー
成功時は、クエリ構造に対応する data オブジェクトに加え、課金情報を示す extensions.credits オブジェクトが含まれるのが一般的です。

​
ステータスバー

IDE 下部のステータスバーは、クエリ実行に関するリアルタイムのフィードバックを表示します。
表示値の例説明
StateReady · Executing... · Success · Errorリクエストのライフサイクル状態
Latency例: 120ms送信からレスポンス受信までの往復時間
Size例: 2.4 KBレスポンスボディのサイズ
Credits例: 8 CUこのクエリで消費した Credit Units
Credit Units (CU) はクエリの計算コストを表します。より多くのデータを走査したり、より大きな結果セットを返すクエリほど CU を多く消費します。詳しくは Billing & Credits を参照してください。

​
キーボードショートカット

ショートカット操作
Ctrl/Cmd + Enterクエリ実行
Ctrl/Cmd + Bサイドバーの表示切替
Ctrl + Spaceオートコンプリートを起動
Ctrl/Cmd + Shift + Pコマンドパレット
Ctrl/Cmd + /行コメントの切替
Ctrl/Cmd + D次の一致を選択
Ctrl/Cmd + Shift + F整形 / Prettify
Alt + Up/Down行を上下に移動
macOS では Ctrl の代わりに Cmd を使います。IDE は OS を検出し、適切な修飾キーを表示します。