diff --git a/public/logos/tina-cms.svg b/public/logos/tina-cms.svg
new file mode 100644
index 0000000000000..bb3aa1931ce55
--- /dev/null
+++ b/public/logos/tina-cms.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 49 68"><path fill="#f97316" d="M31.5 30.2c3.3-2.8 4.7-18.9 6.2-24.7C39-.3 45 0 45 0s-1.5 2.7-1 4.7c.7 2 5 3.7 5 3.7L48 11s-1.9-.3-3 2c-1.2 2.3.7 25 .7 25s-6.9 13.7-6.9 19.5c0 5.7 2.8 10.5 2.8 10.5h-3.9s-5.6-6.6-6.7-10c-1.2-3.3-.7-6.6-.7-6.6s-6.1-.4-11.5 0c-5.4.3-9 5-9.7 7.6-.6 2.5-.9 9-.9 9h-3c-1.8-5.6-3.3-7.7-2.5-10.5C4.9 49.5 4.5 45 3.9 43 3.4 41 0 39.3 0 39.3c1.7-3.5 3.4-5.1 10.8-5.3 7.4-.2 17.4-1 20.7-3.7z"/><path fill="#f97316" d="M12.3 57s.7 7.3 4.9 11h3.5c-3.5-4-4-14.6-4-14.6-1.7.6-4.2 2.7-4.5 3.6z"/></svg>
diff --git a/src/components/CodeSnippet/CodeSnippet.astro b/src/components/CodeSnippet/CodeSnippet.astro
index 8bfc69a016ba7..006c72d661b99 100644
--- a/src/components/CodeSnippet/CodeSnippet.astro
+++ b/src/components/CodeSnippet/CodeSnippet.astro
@@ -1,5 +1,6 @@
 ---
 import rangeParser from 'parse-numeric-range';
+import { useTranslations } from '~/i18n/util';
 import { ShikiBlock } from './shiki-block';
 import {
 	InlineMarkingDefinition,
@@ -26,6 +27,8 @@ const {
 	inlineMarkings = '',
 } = Astro.props as Props;
 
+const t = useTranslations(Astro);
+
 const isTerminal = ['shellscript', 'shell', 'bash', 'sh', 'zsh'].includes(lang);
 const intRemovedLineIndex = parseInt(removedLineIndex) || 0;
 const intRemovedLineCount = parseInt(removedLineCount) || 0;
@@ -315,6 +318,14 @@ function parseMarkingDefinition(serializedArr: string, parts: RegExp, parseError
 		`lang-${lang}`,
 	]}
 >
-	<figcaption class="header">{titleHtml && <span class="title" set:html={titleHtml} />}</figcaption>
+	<figcaption class="header">
+		{
+			titleHtml ? (
+				<span class="title" set:html={titleHtml} />
+			) : (
+				isTerminal && <span class="sr-only">{t('codeSnippet.terminalCaption')}</span>
+			)
+		}
+	</figcaption>
 	<Fragment set:html={codeSnippetHtml} />
 </figure>
diff --git a/src/components/Header/Header.astro b/src/components/Header/Header.astro
index 338f518519ed1..751a68074b03b 100644
--- a/src/components/Header/Header.astro
+++ b/src/components/Header/Header.astro
@@ -27,6 +27,7 @@ const t = useTranslations(Astro);
 							height="102"
 							viewBox="0 0 363 102"
 							fill="none"
+							aria-hidden="true"
 						>
 							<style>
 								.text {
@@ -62,6 +63,7 @@ const t = useTranslations(Astro);
 							height="102"
 							viewBox="0 0 226 102"
 							fill="none"
+							aria-hidden="true"
 						>
 							<path
 								class="docs-path"
@@ -78,7 +80,7 @@ const t = useTranslations(Astro);
 			labels={{ useLight: t('themeToggle.useLight'), useDark: t('themeToggle.useDark') }}
 			isInsideHeader={true}
 		/>
-		{lang && <LanguageSelect lang={lang} client:idle />}
+		{lang && <LanguageSelect lang={lang} label={t('languageSelect.label')} client:idle />}
 		<Search {lang} labels={docsearchStrings} />
 		<SidebarToggle client:idle />
 	</nav>
diff --git a/src/components/Header/LanguageSelect.tsx b/src/components/Header/LanguageSelect.tsx
index d00d04a83e4e5..01b74320e539b 100644
--- a/src/components/Header/LanguageSelect.tsx
+++ b/src/components/Header/LanguageSelect.tsx
@@ -3,9 +3,10 @@ import languages from '../../i18n/languages';
 import './HeaderButton.css';
 import './LanguageSelect.css';
 
-const LanguageSelect = ({ lang }: { lang: string }) => {
+const LanguageSelect = ({ lang, label }: { lang: string; label: string }) => {
 	return (
-		<div className="language-select-wrapper">
+		<label className="language-select-wrapper">
+			<span className="sr-only">{label}</span>
 			<svg
 				width="1.25em"
 				height="1.25em"
@@ -26,7 +27,6 @@ const LanguageSelect = ({ lang }: { lang: string }) => {
 			<select
 				className="header-button language-select"
 				value={lang}
-				aria-label="Select language"
 				onChange={(e: ChangeEvent<HTMLSelectElement>) => {
 					const newLang = e.currentTarget.value;
 					const [_leadingSlash, _oldLang, ...rest] = window.location.pathname.split('/');
@@ -40,7 +40,7 @@ const LanguageSelect = ({ lang }: { lang: string }) => {
 					</option>
 				))}
 			</select>
-		</div>
+		</label>
 	);
 };
 
diff --git a/src/components/Header/SkipToContent.astro b/src/components/Header/SkipToContent.astro
index 155bfb8f4081d..e4fd67905a367 100644
--- a/src/components/Header/SkipToContent.astro
+++ b/src/components/Header/SkipToContent.astro
@@ -19,10 +19,8 @@ import UIString from '../UIString.astro';
 		z-index: 9;
 		display: block;
 		text-align: center;
-		background-color: var(--theme-accent);
-		color: white;
-		border-radius: 0.25em;
-		outline: var(--theme-bg) solid 1px;
+		background-color: var(--theme-bg-gradient-bottom);
+		outline: 2px solid currentColor;
 		outline-offset: 0;
 	}
 </style>
diff --git a/src/components/Header/ThemeToggleButton.tsx b/src/components/Header/ThemeToggleButton.tsx
index 8942b5c54b051..57f13f18af14f 100644
--- a/src/components/Header/ThemeToggleButton.tsx
+++ b/src/components/Header/ThemeToggleButton.tsx
@@ -19,6 +19,7 @@ const icons = [
 		height="20"
 		viewBox="0 0 20 20"
 		fill="currentColor"
+		aria-hidden="true"
 	>
 		<path
 			fillRule="evenodd"
@@ -33,6 +34,7 @@ const icons = [
 		height="20"
 		viewBox="0 0 20 20"
 		fill="currentColor"
+		aria-hidden="true"
 	>
 		<path d="M17.293 13.293A8 8 0 016.707 2.707a8.001 8.001 0 1010.586 10.586z" />
 	</svg>,
diff --git a/src/components/LeftSidebar/Sponsors.astro b/src/components/LeftSidebar/Sponsors.astro
index b64d84d958715..3f75c3023e6bd 100644
--- a/src/components/LeftSidebar/Sponsors.astro
+++ b/src/components/LeftSidebar/Sponsors.astro
@@ -5,8 +5,8 @@ import UIString from '../UIString.astro';
 <div dir="ltr" lang="en" class="sponsors">
 	<h2 class="sponsors-title"><UIString key="leftSidebar.sponsoredBy" /></h2>
 	<a href="https://www.netlify.com/" aria-label="Netlify">
-		<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 147 40" width="90"
-			><radialGradient
+		<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 147 40" width="90" aria-hidden="true">
+			<radialGradient
 				id="a"
 				cx="-779.1"
 				cy="1839.7"
@@ -24,7 +24,7 @@ import UIString from '../UIString.astro';
 		</svg>
 	</a>
 	<a href="https://www.storyblok.com/" aria-label="Storyblok">
-		<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 251 53" width="125">
+		<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 251 53" width="125" aria-hidden="true">
 			<g>
 				<path
 					d="M73 37c-2 0-3.7-.2-5.5-.7-1.6-.6-3.2-1.5-4.5-2.7l2.4-4c1.3 1 2.5 1.6 3.8 2.1 1.2.6 2.4.8 3.6.8a4 4 0 0 0 2-.5c.4-.3.6-.7.6-1.3 0-.5-.2-1-.9-1.4-1-.4-2-.8-3-1L67.7 27a13 13 0 0 1-2.4-1.3c-.6-.4-1.1-1-1.4-1.6a5 5 0 0 1-.4-2c0-2.2.9-4.1 2.5-5.4a9.3 9.3 0 0 1 6.1-2c1.6 0 3.1.2 4.5.6 1.4.5 2.8 1.3 4.1 2.4l-2.6 4c-1-.8-2-1.4-3.2-1.9a7 7 0 0 0-2.8-.6c-.7 0-1.3.1-1.8.5-.5.2-.7.7-.7 1.3 0 .6.2 1 .8 1.4.5.3 1.5.6 3 1l3.8 1.2L80 26c1.3 1 2 2.5 1.8 4.1a6 6 0 0 1-2.4 5.1 10 10 0 0 1-6.4 1.9Zm25.8-1.4-3 1c-1.2.3-2.4.5-3.6.5-.8 0-1.6 0-2.3-.3a4.3 4.3 0 0 1-3.2-2.7c-.3-.8-.5-1.7-.5-2.7V20h-2.7v-4.9h2.7V8.3h6.5v6.8h4.4v5h-4.4v9c0 .7.2 1.2.6 1.6.3.3.8.4 1.3.4s1 0 1.5-.2l1.4-.6 1.2 5.3ZM111 37c-1.6 0-3.3-.3-4.8-.9a10 10 0 0 1-5.9-6 12 12 0 0 1 0-8.5c1-2.8 3.1-5 5.9-6 1.4-.6 3-1 4.8-1a11 11 0 0 1 10.7 7c1.1 2.7 1.1 5.8 0 8.5-1 2.7-3 5-5.8 6-1.5.6-3.2 1-4.9.9Zm-4.7-11c0 1.7.4 3 1.3 4 1 1 2.1 1.6 3.5 1.6 1.3 0 2.5-.6 3.4-1.6a6.4 6.4 0 0 0 1.4-4 6 6 0 0 0-1.4-4.1c-1-1-2-1.6-3.4-1.6-1.3 0-2.6.6-3.4 1.6a6 6 0 0 0-1 1.8c-.3.7-.4 1.5-.4 2.3Zm33.1-5.2c-1.5 0-3 .3-4.3.8a5.2 5.2 0 0 0-2.8 2.2v13h-6.5V15.1h6v4.3a8.4 8.4 0 0 1 2.9-3.4 6.5 6.5 0 0 1 3.6-1.3h1.1v6Zm2.9 19.1c1 .3 1.9.5 2.8.5.8 0 1.4-.2 1.9-.7a9 9 0 0 0 1.2-3L140 15.2h6.7l5 15.9 4.3-15.9h6.2l-8.2 25a8.5 8.5 0 0 1-11.7 5.3V40Zm35.3-2.8a8.1 8.1 0 0 1-7.2-4v3.6h-5.7v-30h6.6v12a8 8 0 0 1 10.8-3c1.1.5 2 1.3 3 2.3a14 14 0 0 1 1.8 12.4c-.5 1.3-1.2 2.6-2 3.5a9.6 9.6 0 0 1-7.3 3.2Zm-1.8-5.5a5 5 0 0 0 4.7-3.4c.8-2 .4-4.4-1-6.2-.8-1-2-1.7-3.4-1.7-1 0-2 .4-2.8 1-.9.8-1.6 1.7-2 2.8v4.5a5 5 0 0 0 4.6 3Zm15-24.8h6.6V29c0 1.7.7 2.5 2.1 2.5a5 5 0 0 0 2.1-.5l1 4.8a15 15 0 0 1-5.9 1.3c-1.9 0-3.3-.5-4.3-1.5s-1.6-2.4-1.6-4.3V6.8Zm24 30.3c-1.6 0-3.2-.3-4.8-.9-2.7-1-4.9-3.3-5.9-6a12 12 0 0 1 2.2-12 11.3 11.3 0 0 1 8.5-3.4 11 11 0 0 1 10.7 6.9c1.6 4.1.8 8.7-2.2 12a10 10 0 0 1-3.6 2.5c-1.6.6-3.2 1-4.9.9ZM210.2 26c0 1.7.4 3 1.3 4 1 1 2.1 1.6 3.5 1.6 1.3 0 2.5-.6 3.4-1.6a6.4 6.4 0 0 0 1.4-4 6 6 0 0 0-1.4-4.1c-1-1-2-1.6-3.4-1.6-1.3 0-2.6.6-3.4 1.6a6 6 0 0 0-1 1.8c-.3.7-.4 1.4-.4 2.3Zm34 10.7-5.6-8.7-2.3 2.4v6.3h-6.6v-30h6.6v17.4l7.2-8.9h7l-7.8 9.3 8.4 12.2h-7Z"
diff --git a/src/components/PageContent/ArticleNavigationButton.astro b/src/components/PageContent/ArticleNavigationButton.astro
index aaea10182fe13..9dd3dd065f825 100644
--- a/src/components/PageContent/ArticleNavigationButton.astro
+++ b/src/components/PageContent/ArticleNavigationButton.astro
@@ -18,6 +18,7 @@ const { item, rel } = Astro.props as Props;
 				height="32"
 				width="32"
 				fill="currentColor"
+				aria-hidden="true"
 			>
 				<path d="M447.1 256C447.1 273.7 433.7 288 416 288H109.3l105.4 105.4c12.5 12.5 12.5 32.75 0 45.25C208.4 444.9 200.2 448 192 448s-16.38-3.125-22.62-9.375l-160-160c-12.5-12.5-12.5-32.75 0-45.25l160-160c12.5-12.5 32.75-12.5 45.25 0s12.5 32.75 0 45.25L109.3 224H416C433.7 224 447.1 238.3 447.1 256z" />
 			</svg>
@@ -31,6 +32,7 @@ const { item, rel } = Astro.props as Props;
 				height="32"
 				width="32"
 				fill="currentColor"
+				aria-hidden="true"
 			>
 				<path d="M438.6 278.6l-160 160C272.4 444.9 264.2 448 256 448s-16.38-3.125-22.62-9.375c-12.5-12.5-12.5-32.75 0-45.25L338.8 288H32C14.33 288 .0016 273.7 .0016 256S14.33 224 32 224h306.8l-105.4-105.4c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0l160 160C451.1 245.9 451.1 266.1 438.6 278.6z" />
 			</svg>
diff --git a/src/components/internal/rehype-file-tree.ts b/src/components/internal/rehype-file-tree.ts
index a1cf1d99f3e84..b3ce7cffe42a9 100644
--- a/src/components/internal/rehype-file-tree.ts
+++ b/src/components/internal/rehype-file-tree.ts
@@ -79,7 +79,7 @@ export const fileTreeProcessor = rehype().use(function fileTree() {
 			const icon = h('span', isDirectory ? FolderIcon : FileIcon(firstChildTextContent));
 			if (!icon.properties) icon.properties = {};
 			if (isDirectory) {
-				icon.properties['aria-label'] = directoryLabel;
+				icon.children.unshift(h('span', { class: 'sr-only' }, directoryLabel));
 			}
 
 			node.properties.class = isDirectory ? 'directory' : 'file';
diff --git a/src/content/docs/en/core-concepts/routing.mdx b/src/content/docs/en/core-concepts/routing.mdx
index 58783501a12c3..c59ba9293201c 100644
--- a/src/content/docs/en/core-concepts/routing.mdx
+++ b/src/content/docs/en/core-concepts/routing.mdx
@@ -374,9 +374,9 @@ const params = Astro.params;
 
 ## Excluding pages
 
-You can exclude pages, or even whole directories from being built by prefixing their names with an underscore (`_`).
+You can exclude pages or directories from being built by prefixing their names with an underscore (`_`). Files with the `_` prefix won't be recognized by the router and won't be placed into the `dist/` directory.
 
-This allows you to create private pages, and also to co-locate tests, utilities, and components with their related pages, preventing them from being built into `.html` files and placed into the `dist/` directory.
+You can use this to temporarily disable pages, and also to put tests, utilities, and components in the same folder as their related pages. 
 
 In this example, only `src/pages/index.astro` and `src/pages/posts/post1.md` will be built as page routes and HTML files.
 
diff --git a/src/content/docs/en/guides/cms/storyblok.mdx b/src/content/docs/en/guides/cms/storyblok.mdx
index 04160c2122b8c..65d0aae72015a 100644
--- a/src/content/docs/en/guides/cms/storyblok.mdx
+++ b/src/content/docs/en/guides/cms/storyblok.mdx
@@ -367,16 +367,20 @@ export default defineConfig({
 
 ### Generating pages
 
-To create a route for a specific `page`, you can fetch its content directly from the Storyblok API and pass it to the `Page` component. Create an `index.astro` file in `src/pages/` to render the `home` page:
+To create a route for a specific `page`, you can fetch its content directly from the Storyblok API and pass it to the `StoryblokComponent` component.  Remember to make sure you have added the `Page` component to your astro.config.mjs.
 
-```astro title="src/pages/index.astro" {7,8,15} 
+Create an `index.astro` file in `src/pages/` to render the `home` page:
+
+```astro title="src/pages/index.astro" {3,7,8,9,17} 
 ---
 import { useStoryblokApi } from '@storyblok/astro'
+import StoryblokComponent from '@storyblok/astro/StoryblokComponent.astro'
 import BaseLayout from '../layouts/BaseLayout.astro'
-import Page from '../storyblok/Page.astro';
 
 const storyblokApi = useStoryblokApi();
-const { data } = await storyblokApi.get('cdn/stories/home');
+const { data } = await storyblokApi.get('cdn/stories/home', {
+  version: import.meta.env.DEV ? "draft" : "published",
+});
 const content = data.story.content;
 ---
 <html lang="en">
@@ -384,7 +388,7 @@ const content = data.story.content;
     <title>Storyblok & Astro</title>
   </head>
   <body>
-    <Page blok={content} />
+    <StoryblokComponent blok={content} />
   </body>
 </html>
 ```
diff --git a/src/content/docs/en/guides/cms/tina-cms.mdx b/src/content/docs/en/guides/cms/tina-cms.mdx
new file mode 100644
index 0000000000000..b0b2d5f42d060
--- /dev/null
+++ b/src/content/docs/en/guides/cms/tina-cms.mdx
@@ -0,0 +1,144 @@
+---
+title: Tina CMS & Astro
+description: Add content to your Astro project using Tina as a CMS
+type: cms
+stub: false
+service: Tina CMS
+---
+import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro'
+
+[Tina CMS](https://www.tina.io/) is a Git-backed headless content management system.
+
+## Integrating with Astro
+
+To get started, you'll need an existing Astro project. 
+
+1. Run the following command to install Tina into your Astro project.
+
+    <PackageManagerTabs>
+      <Fragment slot="npm">
+      ```shell
+      npx @tinacms/cli@latest init
+      ```
+      </Fragment>
+      <Fragment slot="pnpm">
+      ```shell
+      pnpx @tinacms/cli@latest init
+      ```
+      </Fragment>
+      <Fragment slot="yarn">
+      ```shell
+      yarn dlx @tinacms/cli@latest init
+      ```
+      </Fragment>
+    </PackageManagerTabs>
+
+    - When prompted for a Cloud ID, press <kbd>Enter</kbd> to skip. You'll generate one later if you want to use Tina Cloud.
+    - When prompted "What framework are you using", choose **Other**.
+    - When asked where public assets are stored, press <kbd>Enter</kbd>.
+
+    After this has finished, you should now have a `.tina` folder in the root of your project and an `admin` folder in your public directory. It will also create a Markdown file at `content/posts/hello-world.md`.
+ 
+2. Change  the `dev` script in `package.json`:
+
+    <PackageManagerTabs>
+      <Fragment slot="npm">
+      ```json del={4} ins={5}
+      // package.json
+      {
+          "scripts": {
+              "dev": "astro dev",
+              "dev": "npm tinacms dev -c 'astro dev'"
+          }
+      }
+      ```
+      </Fragment>
+      <Fragment slot="pnpm">
+      ```json del={4} ins={5}
+      // package.json
+      {
+          "scripts": {
+              "dev": "astro dev",
+              "dev": "pnpm tinacms dev -c 'astro dev'"
+          }
+      }
+      ```
+      </Fragment>
+      <Fragment slot="yarn">
+      ```json del={4} ins={5}
+      // package.json
+      {
+          "scripts": {
+              "dev": "astro dev",
+              "dev": "yarn tinacms dev -c 'astro dev'"
+          }
+      }
+      ```
+      </Fragment>
+    </PackageManagerTabs>
+
+3. TinaCMS is now set up in local mode. Test this by running the `dev` script, then navigating to `/admin/index.html#/collections/post`.
+
+    Editing the “Hello, World!” post will update the `content/posts/hello-world.md` file in your project directory.
+
+4. Set up your Tina collections by editing the `schema.collections` property in `.tina/config.ts`.
+
+    For example, you can add a required "date posted" frontmatter property to our posts:
+
+    ```js title=".tina/config.ts" ins={35-40}
+    import { defineConfig } from "tinacms";
+
+    // Your hosting provider likely exposes this as an environment variable
+    const branch = process.env.HEAD || process.env.VERCEL_GIT_COMMIT_REF || "main";
+
+    export default defineConfig({
+      branch,
+      clientId: null, // Get this from tina.io
+      token: null, // Get this from tina.io
+      build: {
+        outputFolder: "admin",
+        publicFolder: "public",
+      },
+      media: {
+        tina: {
+          mediaRoot: "images",
+          publicFolder: "public",
+        },
+      },
+      schema: {
+        collections: [
+          {
+            name: "posts",
+            label: "Posts",
+            path: "src/content/posts",
+            format: 'mdx',
+            fields: [
+              {
+                type: "string",
+                name: "title",
+                label: "Title",
+                isTitle: true,
+                required: true,
+              },
+              {
+                type: "datetime",
+                name: "posted",
+                label: "Date Posted",
+                required: true,
+              },
+              {
+                type: "rich-text",
+                name: "body",
+                label: "Body",
+                isBody: true,
+              },  
+            ],
+          },
+        ],
+      },
+    });
+    ```
+
+    Learn more about Tina collections [in the Tina docs](https://tina.io/docs/reference/collections/).
+
+5. In production, TinaCMS can commit changes directly to your GitHub repository. To set up TinaCMS for production, you can choose to use [Tina Cloud](https://tina.io/docs/tina-cloud/) or self-host the [Tina Data Layer](https://tina.io/docs/self-hosted/overview/). You can [read more about registering for Tina Cloud](https://app.tina.io/register) in the Tina Docs.
diff --git a/src/content/docs/en/guides/markdown-content.mdx b/src/content/docs/en/guides/markdown-content.mdx
index ee63ee010f409..be76931dcae3b 100644
--- a/src/content/docs/en/guides/markdown-content.mdx
+++ b/src/content/docs/en/guides/markdown-content.mdx
@@ -220,7 +220,7 @@ Don't forget to include a `client:directive` on your UI framework components, if
 
 See more examples of using import and export statements in the [MDX docs](https://mdxjs.com/docs/what-is-mdx/#esm).
 
-```astro title="src/pages/about.mdx" {5-6} /<.+\/>/
+```mdx title="src/pages/about.mdx" {5-6} /<.+\/>/
 ---
 layout: ../layouts/BaseLayout.astro
 title: About me
@@ -469,6 +469,8 @@ export default defineConfig({
 });
 ```
 
+Note that by default, `remarkToc` requires a "ToC" or "Table of Contents" [heading](https://github.com/remarkjs/remark-toc#optionsheading) (case-insensitive) on the page to show the table of contents.
+
 #### Heading IDs and plugins
 
 Astro injects an `id` attribute into all heading elements (`<h1>` to `<h6>`) in Markdown and MDX files and provides a `getHeadings()` utility for retrieving these IDs in [Markdown exported properties](#exported-properties).
@@ -494,16 +496,19 @@ export default defineConfig({
 
 #### Customizing a plugin
 
-In order to customize a plugin, provide an options object after it in a nested array. The example below adds the [`behavior` option to the `rehype-autolink-headings` plugin](https://github.com/rehypejs/rehype-autolink-headings#optionsbehavior) in order to add the anchor tag after the headline text.
+In order to customize a plugin, provide an options object after it in a nested array. 
+
+The example below adds the [heading option to the `remarkToc` plugin](https://github.com/remarkjs/remark-toc#optionsheading) to change where the table of contents is placed, and the [`behavior` option to the `rehype-autolink-headings` plugin](https://github.com/rehypejs/rehype-autolink-headings#optionsbehavior) in order to add the anchor tag after the headline text.
 
 ```js title="astro.config.mjs"
+import remarkToc from 'remark-toc';
 import { rehypeHeadingIds } from '@astrojs/markdown-remark';
 import rehypeSlug from 'rehype-slug';
 import rehypeAutolinkHeadings from 'rehype-autolink-headings';
 
 export default {
   markdown: {
-    remarkPlugins: [],
+    remarkPlugins: [ [remarkToc, { heading: "contents"} ] ],
     rehypePlugins: [rehypeSlug, [rehypeAutolinkHeadings, { behavior: 'append' }]],
   },
 }
diff --git a/src/content/docs/en/guides/testing.mdx b/src/content/docs/en/guides/testing.mdx
index bfb98e33d72c0..44790d853eeec 100644
--- a/src/content/docs/en/guides/testing.mdx
+++ b/src/content/docs/en/guides/testing.mdx
@@ -24,7 +24,7 @@ Playwright is an end-to-end testing framework for modern web apps. Use the Playw
 
 You can get started and run your tests using the [VS Code Extension](https://playwright.dev/docs/getting-started-vscode).
 
-Alternatively, you can install Playwright within your Astro project using the package manager of your choice. Follow the CLI steps to choose Javascript/Typescript, name your test folder, and add an optional Github Actions workflow.
+Alternatively, you can install Playwright within your Astro project using the package manager of your choice. Follow the CLI steps to choose JavaScript/TypeScript, name your test folder, and add an optional Github Actions workflow.
 
 <PackageManagerTabs>
   <Fragment slot="npm">
diff --git a/src/content/docs/en/guides/upgrade-to/v2.mdx b/src/content/docs/en/guides/upgrade-to/v2.mdx
index b48675ad5a1c6..9062293929012 100644
--- a/src/content/docs/en/guides/upgrade-to/v2.mdx
+++ b/src/content/docs/en/guides/upgrade-to/v2.mdx
@@ -1,7 +1,7 @@
 ---
 title: Upgrade to Astro v2
 description: How to upgrade your project to the latest version of Astro.
-i18nReady: false
+i18nReady: true
 ---
 import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro'
 import FileTree from '~/components/FileTree.astro'
diff --git a/src/content/docs/en/reference/api-reference.mdx b/src/content/docs/en/reference/api-reference.mdx
index 5ced1e5ab71a3..4c9c9bfdf3fe3 100644
--- a/src/content/docs/en/reference/api-reference.mdx
+++ b/src/content/docs/en/reference/api-reference.mdx
@@ -132,7 +132,7 @@ import Heading from '../components/Heading.astro';
 
 📚 Learn more about how [Markdown and MDX Layouts](/en/guides/markdown-content/#frontmatter-layout) handle props.
 
-📚 Learn how to add [Typescript type definitions for your props](/en/guides/typescript/#component-props).
+📚 Learn how to add [TypeScript type definitions for your props](/en/guides/typescript/#component-props).
 
 ### `Astro.params`
 
diff --git a/src/content/docs/en/reference/cli-reference.mdx b/src/content/docs/en/reference/cli-reference.mdx
index 7460b6170d78a..daed598f52b29 100644
--- a/src/content/docs/en/reference/cli-reference.mdx
+++ b/src/content/docs/en/reference/cli-reference.mdx
@@ -178,11 +178,11 @@ Specifies the path to the config file relative to the project root. Defaults to
 astro --config config/astro.config.mjs dev
 ```
 
-### `--site`
+### `--site <url>`
 
 Configures the [`site`](/en/reference/configuration-reference/#site) for your project. Passing this flag will override the `site` value in your `astro.config.mjs` file, if one exists.
 
-### `--base`
+### `--base <pathname>`
 
 <Since v="1.4.1" />
 
diff --git a/src/content/docs/es/core-concepts/project-structure.mdx b/src/content/docs/es/core-concepts/project-structure.mdx
index 1bda72cdcf92e..edd175f0c0e50 100644
--- a/src/content/docs/es/core-concepts/project-structure.mdx
+++ b/src/content/docs/es/core-concepts/project-structure.mdx
@@ -16,7 +16,7 @@ Astro propone una estructura de carpetas opinionada para tu proyecto. La raíz d
 - `public/*` - Archivos sin código que no serán procesados (fuentes, íconos, etc.)
 - `package.json` - El manifiesto de tu proyecto
 - `astro.config.mjs` - El archivo de configuración de Astro (recomendado)
-- `tsconfig.json` - El archivo de configuración de Typescript (recomendado)
+- `tsconfig.json` - El archivo de configuración de TypeScript (recomendado)
 
 ### Ejemplo de árbol de proyecto
 
@@ -114,6 +114,6 @@ Lee la [Guía de Configuración de Astro](/es/guides/configuring-astro/) para ob
 
 ### `tsconfig.json`
 
-Este archivo es generado en cada plantilla de inicio de Astro e incluye la configuración de las opciones de Typescript para tu proyecto de Astro. Algunas características (como importaciones de paquetes de npm) no están soportadas completamente en tu editor sin un archivo `tsconfig.json`. 
+Este archivo es generado en cada plantilla de inicio de Astro e incluye la configuración de las opciones de TypeScript para tu proyecto de Astro. Algunas características (como importaciones de paquetes de npm) no están soportadas completamente en tu editor sin un archivo `tsconfig.json`. 
 
-Lee la [Guía de Typescript](/es/guides/typescript/) para obtener detalles sobre las opciones de configuración.
+Lee la [Guía de TypeScript](/es/guides/typescript/) para obtener detalles sobre las opciones de configuración.
diff --git a/src/content/docs/es/guides/imports.mdx b/src/content/docs/es/guides/imports.mdx
index 6c5d4c3982139..16a8ea684b685 100644
--- a/src/content/docs/es/guides/imports.mdx
+++ b/src/content/docs/es/guides/imports.mdx
@@ -51,7 +51,7 @@ Astro incluye compatibilidad con [TypeScript](https://www.typescriptlang.org/).
 **Astro no realiza ninguna verificación de tipos por sí mismo.** La verificación de tipos debe realizarse al margen Astro, ya sea mediante el IDE o un script separado. Para chequeo de tipos en archivos Astro, puedes usar el [comando `astro check`](/es/reference/cli-reference/#astro-check).
 
 :::note[TypeScript y extensiones de archivos]
-Según las [reglas de resolución de módulos de Typescript](https://www.typescriptlang.org/docs/handbook/module-resolution.html), las extensiones `.ts` y `.tsx` no deben utilizarse a la hora de importar archivos de Typescript. En su lugar, utiliza las extensiones `.js`/`.jsx`, o bien puedes omitir la extensión del archivo completamente.
+Según las [reglas de resolución de módulos de TypeScript](https://www.typescriptlang.org/docs/handbook/module-resolution.html), las extensiones `.ts` y `.tsx` no deben utilizarse a la hora de importar archivos de TypeScript. En su lugar, utiliza las extensiones `.js`/`.jsx`, o bien puedes omitir la extensión del archivo completamente.
 
 ```ts
 import { getUser } from './user.js'; // user.ts
diff --git a/src/content/docs/es/guides/typescript.mdx b/src/content/docs/es/guides/typescript.mdx
index 13f19e1537acf..d7d309b87a682 100644
--- a/src/content/docs/es/guides/typescript.mdx
+++ b/src/content/docs/es/guides/typescript.mdx
@@ -37,7 +37,7 @@ Adicionalmente, nuestras plantillas incluyen un archivo `env.d.ts` dentro de la
 
 ### Componentes de Frameworks
 
-Si tu proyecto utiliza [componentes de otros framework](/es/core-concepts/framework-components/), es posible que se necesiten configuraciones adicionales dependiendo el framework utilizado. Por favor revisa la documentación de Typescript de tu framework para más información. ([Vue](https://vuejs.org/guide/typescript/overview.html#using-vue-with-typescript), [React](https://reactjs.org/docs/static-type-checking.html), [Preact](https://preactjs.com/guide/v10/typescript), [Solid](https://www.solidjs.com/guides/typescript))
+Si tu proyecto utiliza [componentes de otros framework](/es/core-concepts/framework-components/), es posible que se necesiten configuraciones adicionales dependiendo el framework utilizado. Por favor revisa la documentación de TypeScript de tu framework para más información. ([Vue](https://vuejs.org/guide/typescript/overview.html#using-vue-with-typescript), [React](https://reactjs.org/docs/static-type-checking.html), [Preact](https://preactjs.com/guide/v10/typescript), [Solid](https://www.solidjs.com/guides/typescript))
 
 ## Importación de tipos
 
@@ -49,7 +49,7 @@ import type { SomeType } from './script';
 ```
 Esto te ayudará a evitar casos extremos en los que el empaquetador de Astro intente empaquetar incorrectamente sus tipos importados como si fueran JavaScript.
 
-En tu archivo `.tsconfig`, puedes indicarle a Typescript para que te ayude con esto. La [configuración `importsNotUsedAsValues`](https://www.typescriptlang.org/tsconfig#importsNotUsedAsValues) puede establecerse a `error`. Si lo haces, Typescript va a chequear tus importaciones e indicarte cuándo debes utilizar `import type`.
+En tu archivo `.tsconfig`, puedes indicarle a TypeScript para que te ayude con esto. La [configuración `importsNotUsedAsValues`](https://www.typescriptlang.org/tsconfig#importsNotUsedAsValues) puede establecerse a `error`. Si lo haces, TypeScript va a chequear tus importaciones e indicarte cuándo debes utilizar `import type`.
 
 ```json title="tsconfig.json" ins={3}
 // tsconfig.json
diff --git a/src/content/docs/es/reference/api-reference.mdx b/src/content/docs/es/reference/api-reference.mdx
index 0381bd9f09aba..8e2e609cf752c 100644
--- a/src/content/docs/es/reference/api-reference.mdx
+++ b/src/content/docs/es/reference/api-reference.mdx
@@ -129,7 +129,7 @@ import Heading from '../components/Heading.astro';
 
 📚 Aprende acerca de cómo se manejan las props en las [Plantillas de Markdown y MDX](/es/guides/markdown-content/#layout-en-el-frontmatter).
 
-📚 Aprende cómo añadir [definiciones de tipos de Typescript para tus props](/es/guides/typescript/#props-de-componentes).
+📚 Aprende cómo añadir [definiciones de tipos de TypeScript para tus props](/es/guides/typescript/#props-de-componentes).
 
 ### `Astro.params`
 
diff --git a/src/content/docs/fr/install/manual.mdx b/src/content/docs/fr/install/manual.mdx
index 9abc4737baa96..fb515c0e3f6c9 100644
--- a/src/content/docs/fr/install/manual.mdx
+++ b/src/content/docs/fr/install/manual.mdx
@@ -150,7 +150,7 @@ Si vous souhaitez inclure des [composants de Framework](/fr/core-concepts/framew
 
 ## 6. Créer votre Fichier `tsconfig.json`
 
-Typescript est configuré en utilisant `tsconfig.json`. Même si vous n'écrivez pas de code TypeScript, ce fichier est important afin que les outils comme Astro et VS Code sachent comment comprendre votre projet. Certaines fonctionnalités (comme les imports de paquets npm) ne sont pas entièrement supportés dans l'éditeur sans un fichier `tsconfig.json`.
+TypeScript est configuré en utilisant `tsconfig.json`. Même si vous n'écrivez pas de code TypeScript, ce fichier est important afin que les outils comme Astro et VS Code sachent comment comprendre votre projet. Certaines fonctionnalités (comme les imports de paquets npm) ne sont pas entièrement supportés dans l'éditeur sans un fichier `tsconfig.json`.
 
 Si vous avez l'intention d'écrire du code TypeScript, l'utilisation du template Astro `strict` or `strictest` est recommandé. Vous pouvez voir et comparer les trois configurations de template à [astro/tsconfigs/](https://github.com/withastro/astro/blob/main/packages/astro/tsconfigs/).
 
diff --git a/src/content/docs/ja/core-concepts/framework-components.mdx b/src/content/docs/ja/core-concepts/framework-components.mdx
index c561494161c93..224e087a17dbc 100644
--- a/src/content/docs/ja/core-concepts/framework-components.mdx
+++ b/src/content/docs/ja/core-concepts/framework-components.mdx
@@ -11,31 +11,7 @@ Astroは[React](https://ja.reactjs.org/)、[Preact](https://preactjs.com/)、[Sv
 
 ## インテグレーションをインストール
 
-AstroはReact、Preact、Svelte、Vue、SolidJS、AlpineJS、Litのインテグレーションをオプションとして提供しています。1つまたは複数のAstroインテグレーションをプロジェクトにインストールし、設定できます。
-
-フレームワークを使えるようにAstroを設定するためには、まずインテグレーションと関連するpeer dependenciesをインストールします。
-
-```bash
-npm install --save-dev @astrojs/react react react-dom
-```
-
-次に、それらをインポートし、`astro.config.mjs`のintegrationsの配列に関数を追加します。
-
-```js title="astro.config.mjs" ins={3} ins=/(?<!p)react\\(\\)/
-import { defineConfig } from 'astro/config';
-
-import react from '@astrojs/react';
-import preact from '@astrojs/preact';
-import svelte from '@astrojs/svelte';
-import vue from '@astrojs/vue';
-import solid from '@astrojs/solid-js';
-import lit from '@astrojs/lit';
-import alpine from '@astrojs/alpinejs';
-
-export default defineConfig({
-  integrations: [react(), preact(), svelte(), vue(), solid() , lit(), alpine()],
-});
-```
+AstroはReact、Preact、Svelte、Vue、SolidJS、AlpineJS、Litの[インテグレーション](/ja/guides/integrations-guide/)をオプションとして提供しています。1つまたは複数のAstroインテグレーションをプロジェクトにインストールし、設定できます。
 
 ⚙️ Astroのインテグレーションをインストールし、設定するにあたっての詳細は[インテグレーションガイド](/ja/guides/integrations-guide/)をご覧ください。
 
@@ -59,31 +35,36 @@ import MyReactComponent from '../components/MyReactComponent.jsx';
 </html>
 ```
 
-デフォルトでは、フレームワークのコンポーネントは静的なHTMLとしてレンダリングされます。これはインタラクティブでないコンポーネントを表示するのに便利で、必要のないJavaScriptをクライアントに送信するのを防ぎます。
+デフォルトでは、フレームワークのコンポーネントは静的なHTMLとしてレンダリングされます。これはインタラクティブでないコンポーネントをテンプレート化するのに便利で、必要のないJavaScriptをクライアントに送信するのを防ぎます。
 
 ## インタラクティブなコンポーネント
 
-`client:*` というディレクティブの内の1つを使用してフレームワークのコンポーネントをインタラクティブ（ハイドレーションした状態）にできます。これはコンポーネントがどのようにレンダリングされ、ハイドレーションされるかを定義するためのコンポーネントの属性です。
-
-この[clientディレクティブ](/ja/reference/directives-reference/#client-directives)はコンポーネントがビルド時にレンダリングされるかどうか、コンポーネントで使用されているJavaScriptがクライアントサイドでいつブラウザに読み込まれるかを表しています。
+フレームワークのコンポーネントは[`client:*`ディレクティブ](/ja/reference/directives-reference/#client-directives)を使用してインタラクティブ（ハイドレーションした状態）にできます。これはコンポーネントのJavaScriptがいつブラウザに送信されるべきかを定義するためのコンポーネントの属性です。
 
-ほとんどのディレクティブでビルド時にサーバー内でコンポーネントをレンダリングします。コンポーネント内のJavaScriptは特定のディレクティブに応じてクライアントに送信されます。コンポーネントは自身に含まれるJavaScriptをインポートし終えた段階でハイドレーションします。
+`client:only`を除く全てのclientディレクティブで、コンポーネントはまず最初にサーバー上でレンダリングされて静的なHTMLを生成します。JavaScriptのコンポーネントは指定したディレクティブに従ってブラウザに送信されます。その後コンポーネントはハイドレートしインタラクティブになります。
 
 ```astro title="src/pages/interactive-components.astro" /client:\S+/
 ---
 // 例: ブラウザでコンポーネントをハイドレーションする
 import InteractiveButton from '../components/InteractiveButton.jsx';
 import InteractiveCounter from '../components/InteractiveCounter.jsx';
+import InteractiveModal from "../components/InteractiveModal.svelte"
 ---
 <!-- このコンポーネントのJavaScriptはページ読み込み時にインポートが開始されます -->
 <InteractiveButton client:load />
 
 <!-- このコンポーネントのJavaScriptはユーザーがスクロールしてコンポーネントがページ内に表示されるまでクライアントに送信さません -->
 <InteractiveCounter client:visible />
+
+<!-- このコンポーネントはサーバーでレンダリングされませんが、ページ読み込み時にクライアント上でレンダリングされます -->
+<InteractiveModal client:only="svelte" />
 ```
 
-:::caution
-コンポーネントのフレームワーク（たとえばReact、Svelteなど）がレンダリングするのに必要なJavaScriptはページと一緒にダウンロードされます。`client:*`というディレクティブはいつコンポーネントで使用されるJavaScriptがインポートされるかと、いつコンポーネントがハイドレーションされるかを決定するだけです。
+コンポーネントをレンダリングするために必要なJavaScriptフレームワーク（React、Svelteなど）は、コンポーネント自身のJavaScriptと一緒にブラウザに送信されます。ページ上の複数のコンポーネントが同じフレームワークを使用する場合、フレームワークは一度だけ送信されます。
+
+
+:::note[アクセシビリティ]
+これらのコンポーネントをAstroで使用した場合、多くのフレームワーク固有のアクセシビリティパターンは同じように動作するはずです。アクセシビリティに関するJavaScriptが適切に読み込まれ、実行されるよう必ずクライアントディレクティブを設定してください。
 :::
 
 ### 利用可能なハイドレーションのディレクティブ
@@ -114,6 +95,27 @@ import MyVueComponent from '../components/MyVueComponent.vue';
 **Astro**コンポーネント（`.astro`）だけが複数のフレームワークのコンポーネントを含められます。
 :::
 
+## フレームワークコンポーネントにPropsを渡す
+
+Astroコンポーネントからフレームワークコンポーネントにpropを渡せます。
+
+```astro title="src/pages/frameworks-props.astro"
+---
+import TodoList from '../components/TodoList.jsx';
+import Counter from '../components/Counter.svelte';
+---
+<div>
+  <TodoList initialTodos={["learn Astro", "review PRs"]} />
+  <Counter startingCount={1} />
+</div>
+```
+
+:::caution[関数をプロパティとして渡す]
+フレームワークコンポーネントに関数をプロパティとして渡せますが、それはサーバーレンダリングの間だけ機能します。もしこの関数をハイドレードされたコンポーネント（例えば、イベントハンドラーとして）で使用しようとするとエラーが発生します。
+
+これはAstroでは関数をシリアライズ（サーバーからクライアントへの転送）できないためです。
+:::
+
 
 ## フレームワークコンポーネントに子要素を渡す
 
@@ -173,7 +175,7 @@ SvelteとVueでは、これらのスロットは`<slot>`要素に`name`属性を
 
 ## フレームワークコンポーネントをネストさせる
 
-Astroファイルの中には、フレームワークコンポーネントの子もハイドレーションされたコンポーネントにできます。これは、フレームワークのどれからでも、コンポーネントを再帰的にネストできることを意味します。
+Astroファイルの中には、フレームワークコンポーネントの子要素もハイドレーションされたコンポーネントにできます。これは、フレームワークのどれからでも、コンポーネントを再帰的にネストできることを意味します。
 
 ```astro title="src/pages/nested-components.astro" {10-11}
 ---
diff --git a/src/content/docs/ru/guides/testing.mdx b/src/content/docs/ru/guides/testing.mdx
index 28d9d6d69cac8..5498cd20817c5 100644
--- a/src/content/docs/ru/guides/testing.mdx
+++ b/src/content/docs/ru/guides/testing.mdx
@@ -24,7 +24,7 @@ Playwright - фреймворк для end-to-end тестирования ве
 
 Вы можете начать и запускать ваши тесты, с помощью [VS Code расширения](https://playwright.dev/docs/getting-started-vscode).
 
-В качестве альтернативы, вы можете установить Playwright в свой Astro проект используя пакетный менеджер по вашему выбору. Следуйте инструкциям CLI, чтобы выбрать Javascript/Typescript, назвать свою папку с тестами, и добавить необязательный рабочий процесс в Github Actions.
+В качестве альтернативы, вы можете установить Playwright в свой Astro проект используя пакетный менеджер по вашему выбору. Следуйте инструкциям CLI, чтобы выбрать JavaScript/TypeScript, назвать свою папку с тестами, и добавить необязательный рабочий процесс в Github Actions.
 
 <PackageManagerTabs>
   <Fragment slot="npm">
diff --git a/src/content/docs/zh-cn/guides/troubleshooting.mdx b/src/content/docs/zh-cn/guides/troubleshooting.mdx
index fa3d8c41138a4..6bcf53cea614f 100644
--- a/src/content/docs/zh-cn/guides/troubleshooting.mdx
+++ b/src/content/docs/zh-cn/guides/troubleshooting.mdx
@@ -124,7 +124,7 @@ const myFeaturedPost = posts.find(post => post.file.includes(pathToMyFeaturedPos
 
 ### 和 Yarn 2+（Berry）一起使用 Astro
 
-Yarn 2+，又名 Berry，使用名叫 [Plug'n'Play (PnP)](https://yarnpkg.com/features/pnp) 的技术来存储和管理 Node 模块，这在使用 `create-astro` 初始化新 Astro 项目或在使用 Astro 工作时可能[导致问题](https://github.com/withastro/astro/issues/3450)。解决办法是在 `yarnrc.yml` 中将 [`nodeLinker` 属性](https://yarnpkg.com/configuration/yarnrc#nodeLinker)设置为 `node-modules`。
+Yarn 2+，又名 Berry，使用名叫 [Plug'n'Play (PnP)](https://yarnpkg.com/features/pnp) 的技术来存储和管理 Node 模块，这在使用 `create astro` 初始化新 Astro 项目或在使用 Astro 工作时可能[导致问题](https://github.com/withastro/astro/issues/3450)。解决办法是在 `yarnrc.yml` 中将 [`nodeLinker` 属性](https://yarnpkg.com/configuration/yarnrc#nodeLinker)设置为 `node-modules`。
 
 ```yaml
 nodeLinker: "node-modules"
diff --git a/src/content/docs/zh-cn/install/auto.mdx b/src/content/docs/zh-cn/install/auto.mdx
index 82610f4c70122..53671be779371 100644
--- a/src/content/docs/zh-cn/install/auto.mdx
+++ b/src/content/docs/zh-cn/install/auto.mdx
@@ -2,9 +2,13 @@
 title: 通过自动命令行来安装 Astro
 description: 如何通过 create-astro 命令行工具使用 NPM、PNPM 或 Yarn 安装 Astro。
 ---
-import InstallGuideTabGroup from '~/components/TabGroup/InstallGuideTabGroup.astro';
+import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro'
 
-准备好安装 Astro 了吗？跟着我们的自动化或手动设置教程来开始吧。
+准备好安装 Astro 了吗？按照本指南开始使用 `create astro` CLI。
+
+:::note[更喜欢手动安装 ASTRO？]
+请阅读我们的[分步手动安装指南](/zh-cn/install/manual/)。
+:::
 
 #### 前提准备
 
@@ -12,147 +16,123 @@ import InstallGuideTabGroup from '~/components/TabGroup/InstallGuideTabGroup.ast
 - **文本编辑器** - 我们建议使用安装有 [Astro 官方扩展](https://marketplace.visualstudio.com/items?itemName=astro-build.astro-vscode)的 [VS Code](https://code.visualstudio.com/)。
 - **终端（Terminal）** - Astro 可以通过其命令行界面 (CLI) 访问。
 
-<InstallGuideTabGroup />
-
 #### 安装
 
-`create-astro` 命令是从零开始一个全新的 Astro 项目最快、最简单的方法。
-
-## 1. 通过命令行（CLI）运行
-
-在终端内使用 `create-astro` 可以快速的启动安装向导。这将会在你运行该命令的目录下指引你一步步去创建第一个 Astro 项目。
-
-不需要事先创建新目录！向导将自动为你创建项目文件夹。
-```shell
-# npm
-npm create astro@latest
-
-# yarn
-yarn create astro
-
-# pnpm
-pnpm create astro@latest
-```
-
-根据你所使用的包管理器不同 ，你可能会收到要你确认安装 `create-astro@latest` 的提示。然后会要求你指定项目文件夹（例如：`./my-astro-site`），它将创建一个新的目录。
-### 选择入门模板
-
-你将看到可供你挑选的简短入门模板列表：
+`create astro` 是从头开始新 Astro 项目的最快方式。它将引导你完成设置新 Astro 项目的每一步。 它允许你从几个不同的官方入门模板中进行选择，你也可以[传递--template 参数来使用 GitHub 上的任何现有项目](#入门模板)。
+
+:::tip[在线预览]
+想要在浏览器中试用 Astro？ 访问 [astro.new](https://astro.new/) 浏览我们的入门模板并在不离开浏览器的情况下启动一个新的 Astro 项目。
+:::
+
+## 1. 运行安装向导
+
+在你的终端中运行以下命令以启动我们方便的安装向导：
+
+<PackageManagerTabs>
+  <Fragment slot="npm">
+  ```shell
+  # 使用 npm 创建一个新项目
+  npm create astro@latest
+  ```
+  </Fragment>
+  <Fragment slot="pnpm">
+  ```shell
+  # 使用 pnpm 创建一个新项目
+  pnpm create astro@latest
+  ```
+  </Fragment>
+  <Fragment slot="yarn">
+  ```shell
+  # 使用 yarn 创建一个新项目
+  yarn create astro
+  ```
+  </Fragment>
+</PackageManagerTabs>
+
+你可以在计算机上的任何位置运行 `create astro`，因此在开始之前无需为你的项目创建一个新的空目录。 如果你的新项目还没有空目录，该向导会帮你自动创建一个。
+
+如果一切顺利的话，在一些建议的后续步骤之后，你应该会看到 “Liftoff confirmed. Explore your project!” 。 `cd` 进入你的新项目目录以开始使用 Astro。
+
+如果你在 CLI 向导期间跳过了 `npm install` 步骤，请确保在继续之前安装你的依赖项。
+
+## 2. 启动 Astro ✨
+
+Astro 带有一个内置的开发服务器，拥有项目开发所需的一切。 `astro dev` 命令将启动一个本地开发服务器，这样你就可以第一次看到你的新网站正在运行。
+
+每个入门模板都带有一个预配置的脚本，可以为你运行 `astro dev`。 使用你最喜欢的包管理器运行此命令并启动 Astro 开发服务器。
+
+<PackageManagerTabs>
+  <Fragment slot="npm">
+  ```shell
+  npm run dev
+  ```
+  </Fragment>
+  <Fragment slot="pnpm">
+  ```shell
+  pnpm run dev
+  ```
+  </Fragment>
+  <Fragment slot="yarn">
+  ```shell
+  yarn run dev
+  ```
+  </Fragment>
+</PackageManagerTabs>
+
+
+如果一切顺利，Astro 现在应该可以在 [http://localhost:3000/](http://localhost:3000/) 上为你的项目提供服务了！
+
+Astro 将实时监听 `src/` 目录中的文件更改，因此你在开发过程中进行更改时无需重新启动服务器。
+
+如果你无法在浏览器中打开你的项目，请返回运行 `dev` 命令的终端并查看是否发生错误，或者检查你的项目的服务 URL 是否与​上方​链接的 URL 不同。
+
+## 入门模板
+
+你还可以通过将 `--template` 参数传递给 `create astro` 命令，基于[官方示例](https://github.com/withastro/astro/tree/main/examples)或者任何 GitHub 存储库的`main` 分支来启动一个新的 astro 项目。
+
+<PackageManagerTabs>
+  <Fragment slot="npm">
+  ```shell
+  # 使用官方示例创建一个新项目
+  npm create astro@latest -- --template <example-name>
+
+  # 基于某个 GitHub 仓库的 main 分支创建一个新项目
+  npm create astro@latest -- --template <github-username>/<github-repo>
+  ```
+  </Fragment>
+  <Fragment slot="pnpm">
+  ```shell
+  # 使用官方示例创建一个新项目
+  pnpm create astro@latest --template <example-name>
   
-- `Just the basics`：对于想要探索 Astro 的人而言，这是个很好的入门模板。
-- `Blog`、`Documentation`、 `Portfolio`：根据具体用例提供参考的模板。
-- `Completely empty`：仅供入门使用的最小模板。
-
-使用箭头键（向上和向下）导航到你要安装的模板，然后按回车（Enter）提交。
-
-> 💡 想在选择前先在浏览器中查看一下模板吗？[前往 astro.new](https://astro.new/)
-
-### 安装依赖（可选）
-
-向导将在此时提出运行 `install` 命令的交易，你可以选择现在安装或者等会自行安装。
-
-> ⚠️如果你此时不这样做，那么就需要在向导完成后，在开始运行项目前[安装依赖](#2-安装依赖)。
-
-### 安装任一官方 Astro 集成（可选）
-
-此时你可以选择添加任何[额外的 UI 框架](/zh-cn/core-concepts/framework-components/)（如 React、Svelte、Vue、Solid、Preact、Lit），然后再通过运行 `astro add --yes` 添加其他 Astro 官方集成（如 Tailwind、Partytown、Sitemap）。
-
-要怎么选择想要再项目中使用的 Astro 集成？使用方向键（向上和向下）导航，空格键在选定的状态之间切换。你可以一次选择多个项目，或者你可以不选择任何集成就直接仅进行下一步。
-
-当你对你的选择感到满意时，按回车（Enter）提交。
-
-> 这些集成以及其他的 [Astro 社区集成](https://astro.build/integrations)，在日后也可以按照我们的[集成指南](/zh-cn/guides/integrations-guide/)所写的另行添加。
-
-在选完要添加的集成后，你应该看到类似下方的终端信息，告知你 `create-astro` 将对项目中的 `astro.config.mjs` 进行改变。
-
-```bash
-Astro will make the following changes to your config file:
-```
-
-看到这条消息意味着你所选择的集成已经成功添加到你的项目配置中。(如果没有的话，你可以稍后手动添加它们）。
-
-### 初始化 .git 仓库（可选）
-
-在这最后一步，你可以选择在你的新目录下初始化 git 仓库。你可以随意选择是否要初始化，但如果你打算在项目中使用 [Git](https://git-scm.com/) 工具的话这就大有脾益。
-
-### 下一步
-
-当 `create-astro` 安装向导执行完毕后，你应该在屏幕上看到一些建议性说明（"Next Steps"），这些说明将帮助你完成设置并开始新项目。
-
-
-## 2. 安装依赖
-
-如果你没有跟随向导安装项目依赖，现在你就需要使用喜欢的包管理器来安装依赖。
-
-```bash
-# npm
-npm install
-
-# yarn
-yarn
-
-# pnpm
-pnpm install
-
-```
-
-如果你打算在项目内使用 [Git](https://git-scm.com/)，直接在项目根目录运行 `git init` 即可。
-
-
-## 3. 开始使用 Astro ✨
-
-在大部分项目开发中使用 Astro 的内置开发服务器都可以来完成开发。这将演示怎样在本地开发环境中运行你的项目。
-
-首先，使用包管理器运行预置的启动脚本：
-
-```bash
-# npm
-npm start
-
-# yarn
-yarn start
-
-# pnpm
-pnpm run start
-```
-
-如果一切都正常，Astro 将会在 [http://localhost:3000](http://localhost:3000) 运行你的项目！
-
-
-Astro 将实时监听 `src/` 目录下的文件更改，所以在开发过程中，如果你做了修改，不需去重启服务。
-
-
-如果你无法在浏览器中正常打开你的项目，返回运行 `start` 命令的终端内看看有没有什么错误提示。
-
-
-## 4. 部署到网络
-
-是时候去部署你的项目到互联网了！在你的项目内运行 `build` 命令就可以在项目的 `dist/` 目录内生成部署所需的所有静态文件。
-
-
-```bash
-# npm
-npm run build
-
-# yarn
-yarn build
-
-# pnpm
-pnpm run build
-```
+  # 基于某个 GitHub 仓库的 main 分支创建一个新项目
+  pnpm create astro@latest --template <github-username>/<github-repo>
+  ```
+  </Fragment>
+  <Fragment slot="yarn">
+  ```shell
+  # 使用官方示例创建一个新项目
+  yarn create astro --template <example-name>
+  
+  # 基于某个 GitHub 仓库的 main 分支创建一个新项目
+  yarn create astro --template <github-username>/<github-repo>
+  ```
+  </Fragment>
+</PackageManagerTabs>
 
-当命令运行结束，在项目目录内你可以看到名为 `dist/` 的新目录，现在你可以直接把它部署到你喜欢的网络服务器上了。
+默认情况下，此命令将使用模板仓库的`main`分支。要使用不同的分支，请将其作为 `--template` 参数的一部分传递：`<github-username>/<github-repo>#<branch>`。
 
-想开始免费托管你的网页，可以考虑下我们的骄傲的托管合作伙伴，例如 [Netlify](https://www.netlify.com/)。获取更多的部署说明，请查阅我们的[部署文档](/zh-cn/guides/deploy/)。
+探索我们的[主题和入门展示](https://astro.build/themes/)，你可以在其中浏览博客、个人作品集、文档、落地页等主题！ 或者，[在 GitHub 上搜索](https://github.com/search?o=desc&q=astro+starter&s=stars&type=Repositories)更多入门项目。
 
 
 ## 接下来...
 
-好了！你现在已经准备好开始进行开发了！
+好了！你现在可以开始使用 Astro 进行构建了！ 🥳
 
-📚到[项目结构](/zh-cn/core-concepts/project-structure/)章节学习更多关于 Astro 的项目结构的内容。
+以下是我们建议接下来探索的几个主题。 你可以按任何顺序阅读它们。 你甚至可以暂时离开我们的文档，然后去玩你的新 Astro 项目代码库，遇到麻烦或有疑问时返回这里。
 
-📚到[组件](/zh-cn/core-concepts/astro-components/)章节学习关于 Astro 组件语法的内容。
+📚 **添加框架**：在我们的[集成指南](/zh-cn/guides/integrations-guide/)中学习如何使用 `npx astro add` 扩展 Astro 以支持 React、Svelte、Tailwind 等。
 
-📚 到[页面](/zh-cn/core-concepts/astro-pages/)章节学习关于 Astro 基于文件的路由的相关知识。
+📚 **部署你的网站**：在我们的[部署指南](/zh-cn/guides/deploy/)中了解如何构建 Astro 项目并将其部署到网络。
 
+📚 **了解你的代码库**：在我们的[项目结构指南](/zh-cn/core-concepts/project-structure/)中了解更多关于 Astro 项目结构的信息。
diff --git a/src/content/docs/zh-cn/install/manual.mdx b/src/content/docs/zh-cn/install/manual.mdx
index b692f7e6f8be7..4c7d3d88ff522 100644
--- a/src/content/docs/zh-cn/install/manual.mdx
+++ b/src/content/docs/zh-cn/install/manual.mdx
@@ -2,9 +2,15 @@
 title: 手动安装 Astro
 description: 如何通过 NPM、PNPM 或 Yarn 来手动安装 Astro。
 ---
-import InstallGuideTabGroup from '~/components/TabGroup/InstallGuideTabGroup.astro';
+import Button from '~/components/Button.astro'
+import FileTree from '~/components/FileTree.astro';
+import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro'
 
-准备好安装 Astro 了？跟着我们的自动化或手动设置教程来开始吧。
+如果你不想使用[自动化 CLI 工具](/zh-cn/install/auto/)，本指南将引导你完成手动安装和配置新 Astro 项目的步骤。
+
+#### 喜欢更快的入门方式？
+
+<Button href="/zh-cn/install/auto/">尝试 create astro CLI 向导 →</Button>
 
 #### 前提准备
 
@@ -12,15 +18,13 @@ import InstallGuideTabGroup from '~/components/TabGroup/InstallGuideTabGroup.ast
 - **文本编辑器** - 我们建议使用安装有 [Astro 官方扩展](https://marketplace.visualstudio.com/items?itemName=astro-build.astro-vscode)的 [VS Code](https://code.visualstudio.com/)。
 - **终端（Terminal）** - Astro 可以通过其命令行界面 (CLI) 访问。
 
-<InstallGuideTabGroup />
-
 #### 安装
 
-如果你不打算使用 `create-astro` 命令工具来自动化创建项目，你可以根据以下说明来自行设置你的项目。
+如果你不打算使用 `create astro` 命令工具来自动化创建项目，你可以根据以下说明来自行设置你的项目。
 
 ## 1. 创建项目目录
 
-创建一个目录，目录名称是你打算使用的项目名称，并导航到该目录。
+创建一个空目录，目录名称是你打算使用的项目名称，并导航到该目录。
 
 ```bash
 mkdir my-astro-project
@@ -29,27 +33,55 @@ cd my-astro-project
 
 在该目录内，创建 `package.json` 文件，该文件将管理你的项目依赖，包括 Astro，如果你不熟悉这种文件格式，可以运行下面的命令来直接创建一个。
 
-```bash
-npm init --yes
-```
+<PackageManagerTabs>
+  <Fragment slot="npm">
+  ```shell
+  npm init --yes
+  ```
+  </Fragment>
+  <Fragment slot="pnpm">
+  ```shell
+  pnpm init 
+  ```
+  </Fragment>
+  <Fragment slot="yarn">
+  ```shell
+  yarn init --yes
+  ```
+  </Fragment>
+</PackageManagerTabs>
 
 ## 2. 安装 Astro
 
 首先，需要在你的项目目录内安装 Astro 的项目依赖。
 
-```bash
-npm install astro
-```
+<PackageManagerTabs>
+  <Fragment slot="npm">
+  ```shell
+  npm install astro
+  ```
+  </Fragment>
+  <Fragment slot="pnpm">
+  ```shell
+  pnpm install astro 
+  ```
+  </Fragment>
+  <Fragment slot="yarn">
+  ```shell
+  yarn add astro
+  ```
+  </Fragment>
+</PackageManagerTabs>
 
 然后，使用下面的代码来替换 `package.json` 文件的 `scripts` 部分内容：
 
-```diff
-  "scripts": \{
--    "test": "echo \"Error: no test specified\" && exit 1"
-+    "dev": "astro dev",
-+    "start": "astro dev",
-+    "build": "astro build",
-+    "preview": "astro preview"
+```json title="package.json" del={2} ins={3-6}
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1",
+    "dev": "astro dev",
+    "start": "astro dev",
+    "build": "astro build",
+    "preview": "astro preview"
   },
 ```
 
@@ -89,7 +121,7 @@ console.log('它运行在终端而非浏览器！');
 
 针对该教程，复制并粘贴以下内容至 `robots.txt` 内：
 
-```
+```diff title="public/robots.txt"
 # 示例：运行所有爬虫抓取并索引你的站点。
 # 全部语法：https://developers.google.com/search/docs/advanced/robots/create-robots-txt
 User-agent: *
@@ -98,11 +130,11 @@ Allow: /
 
 ## 5. 创建 `astro.config.mjs` 配置文件
 
-Astro 使用 `astro.config.mjs` 来配置项目。这个文件是可选的，您可以选择不配置它，但还是希望你现在创建该文件。
+Astro 使用 `astro.config.mjs` 来配置项目。这个文件是可选的，你可以选择不配置它，但还是希望你现在创建该文件。
 
 在你的项目根目录创建 `astro.config.mjs` 文件，并复制粘贴下面的内容至该文件内：
 
-```
+```js title="astro.config.mjs"
 import { defineConfig } from 'astro/config';
 
 // https://astro.build/config
@@ -112,26 +144,49 @@ export default defineConfig({});
 如果你想集成像 React、Svelte 这样的[UI 框架组件](/zh-cn/core-concepts/framework-components/)或是使用其他类似 Tailwind 或 Partytown 这样的工具，你可以在[手动导入并配置集成](/zh-cn/guides/integrations-guide/)章节内获取更多信息。
 
 
-📚 阅读Astro的[API配置引用](/zh-cn/reference/configuration-reference/)章节可以获得更多内容。
+📚 阅 读Astro 的[API配置参考](/zh-cn/reference/configuration-reference/)章节可以获得更多内容。
 
+## 6. 添加 TypeScript 支持
 
-## 6. 接下来
+TypeScript 使用`tsconfig.json`进行配置。即使你不编写 TypeScript 代码，这个文件也很重要，因为 Astro 和 VS Code 等工具知道如何理解你的项目。 如果没有 `tsconfig.json` 文件，编辑器将不完全支持某些功能（如 npm 包导入）。
 
-如果你按上述一步步操作，你的项目目录应该看上去像是这样：
+如果你打算编写 TypeScript 代码，建议使用 Astro 的`strict`或`strictest`的模板。 你可以在 [astro/tsconfigs/](https://github.com/withastro/astro/blob/main/packages/astro/tsconfigs/) 查看和比较三个模板配置。
+
+在项目的根目录创建 `tsconfig.json`，并将下面的代码复制到其中。（你可以为 TypeScript 模板使用 `base`、`strict` 或 `strictest`）：
 
+```json title="tsconfig.json" "base"
+{
+  "extends": "astro/tsconfigs/base",
+}
 ```
-├── node_modules/
-├── src/
-│   └── pages/
-│   │   └── index.astro
-├── public/
-│   ├── robots.txt
-├── astro.config.mjs
-├── package.json
-└── package-lock.json (or: yarn.lock, pnpm-lock.yaml, etc.)
+
+最后，创建`src/env.d.ts`让 TypeScript 知道 Astro 项目中可用的环境类型：
+
+```ts title="src/env.d.ts"
+/// <reference types="astro/client" />
 ```
 
+📚 阅读 Astro 的 [TypeScript 设置指南](/zh-cn/guides/typescript/#设置)以获取更多信息。
+
+## 7. 接下来
+
+如果你按上述一步步操作，你的项目目录应该看上去像是这样：
+
+<FileTree>
+- node_modules/
+- public/
+  - robots.txt
+- src/
+  - pages/
+    - index.astro
+  - env.d.ts
+- astro.config.mjs
+- package-lock.json 或者 `yarn.lock`，`pnpm-lock.yaml`，等等。
+- package.json
+- tsconfig.json
+</FileTree>
+
 祝贺你，你现在可以使用 Astro 了！
 
-如果你完成了这个指南的全部内容，你可以跳转至[步骤 3：开始](/zh-cn/install/auto/#3-开始使用-astro-)继续并学习首次该怎样运行 Astro.
+如果你完成了这个指南的全部内容，你可以跳转至[步骤 2：启动 Astro](/zh-cn/install/auto/#2-启动-astro-)继续并学习如何首次运行 Astro。
 
diff --git a/src/content/docs/zh-cn/reference/api-reference.mdx b/src/content/docs/zh-cn/reference/api-reference.mdx
index 072f3ba121a0d..93a7f840a6a2b 100644
--- a/src/content/docs/zh-cn/reference/api-reference.mdx
+++ b/src/content/docs/zh-cn/reference/api-reference.mdx
@@ -105,7 +105,7 @@ import Heading from '../components/Heading.astro';
 
 📚 进一步了解 [Markdown 和 MDX 布局](/zh-cn/guides/markdown-content/#markdown-布局)如何处理道具。
 
-📚 了解如何为你的道具添加 [Typescript 类型定义](/zh-cn/guides/typescript/#组件参数)。
+📚 了解如何为你的道具添加 [TypeScript 类型定义](/zh-cn/guides/typescript/#组件参数)。
 
 #### Astro 文件
 
diff --git a/src/data/logos.ts b/src/data/logos.ts
index 5314afa23f3bd..c51307c6c65b8 100644
--- a/src/data/logos.ts
+++ b/src/data/logos.ts
@@ -43,6 +43,7 @@ export const logos = LogoCheck({
 	directus: { file: 'directus.svg', padding: '0 .1em' },
 	ghost: { file: 'ghost.png', padding: '.125em' },
 	'netlify-cms': { file: 'netlify-cms.svg', padding: '.1625em' },
+	'tina-cms': { file: 'tina-cms.svg', padding: '.15em' },
 	payload: { file: 'payload.svg', padding: '.3em .25em .3em .3em' },
 	prismic: { file: 'prismic.svg', padding: '.25em' },
 	sanity: { file: 'sanity.svg', padding: '0 .1em' },
diff --git a/src/i18n/en/ui.ts b/src/i18n/en/ui.ts
index d4b07922d12f8..7686580ec40c7 100644
--- a/src/i18n/en/ui.ts
+++ b/src/i18n/en/ui.ts
@@ -66,6 +66,10 @@ export default {
 	'aside.tip': 'Tip',
 	'aside.caution': 'Caution',
 	'aside.danger': 'Danger',
+	// `<CodeSnippet>` vocabulary
+	'codeSnippet.terminalCaption': 'Terminal window',
+	// `<LanguageSelect>` vocabulary
+	'languageSelect.label': 'Select language',
 	// Integrations vocabulary
 	'integrations.changelog': 'Changelog',
 	'integrations.footerTitle': 'More Integrations',
diff --git a/src/i18n/fr/nav.ts b/src/i18n/fr/nav.ts
index e8cae58db97c1..c75ed6c322589 100644
--- a/src/i18n/fr/nav.ts
+++ b/src/i18n/fr/nav.ts
@@ -40,6 +40,7 @@ export default NavDictionary({
 	'guides/rss': 'Flux RSS',
 	'guides/testing': 'Test',
 	'guides/server-side-rendering': 'Rendu côté serveur (SSR)',
+	'guides/cms': 'Utiliser un CMS avec Astro',
 	'guides/typescript': 'TypeScript',
 	'core-concepts/framework-components': 'Composants de Frameworks',
 
diff --git a/src/pages/open-graph/[...path].ts b/src/pages/open-graph/[...path].ts
index 91ceabdc286af..497a9797d9e20 100644
--- a/src/pages/open-graph/[...path].ts
+++ b/src/pages/open-graph/[...path].ts
@@ -38,6 +38,7 @@ export const { getStaticPaths, get } = OGImageRoute({
 						'Noto Sans SC Black',
 						'Noto Sans TC Black',
 						'Noto Sans JP Black',
+						'Noto Sans KR Black',
 					],
 					weight: 'ExtraBold',
 				},
@@ -51,6 +52,7 @@ export const { getStaticPaths, get } = OGImageRoute({
 						'Noto Sans SC',
 						'Noto Sans TC',
 						'Noto Sans JP',
+						'Noto Sans KR',
 					],
 					weight: 'Normal',
 				},
@@ -73,6 +75,9 @@ export const { getStaticPaths, get } = OGImageRoute({
 
 				'https://api.fontsource.org/v1/fonts/noto-sans-arabic/arabic-400-normal.ttf',
 				'https://api.fontsource.org/v1/fonts/noto-sans-arabic/arabic-800-normal.ttf',
+
+				'https://api.fontsource.org/v1/fonts/noto-sans-kr/korean-400-normal.ttf',
+				'https://api.fontsource.org/v1/fonts/noto-sans-kr/korean-900-normal.ttf',
 			],
 		};
 	},