From dd6c16bcb158cc386eb678a5a9d57e177e763c39 Mon Sep 17 00:00:00 2001
From: Reuben Tier <64310361+TheOtterlord@users.noreply.github.com>
Date: Wed, 26 Jul 2023 14:12:05 +0100
Subject: [PATCH] New recipe: Call endpoints from the server (#3202)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* New recipe: Call endpoints from the server

* Apply suggestions from code review

Co-authored-by: Sarah Rainsberger <sarah@rainsberger.ca>

* Update recipe

* Update link

* Add related recipe link

* Move recipe links

---------

Co-authored-by: Sarah Rainsberger <sarah@rainsberger.ca>
Co-authored-by: Elian ☕️ <hello@elian.codes>
---
 .../docs/en/core-concepts/endpoints.mdx       |  3 +-
 .../docs/en/recipes/call-endpoints.mdx        | 41 +++++++++++++++++++
 2 files changed, 43 insertions(+), 1 deletion(-)
 create mode 100644 src/content/docs/en/recipes/call-endpoints.mdx

diff --git a/src/content/docs/en/core-concepts/endpoints.mdx b/src/content/docs/en/core-concepts/endpoints.mdx
index cb2c3f8f1207f..cb6f1cf7cde92 100644
--- a/src/content/docs/en/core-concepts/endpoints.mdx
+++ b/src/content/docs/en/core-concepts/endpoints.mdx
@@ -98,6 +98,8 @@ Everything described in the static file endpoints section can also be used in SS
 
 But, unlike in `static` mode, when you configure `server` mode, the endpoints will be built when they are requested. This unlocks new features that are unavailable at build time, and allows you to build API routes that listen for requests and securely execute code on the server at runtime.
 
+<RecipeLinks slugs={["en/recipes/call-endpoints" ]}/>
+
 :::note
 Be sure to [enable SSR](/en/guides/server-side-rendering/#enabling-ssr-in-your-project) before trying these examples.
 :::
@@ -224,4 +226,3 @@ export async function get({ params, redirect }) {
   return redirect(link, 307);
 }
 ```
-
diff --git a/src/content/docs/en/recipes/call-endpoints.mdx b/src/content/docs/en/recipes/call-endpoints.mdx
new file mode 100644
index 0000000000000..7492a747fb77e
--- /dev/null
+++ b/src/content/docs/en/recipes/call-endpoints.mdx
@@ -0,0 +1,41 @@
+---
+title: Call endpoints from the server
+description: Learn how to call endpoints from the server in Astro.
+i18nReady: true
+type: recipe
+---
+
+Endpoints can be used to serve many kinds of data. This recipe calls a server endpoint from a page's component script to display a greeting, without requiring an additional fetch request.
+
+## Prerequisites
+
+- A project with [SSR](/en/guides/server-side-rendering/) (output: 'server') enabled
+
+## Recipe
+
+1. Create an endpoint in a new file `src/pages/api/hello.ts` that returns some data:
+
+    ```ts title="src/pages/api/hello.ts"
+    import type { APIRoute } from 'astro'
+
+    export const get: APIRoute = () => {
+      return new Response(
+        JSON.stringify({
+          greeting: 'Hello',
+        }),
+      )
+    }
+    ```
+
+2. On any Astro page, import the `get()` method from the endpoint. Call it with the [`Astro` global](/en/reference/api-reference/#astro-global) to provide the request context, and use the response on the page:
+
+    ```astro title="src/pages/index.astro"
+    ---
+    import { get } from './api/hello.ts'
+
+    let response = await get(Astro)
+    const data = await response.json()
+    ---
+
+    <h1>{data.greeting} world!</h1>
+    ```