アポロは、反応とケティングで休息APIのためにフックを好みます

少し前にKetting 6 . これは、どのようにより良いか、特に反応します.
これは、ローカル州管理、新しいキャッシュ戦略などの新機能を備えています(クライアント側)ミドルウェアのサポートと変更のイベント.また、これはすべての作業を行うにはいくつかの大きなBCのブレークがある最初のリリースです.
ケティング6をリリースすることは私のための大きい個人的なマイルストーンです、そして、私は本当にそれを世界に放り投げて、人々が何をするかについて見ることに興奮しています.最後の数ヶ月でベータテストしたすべての人々に感謝します!

何が起こってるの?
要するに、kettingはJavaScriptのための一般的なRESTクライアントです.あなたはHTTPを介してJSONオブジェクトをプッシュするためにそれを使用することができますが、豊かなAPIは、ベストプラクティスと標準的な形式で、より多くのそれが自動的にあなたのために行うことができます.
これはHAL、サイレン、コレクション+ JSON、JSONのようなハイパーメディア形式のサポート:APIとも理解し、HTMLからのリンクに従うことができます.
REST(Hypermedia API)は良いジェネリッククライアントが不足しているとよく言われます.Graphqlは多くの利点がありますが、主要なものはツールです.ケティングは、そのギャップを閉じることを目指します.
詳しい情報はGithub .

ケティング6の反応サポート
ケティングは別react-ketting ケティングに反応結合を提供するパッケージ.これらのバインディングは、使用している場合に非常に身近に見えるはずですApollo Client 過去に.
例に飛び込みましょう
あなたは'記事'エンドポイントを持っている残りのAPIを持っていると仮定します.これは以下のようになります.

{
  "title": "Hello world",
  "body": "..."
}

この記事はGET , とPUT , 以下のように表示します:

import { useResource } from 'react-ketting';


export function Article() {

  const { loading, error, data } = useResource('https://api.example/article/5');

  if (loading) {
    return <div>Loading...</div>;
  }

  if (error) {
    return <div class="error">{error.message}</div>;
  }

  return <article>
    <h1>{data.title}</h1>
    <p>{data.body}</p>
  </article>;

}

しかし、突然変異についてはどうですか?Graphqlとは異なり、残りのAPIの突然変異はしばしば同じ形式を持っていますGET and PUT , それで、サーバーに更新されたリソースを送ることは、単にあなたの「データ」を変異して、それを送り返すことを意味します.
次の例では、ユーザーが記事を編集して送信することができます.

import { useResource } from 'react-ketting';


export function Article() {

  const { loading, error, data, setData, submit } = 
    useResource('https://api.example/article/5');

  if (loading) {
    return <div>Loading...</div>;
  }

  if (error) {
    return <div class="error">{error.message}</div>;
  }

  const changeTitle = (title) => {
    data.title = title;
    setData(data);
  };
  const changeBody = (body) => {
    data.body = body;
    setData(data);
  };

  return <form onsubmit={() => submit}>
    <input type="text" value={data.title} onChange={ev => changeTitle(ev.target.value)  />
    <textarea onChange={ev => changeBody(ev.target.value)}>{data.body}</textarea>
    <button type="submit">Save!</button>
  </form>;

}

いつでもsetData が呼び出されると、内部キーキャッシュは新しいリソース状態で更新されます.これはリソースのURIに基づいてグローバルに格納されます.
これは、複数のコンポーネントを使用する場合useResource 同じURIでは、すべてのコンポーネントが更新を参照し、再表示をトリガーします.
これはアポロのローカル状態に似ていますが、これはまだ単一のリソースURIにバインドされていて、最終的には保存できます.
時submit() が呼び出されます.data は再直列化され、PUT リクエスト.

非網羅的リスト

永遠に、短いと決してなどの複数のキャッシュ戦略.

フェッチミドルウェアのサポート.OAuth 2はそのようなプラグインとして再実装されます.これらのプラグインは、グローバルに、または起源ごとに追加することができます.

get() 返り値State オブジェクト、およびput() を引数として指定する必要があります.

put() 現在自動的に状態キャッシュを更新します.

ヘッドリクエストのサポートとヘッドレスポンスヘッダーからの次のリンク.

OAuS 2のPKCEサポート.

リンクは突然変異することができますし、サーバーに戻って送信されます.

入れ子になったアイテム/埋め立て.

別々のpost() and postFollow() メソッド.

バイナリ応答とtext/* 応答

実験:サイレンアクション、HALフォーム、HTMLフォームの送信をサポートします.

将来計画
次の2つの作業は次のとおりです.

共通の反応/残りのAPIパターンのためのより多くのフック/コンポーネントのサポート.

フォームとアクションHALフォーム、サイレンとHTMLからの深いサポート.

WebSocketサポートライブサーバー開始状態プッシュ.

より多くの関連

ドキュメントは完全に書き直されました、そして、現在Github Wiki .

変更とbcブレークの完全なリストのためにUpgrading ページ.