React Native
Relay (GraphQL)
React NativeでのGraphQLスキーマダウンロード方法
7 分
graphqlスキーマのダウンロード はじめに 前回のガイドでは、素晴らしいgraphqlクライアントであるrelayについて詳しく学びました。今度は、relayを使用してback4appからデータを取得し、react nativeアプリで使用する方法を理解する時です。このガイドでは、graphqlスキーマファイルをダウンロードし、react nativeプロジェクトに配置する方法を学びます。 目標 スキーマをダウンロードすることで、react nativeプロジェクトをback4app graphql apiを使用するために準備します。 前提条件 これはまだチュートリアルではありませんが、快適に読むためには次のものが必要です: 基本的なjavascriptの知識。 graphqlについての基本的な理解。もし持っていない場合は、 graphql js が始めるのに最適な場所です。 ローカル環境で動作している基本的なreact nativeプロジェクト。 1 スキーマのダウンロード スキーマは、フロントエンドに配置されるサーバーからの真実の源です。back4appでは、スキーマはデータモデルを定義すると自動的に生成されるファイルです。back4appのgraphqlスキーマをよりよく理解するために、以下の手順でgraphqlコンソールで開くことができます アプリのback4appダッシュボードに移動します; 左側のメニューで、coreタブの下にあるapiコンソールをクリックします; graphqlを選択すると、次のような画面が表示されます graphqlプレイグラウンドへようこそ。ここでは、sdl言語を使用してクエリやミューテーションを書くことができます。 右上の部分に2つのタブがあります docsとschema。docsタブでは、graphql apiの読みやすいドキュメントが見つかります。このドキュメントは、back4appでデータモデルを構築すると生成されるオブジェクトタイプに基づいています。開発者にとってこれは素晴らしいことで、クエリやミューテーションを構築するためのクイックリファレンスとして使用できます。 back4appは、graphql apiの仕様も生成します よく知られているスキーマです。スキーマはschemaタブにあり、sdl(スキーマ定義言語)を使用して記述されています。このスキーマは、フロントエンドの真実のソースとして使用されます。 さあ、sdlのダウンロードをクリックして、次のステップで使用するファイルを取得してください。 2 スキーマをreact nativeアプリに貼り付ける relayがreact nativeアプリでスキーマファイルを読み取るためには、特定のパスにスキーマファイルを貼り付ける必要があります。あなたのreact nativeプロジェクトでこれを行いましょう アプリケーションのルートパスにフォルダーを作成し、名前を data data にします。 このフォルダーにスキーマファイル(sdl)を貼り付けます。 完了です。あなたのフロントエンドは、graphqlスキーマを使用してバックエンドからの真実のソースを既に持っています。最終的な設定は以下に示されています。 重要 back4appでデータモデルを変更するたびに、スキーマファイルも変更されます。フロントエンドでスキーマファイルを常に最新の状態に保つことが非常に重要ですので、スキーマを変更するたびに、react nativeアプリプロジェクトに再度アップロードする必要があります。 結論 スキーマがすでにreact nativeアプリに配置されているので、次にコンポーネントのクエリを取得できるように環境を設定し、準備する方法を学びます。