Urql

Code example

import { Client, Provider, cacheExchange, fetchExchange, useQuery } from "urql";

const client = new Client({
  url: "https://countries.trevorblades.com/",
  exchanges: [cacheExchange, fetchExchange],
});

export function Example() {
  return (
    <Provider value={client}>
      <Countries />
    </Provider>
  );
}

function Countries() {
  const [result] = useQuery({ query: "{ countries { code name } }" });
  if (result.fetching) return <p>Loading…</p>;
  return <pre>{JSON.stringify(result.data, null, 2)}</pre>;
}

Pros & cons

FAQs