[docs] update adapter READMESs to include astro add (#4595)

* update adapter READMES to include astro add

* missing space

Co-authored-by: Yan Thomas <61414485+Yan-Thomas@users.noreply.github.com>

Co-authored-by: Yan Thomas <61414485+Yan-Thomas@users.noreply.github.com>
Co-authored-by: Matthew Phillips <matthew@skypack.dev>

packages/integrations/cloudflare/README.md

@@ -2,11 +2,25 @@
 
 An SSR adapter for use with Cloudflare Pages Functions targets. Write your code in Astro/Javascript and deploy to Cloudflare Pages.
 
-Learn how to deploy your Astro site in our [Cloudflare Pages deployment guide](https://docs.astro.build/en/guides/deploy/cloudflare/).
+## Install
 
-In your `astro.config.mjs` use:
+Add the Cloudflare adapter to enable SSR in your Astro project with the following `astro add` command. This will install the adapter and make the appropriate changes to your `astro.config.mjs` file in one step.
 
-```js
+```bash
+npx astro add cloudflare
+```
+
+If you prefer to install the adapter manually instead, complete the following two steps:
+
+1. Add the Cloudflare adapter to your project's dependencies using your preferred package manager. If you’re using npm or aren’t sure, run this in the terminal:
+
+```bash
+npm install @astrojs/cloudflare
+```
+
+2. Add the following to your `astro.config.mjs` file:
+
+```js title="astro.config.mjs" ins={2, 5-6}
 import { defineConfig } from 'astro/config';
 import cloudflare from '@astrojs/cloudflare';
 

packages/integrations/deno/README.md

@@ -23,26 +23,54 @@ If you wish to [use server-side rendering (SSR)](https://docs.astro.build/en/gui
 
 ## Installation
 
-First, install the `@astrojs/deno` package using your package manager. If you're using npm or aren't sure, run this in the terminal:
+Add the Deno adapter to enable SSR in your Astro project with the following `astro add` command. This will install the adapter and make the appropriate changes to your `astro.config.mjs` file in one step.
 
-```sh
+```bash
-npm install @astrojs/deno
+npx astro add deno
 ```
 
-Then, install this adapter in your `astro.config.*` file using the `adapter` property:
+If you prefer to install the adapter manually instead, complete the following two steps:
 
-__`astro.config.mjs`__
+1. Install the Deno adapter to your project’s dependencies using your preferred package manager. If you’re using npm or aren’t sure, run this in the terminal:
 
-```js
+    ```bash
-import { defineConfig } from 'astro/config';
+      npm install @astrojs/deno
-import deno from '@astrojs/deno';
+    ```
 
-export default defineConfig({
+1. Update your `astro.config.mjs` project configuration file with the changes below.
-  // ...
+
+    ```js ins={3,6-7}
+    // astro.config.mjs
+    import { defineConfig } from 'astro/config';
+    import deno from '@astrojs/deno';
+
+    export default defineConfig({
       output: 'server',
-  adapter: deno()
+      adapter: deno(),
-});
+    });
-```
+    ```
+
+Next, Update your `preview` script in `package.json` with the change below.
+
+    ```json del={8} ins={9}
+    // package.json
+    {
+      // ...
+      "scripts": {
+        "dev": "astro dev",
+        "start": "astro dev",
+        "build": "astro build",
+        "preview": "astro preview"
+        "preview": "deno run --allow-net --allow-read --allow-env ./dist/server/entry.mjs"
+      }
+    }
+    ```
+    
+    You can now use this command to preview your production Astro site locally with Deno.
+    
+    ```bash
+    npm run preview
+    ```
   
 ## Usage
 

packages/integrations/netlify/README.md

@@ -25,39 +25,47 @@ If you wish to [use server-side rendering (SSR)](https://docs.astro.build/en/gui
 
 ## Installation
 
-First, install the `@astrojs/netlify` package using your package manager. If you're using npm or aren't sure, run this in the terminal:
+Add the Netlify adapter to enable SSR in your Astro project with the following `astro add` command. This will install the adapter and make the appropriate changes to your `astro.config.mjs` file in one step.
-```sh
+
-npm install @astrojs/netlify
+```bash
+npx astro add netlify
 ```
 
-Then, install this adapter in your `astro.config.*` file using the `adapter` property. Note: there are two different adapters, one for Netlify Functions and one for Edge Functions. See [Edge Functions](#edge-functions) below on importing the latter.
+If you prefer to install the adapter manually instead, complete the following two steps:
 
-__`astro.config.mjs`__
+1. Install the Netlify adapter to your project’s dependencies using your preferred package manager. If you’re using npm or aren’t sure, run this in the terminal:
 
-```js
+    ```bash
-import { defineConfig } from 'astro/config';
+      npm install @astrojs/netlify
-import netlify from '@astrojs/netlify/functions';
+    ```
 
-export default defineConfig({
+1. Add two new lines to your `astro.config.mjs` project configuration file.
+
+    ```js title="astro.config.mjs" ins={2, 5-6}
+    import { defineConfig } from 'astro/config';
+    import netlify from '@astrojs/netlify/functions';
+
+    export default defineConfig({
       output: 'server',
       adapter: netlify(),
-});
+    });
-```
+    ```
 
 ### Edge Functions
 
-Netlify has two serverless platforms, Netlify Functions and Netlify Edge Functions. With Edge Functions your code is distributed closer to your users, lowering latency. You can use Edge Functions by changing the import in your astro configuration file:
+Netlify has two serverless platforms, Netlify Functions and [Netlify's experimental Edge Functions](https://docs.netlify.com/netlify-labs/experimental-features/edge-functions/#app). With Edge Functions your code is distributed closer to your users, lowering latency. You can use Edge Functions by changing the `netlify/functions` import in the Astro config file to use `netlify/edge-functions`.
 
-```diff
+      ```js title="astro.config.mjs" ins={3} del={2}
-import { defineConfig } from 'astro/config';
+      import { defineConfig } from 'astro/config';
-- import netlify from '@astrojs/netlify/functions';
+      import netlify from '@astrojs/netlify/functions';
-+ import netlify from '@astrojs/netlify/edge-functions';
+      import netlify from '@astrojs/netlify/edge-functions';
 
-export default defineConfig({
+      export default defineConfig({
         output: 'server',
         adapter: netlify(),
-});
+      });
-```
+      ```
+
 ## Usage
 
 [Read the full deployment guide here.](https://docs.astro.build/en/guides/deploy/netlify/)

packages/integrations/node/README.md

@@ -21,26 +21,31 @@ If you wish to [use server-side rendering (SSR)](https://docs.astro.build/en/gui
 
 ## Installation
 
-First, install the `@astrojs/node` package using your package manager. If you're using npm or aren't sure, run this in the terminal:
+Add the Node adapter to enable SSR in your Astro project with the following `astro add` command. This will install the adapter and make the appropriate changes to your `astro.config.mjs` file in one step.
 
-```sh
+```bash
-npm install @astrojs/node
+npx astro add node
 ```
 
-Then, install this adapter in your `astro.config.*` file using the `adapter` property:
+If you prefer to install the adapter manually instead, complete the following two steps:
 
-__`astro.config.mjs`__
+1. Install the Node adapter to your project’s dependencies using your preferred package manager. If you’re using npm or aren’t sure, run this in the terminal:
 
-```js
+    ```bash
-import { defineConfig } from 'astro/config';
+      npm install @astrojs/node
-import node from '@astrojs/node';
+    ```
 
-export default defineConfig({
+1. Add two new lines to your `astro.config.mjs` project configuration file.
-  // ...
+
+    ```js title="astro.config.mjs" ins={2, 5-6}
+    import { defineConfig } from 'astro/config';
+    import netlify from '@astrojs/node';
+
+    export default defineConfig({
       output: 'server',
-  adapter: node()
+      adapter: node(),
-})
+    });
-```
+    ```
 
 ## Usage
 

packages/integrations/vercel/README.md

@@ -22,24 +22,31 @@ If you wish to [use server-side rendering (SSR)](https://docs.astro.build/en/gui
 
 ## Installation
 
-First, install the `@astrojs/vercel` package using your package manager. If you're using npm or aren't sure, run this in the terminal:
+Add the Vercel adapter to enable SSR in your Astro project with the following `astro add` command. This will install the adapter and make the appropriate changes to your `astro.config.mjs` file in one step.
-```sh
+
-npm install @astrojs/vercel
+```bash
+npx astro add vercel
 ```
 
-Then, install this adapter in your `astro.config.*` file using the `deploy` property (note the import from `@astrojs/vercel/serverless` - see [targets](#targets)).
+If you prefer to install the adapter manually instead, complete the following two steps:
 
- __`astro.config.mjs`__
+1. Install the Vercel adapter to your project’s dependencies using your preferred package manager. If you’re using npm or aren’t sure, run this in the terminal:
 
-```js
+    ```bash
-import { defineConfig } from 'astro/config';
+      npm install @astrojs/vercel
-import vercel from '@astrojs/vercel/serverless';
+    ```
 
-export default defineConfig({
+1. Add two new lines to your `astro.config.mjs` project configuration file.
+
+    ```js title="astro.config.mjs" ins={2, 5-6}
+    import { defineConfig } from 'astro/config';
+    import netlify from '@astrojs/vercel/serverless';
+
+    export default defineConfig({
       output: 'server',
-	adapter: vercel()
+      adapter: vercel(),
-});
+    });
-```
+    ```
 
 ### Targets