勝利を収めたWebベースのGraphQL IDE：PlaygroundとGraphiQLが力を合わせる理由

GraphiQLの始まり#

GraphiQLへの最初の公開コミットは2014年でした。

Lee Byron、Hyo Jeong、そしてAngel Gomezが最初に公開した際、GraphQLのための最小限の参照IDE開発エコシステムを作成することが目的でした。Greg Hurrellは、codemirror-graphqlモードを強化するために設計されたストリーミングgraphql-language-service-parserを作成しました。

目標は、人々が独自のWebベースまたはデスクトップIDEツールを構築するために必要なユーティリティパッケージを提供することであり、その核心は、人々が言語の学習と適用を開始し、スキーマを探索するための比較的シンプルなツールでした。当時、LSPはまだ一般的に受け入れられた標準ではなく、VSCodeはまだ今日の非常に人気のある開発ツールになる前でした。

昨年、これらの最初のエンジニアは、GraphiQL、codemirror-graphql、そしてgraphql-language-serviceパッケージという3つのリポジトリをGraphQLファウンデーションに引き渡しました。

現在に至るまで、GraphiQLは数十の言語におけるGraphQL実装、そして数百のフレームワークとランタイムで使用されています。HTTP操作からローカルスキーマのクエリ、データサイエンスツール、さらにはIoTプラットフォームのデータ伝送まで、あらゆる用途で使用されています。AWSダッシュボード、GitHub開発者ツール、その他多くの場所でこのライブラリが使用されているのを見るのは光栄です。

Playgroundが登場#

GraphiQLと並んで、多くの人がその兄弟である、魅力的で機能豊富なGraphQL Playgroundに精通しています。GraphiQLに倣い、codemirror-graphqlを使用しています（Insomnia、Altairなどもこの仲間です。！）。これが、これらのツールの直接編集エクスペリエンスに多くの類似点がある理由です。

Playgroundは、まさに私たちが望んでいたものです。それは私たちの言語エコシステムの開発を推進し、ユーザーにGraphiQLよりもカスタマイズ指向のオプションよりも簡単な選択肢を提供しました。それは多くの優れた機能を提供しました - graphql-configサポート、複数のタブ、i18n、そしてHTTPサーバーミドルウェア。

PrismaがPlaygroundをGraphQLファウンデーションに寄贈#

多くの人がうまく推測したように、**PrismaはPlaygroundをGraphQLファウンデーションに寄贈しています。** 2019年に入ると、Prismaは最終的にPlayground 2.0を構想していましたが、モジュール化されたGraphiQL 2プロジェクトの登場により、大きな相乗効果の機会が生まれ、Prismaが開発者向けのモジュール化されたデータベースツールへと軸足を移したことで、さらに自然なものとなりました。

Playground 1.xは、数十人の貢献者によるコミュニティの努力でした。Prismaは、途中で協力してくれたすべての貢献者に感謝します。Prismaは、GraphQL言語の将来をサポートすることに深くコミットし続けています。たとえば、Prisma Labsチームは、GraphQL APIレイヤーに焦点を当て続け、最近発表したように、Nexusをスキーマ構築ライブラリから完全なGraphQL APIフレームワークへと移行しました。

お気に入りのPlayground機能#

同等性を維持するために、コアに導入するか、Playgroundプリセットに同梱されるプラグインを提供するかによって、多くの同じ機能を維持します。

• 複数のタブ（GraphiQLコア）
• 操作タブごとのヘッダータブ（プラグイン）
• トレースタブ（プラグイン）
• Playgroundドキュメントエクスプローラー（プラグイン）
• 国際化（GraphiQLコア）
• Prismaが多くの他のプロジェクトを委託しているGuild Devの素晴らしい同僚のおかげで、新しい機能を備えたgraphql-configサポート。
• 使いやすいミドルウェア

新機能#

これらの新機能は新しいgraphql@2.0.0で提供されます。

• VSCodeスタイルのコマンドパレット（monaco-editor経由）
• フラグメントまたはその他の型定義へのジャンプ
• プロジェクトのソースファイルから一連の操作を生成
• よりカスタマイズ可能なネットワークオプション - プロジェクトごとのデフォルトヘッダーと操作ごとのヘッダー
• カスタム認証フローの統合のためのヘルパー
• 広範なテーマ、レイアウト、コンポーネントのカスタマイズ機能（Playgroundテーマプリセットから始めて作業できます）!)
• カスタムタブとパネル
• オリジナルの制作者であるOneGraphの同僚とのパートナーシップによる、一流のgraphiql-explorerプラグイン

どのように再実装されますか？#

Playground 2.0は、カスタムテーマとカスタムPlaygroundドキュメントエクスプローラープラグイン（@ortaや他のユーザーが提案した新しいドキュメントエクスプローラーの代替として）、HTTPヘッダーとトレースタブプラグインを含むGraphiQLプリセットになります。GraphiQLプラグインAPIメタ問題、またはGraphiQLモノレポ内のその他のPlayground関連の議論の問題で、より技術的な詳細、進行中の議論、作業項目を見つけることができます。

Playgroundチームの基本的な目標はPlayground 1.0との相対的な同等性になりますが、チームは、既存のGraphQL Playgroundエクスペリエンスに基づいて構築される新しい機能とプラグインの提案を受け入れます。機能の概要プロジェクトは、Playgroundのプリセットで使用できるプラグインについてすでに計画している内容を確認するのに最適な場所であり、探しているものが見つからない場合は提案を作成することもできます。

graphql-playgroundリポジトリの次のステップ#

既存のgraphql-playgroundリポジトリは、アーカイブされる前に1つか2つのメンテナンス/バグ修正リリースを受け取ります。もちろん、フォークすることもできます。この移行の詳細については、作成したgraphql-playgroundの問題を参照してください。

貢献者募集#

また、Playgroundプリセットの開発、サポート、保守を行うチームを形成するための貢献者も募集しています。目標は、プラグインAPIの取り組みの反復と安定化、ならびにPlaygroundプリセットおよび関連プラグインへの貢献と保守に取り組むことです。ご関心のある方は、貢献者募集のGitHubの問題にコメントを残してください。

また、プラグインAPI提案に関する議論の問題で更新情報を確認し、Playgroundイニシアチブのために作成したDiscordチャンネルに参加することもできます。