[Pages]: Add binding instructions to remix sites (#5120)

* Add binding instructions to remix sites

* Add binding section

* kate's edit

* add example for using kv namespace

* Apply suggestions from code review

Co-authored-by: Kate Tungusova <70746074+deadlypants1973@users.noreply.github.com>

* Apply suggestions from code review

Co-authored-by: Daniel Walsh <walshy@cloudflare.com>

* Add durable objects section

* Apply suggestions from code review

Co-authored-by: Greg Brimble <gbrimble@cloudflare.com>
Co-authored-by: Kate Tungusova <70746074+deadlypants1973@users.noreply.github.com>

* Update content/pages/framework-guides/remix.md

Co-authored-by: Greg Brimble <gbrimble@cloudflare.com>

* Apply suggestions from code review

PCX and Greg

Co-authored-by: Greg Brimble <gbrimble@cloudflare.com>

* Apply suggestions from code review

add links

* Update content/pages/framework-guides/remix.md

add aside back

Co-authored-by: Kate Tungusova <ktungusova@cloudflare.com>
Co-authored-by: Kate Tungusova <70746074+deadlypants1973@users.noreply.github.com>
Co-authored-by: Daniel Walsh <walshy@cloudflare.com>
Co-authored-by: Greg Brimble <gbrimble@cloudflare.com>

content/pages/framework-guides/remix.md

@@ -74,6 +74,73 @@ For the complete guide to deploying your first site to Cloudflare Pages, refer t
 After deploying your site, you will receive a unique subdomain for your project on `*.pages.dev`.
 Every time you commit new code to your Remix site, Cloudflare Pages will automatically rebuild your project and deploy it. You will also get access to [preview deployments](/pages/platform/preview-deployments/) on new pull requests, so you can preview how changes look to your site before deploying them to production.
 
+## Create and add a binding to your Remix application
+
+A [binding](/pages/platform/functions/bindings/) allows your application to interact with Cloudflare developer products, such as [KV](https://developers.cloudflare.com/workers/learning/how-kv-works/), [Durable Object](/workers/learning/using-durable-objects/), [R2](/r2/), and [D1](https://blog.cloudflare.com/introducing-d1/). 
+
+To add a binding to your Remix application, refer to [Bindings](/pages/platform/functions/bindings/).
+
+### Use a binding in your Remix application
+
+If you have created a KV namespace binding called `PRODUCTS_KV`, you can access its data in a [Remix `loader` function](https://remix.run/docs/en/v1/guides/data-loading#cloudflare-kv). 
+
+The following code block shows an example of accessing a KV namespace in Remix. 
+
+```typescript
+---
+filename: app/routes/products/$productId.tsx
+highlight: [9,10,11,12,13,17,24]
+---
+import type { LoaderArgs } from "@remix-run/cloudflare";
+import { json } from "@remix-run/cloudflare"; 
+import { useLoaderData } from "@remix-run/react";
+
+export const loader = async ({
+  context,
+  params,
+}: LoaderArgs) => {
+  return json(
+    await context.PRODUCTS_KV.get<{ name: string }>(`product-${params.productId}`, {
+      type: "json",
+    })
+  );
+};
+
+export default function Product() {
+  const product = useLoaderData<typeof loader>();
+
+  if (!product) throw new Response(null, { status: 404 })
+
+  return (
+    <div>
+      <p>Product</p>
+      {product.name}
+      <p>Products</p>
+      {/* ... */}
+    </div>
+  );
+}
+
+```
+
+Currently, the only way to use Durable Objects when using Cloudflare Pages is by having a separate Worker, creating a binding, and accessing it in `context`. For example:
+
+```ts
+export const loader = async ({
+  context,
+  params,
+}: LoaderArgs) => {
+  const id = context.PRODUCTS_DO.idFromName(params.productId);
+  const stub = context.PRODUCTS_DO.get(id);
+  const response = await stub.fetch(request);
+  const data = await response.json() as { name: string };
+  return json(data);
+};
+
+You have to do this because there is no way to export the Durable Object class from a Pages Function. 
+
+Refer to the Durable Objects documentation to learn about deploying a [Durable Object](/workers/learning/using-durable-objects/).
+
 ## Learn more
 
 By completing this guide, you have successfully deployed your Remix.js site to Cloudflare Pages. To get started with other frameworks, [refer to the list of Framework guides](/pages/framework-guides/).