kitten.sh
1# With Subscriptions via Fetch
2
3<p>
4 <a
5 href="https://stackblitz.com/github/urql-graphql/urql/tree/main/examples/with-subscriptions-via-fetch">
6 <img
7 alt="Open in StackBlitz"
8 src="https://img.shields.io/badge/open_in_stackblitz-1269D3?logo=stackblitz&style=for-the-badge"
9 />
10 </a>
11 <a
12 href="https://codesandbox.io/p/sandbox/github/urql-graphql/urql/tree/main/examples/with-subscriptions-via-fetch">
13 <img
14 alt="Open in CodeSandbox"
15 src="https://img.shields.io/badge/open_in_codesandbox-151515?logo=codesandbox&style=for-the-badge"
16 />
17 </a>
18</p>
19
20This example shows `urql` in use with subscriptions running via a plain `fetch`
21HTTP request to GraphQL Yoga. This uses the [GraphQL Server-Sent
22Events](https://the-guild.dev/blog/graphql-over-sse) protocol, which means that
23the request streams in more results via a single HTTP response.
24
25This example also includes Graphcache ["Cache
26Updates"](https://formidable.com/open-source/urql/docs/graphcache/cache-updates/)
27to update a list with incoming items from the subscriptions.
28
29To run this example install dependencies and run the `start` script:
30
31```sh
32yarn install
33yarn run start
34# or
35npm install
36npm run start
37```
38
39This example contains:
40
41- The `urql` bindings and a React app with a client set up in [`src/App.jsx`](src/App.jsx)
42- A local `graphql-yoga` server set up to test subscriptions in [`server/`](server/).