GraphhQLコープの先端に向かって
3254 ワード
概要
フェイスブックは2012年から
サンプル
フロントエンドの入力フィールドと構造.バックグラウンドは、フロントエンドの要求に従ってデータを返します.
一つの
オペレータ
subscription
文書
文書部分:
ドキュメントを観察します.ドキュメントは種類とフィールドで構成されています.
定義された属性があると考えられます.
特徴は、複数のリソースを取得し、要求は一つだけである. フロントエンド制御:クライアントが指定したクエリであり、エンドは受動からアクティブになり、何を取るべきかを決める. 階層構造:操作粒度はフィールドレベルで、読み取り可能性が高く、クエリの構造と結果は非常に似ています. 開発友好:強いタイプのおかげで、 は、前後の通信コストを低減する. は、システムの発展に伴って、 複雑なクライアントであれば、一つのページはしばしば複数のインターフェースを呼び出す必要があり、 コミュニティフレームワーク
フロントエンドのクライアントは主に
資料
文章は、あなたがGraphQLを使うのを妨げる10の問題 です. 30分GraphQLコア概念を理解する RPC vs REST vs GraphQL 文書 graphql公式文書 vue-applo文書 applo文書 githubのgraphサンプルインターフェース
GraphQL
は、「タイプシステム」に基づいてクエリーを実行するクエリ言語である.フェイスブックは2012年から
GraphQL
を使用し、15年にオープンしました.graph
は、サービス端末とクライアントの通信を記述するための標準セットを定義する.grapphに記述された機能は、任意の言語を使用して実現されてもよい.ECMAScript
規格のJavaScript
と同じです.サンプル
フロントエンドの入力フィールドと構造.バックグラウンドは、フロントエンドの要求に従ってデータを返します.
一つの
GraphQL
は、二つの部分からなることを要求する.操作符とドキュメント.オペレータ
GraphQL
は、フロント・バックグラウンド・インタラクションの中間層として、クエリー機能だけではなく、REST
、GET
、POST
、DELETE
などのタイプの要求がある.GraphQL
は、フロントバックグラウンド通信を2つのクラスquery
とmutation
に直接分ける.query
名前の通り、query
はデフォルトのオペレータであり、クエリーを代表して、サービス端末に副作用を与えない要求である.オペレータがいないとデフォルトでquery
です.上の図はquery
オペレータを省略しています.完全な要求は実はこのようです.query {
hero {
name
}
}
mutation
mutation
は一つの動作を表し、サーバーに修正をもたらす.例えば添削します.たとえば:mutation addMessage($input: MessageType!) {
addMessage(input: $input) {
id
text
}
}
結果を返します{
"addMessage": {
"label": " message",
"id": "0RaqSeOL0"
}
}
($input: MessageType!)
に対しては霧がかかっているかもしれません.これはただ伝参の文法を定義して、文書を通して習得できます.subscription
subscription
、購読オペレータはまだ標準に組み入れられていませんが、既にアプリケーションが実装されています.オペレータを購読する機能は、オペレータが操作を傍受するようなものです.VUE
の中のwatch
と同じです.ただwatch
はサービスです.一度ビジネスの最中に私たちが購読している変化が起こったら、サービスの側から積極的に変化を私たちに送ってくれます.自分の業務コードの中でもうポーリングはやめてください.タイマーです.文書
文書部分:
{
hero {
name
height
}
}
ドキュメントは、フロントエンドがバックグラウンドに説明するために必要なフィールドです.先端が一番すっきりしているところです.データ構造がはっきりしています.どのような要求を送りますか?どのようなデータを取りますか?ドキュメントを観察します.ドキュメントは種類とフィールドで構成されています.
GraphQL
は強型言語である.typescript
を使ったら分かりやすいです.定義された属性があると考えられます.
hero
は一つのタイプです.name
およびheight
はフィールドである.特徴
GraphQL
はコード作成時に語句が間違っているかどうかを確認してもいいし、知能提示タイプのフィールドもあります.ドキュメントは自動的に生成され、豊かな体験ができます.REST
と比較する.REST
のインターフェースの持続的な平面成長を維持するために、GraphQL
は、タイプを増やすだけで、よりメンテナンスに有利である.GraphQL
は一回だけ呼び出すことができ、一度にすべてのデータを要求する.REST
によって動作されるリソースは相対的に離散的であり(インターフェースインターフェースインターフェース)、GraphQL
のデータはより全体的である(タイプ構成のため).フロントエンドのクライアントは主に
Apollo
とRelay
があります.彼らの役割はaxios
と同じです.私たちが要求を構成するのに便利です.業務では主にvue
を使っていますので、vue-apploがありますので、私が選んだのはApollo
です.vue-apollo
はstore
階を持っています.データキャッシュが便利です.vuex
も削除できます.資料
vue-cli
を使って簡単な添削の項目を作成しました.ドキュメントに合わせて自分でコードを打つことができます.GraphhQLデモ文章