+
+実験的な[`clientPrerender`](/ja/reference/experimental-flags/client-prerender/)フラグを有効にすると、`prefetch()`の`eagerness`オプションを使用して、リンク先をどの程度積極的にプリフェッチまたはプリレンダリングするかをブラウザに提案できます。
+
+このオプションは[Speculation Rules API](https://developer.mozilla.org/ja/docs/Web/HTML/Element/script/type/speculationrules#eagerness)で説明されているものと同じAPIに従い、デフォルトはもっとも積極的な`immediate`です。積極度の高い順に、ほかの選択肢は`eager`、`moderate`、`conservative`です。
+
+`eagerness`オプションを使用すると、待ち時間を短縮するメリットと、サイト訪問者の帯域幅、メモリ、CPUのコストとのバランスを調整できます。Chromeなど一部のブラウザには、[過剰な投機的読み込み（リンクをプリレンダリングまたはプリフェッチしすぎること）を防ぐための制限](https://developer.chrome.com/blog/speculation-rules-improvements#chrome-limits)があります。
+
+```astro
+---
+---
+
+```
+
+多くのリンクをプログラムから`prefetch()`する場合は、`eagerness: 'moderate'`を設定できます。[先入れ先出し（FIFO）](https://ja.wikipedia.org/wiki/FIFO)方式とブラウザのヒューリスティックを活用し、どのリンクをどの順序でプリレンダリングまたはプリフェッチするかをブラウザに判断させられます。
+
+```astro "{eagerness: 'moderate'}"
+A Nice Link 1
+A Nice Link 2
+A Nice Link 3
+A Nice Link 4
+...
+A Nice Link 20
+
+
+```
+
+ブラウザのAPIに依存しているため、クライアント側で`prefetch()`だけをインポートするようにしてください。
+
+## ビュートランジションとともに使用する
+
+ページで[Astroの``](/ja/guides/view-transitions/#ビュートランジションspaモードを有効にする)を使用すると、プリフェッチもデフォルトで有効になります。`{ prefetchAll: true }`がデフォルトで設定され、ページ内の[すべてのリンクに対するプリフェッチ](#すべてのリンクをデフォルトでプリフェッチする)が有効になります。
+
+デフォルトを上書きするには、`astro.config.mjs`内のプリフェッチ設定をカスタマイズできます。たとえば、次のように設定します。
+
+```js title="astro.config.mjs"
+import { defineConfig } from 'astro/config';
+
+export default defineConfig({
+ // プリフェッチを完全に無効化する
+ prefetch: false
+});
+```
+
+```js title="astro.config.mjs"
+import { defineConfig } from 'astro/config';
+
+export default defineConfig({
+ // プリフェッチは維持するが、`data-astro-prefetch`があるリンクのみをプリフェッチする。
+ prefetch: {
+ prefetchAll: false
+ }
+});
+```
+
+## ブラウザサポート
+
+Astroのプリフェッチは、ブラウザがサポートしている場合は[``](https://developer.mozilla.org/ja/docs/Web/HTML/Attributes/rel/prefetch)を使用し、サポートしていない場合は[`fetch()` API](https://developer.mozilla.org/ja/docs/Web/API/Fetch_API)にフォールバックします。
+
+主要なブラウザはAstroのプリフェッチをサポートしていますが、動作には若干の違いがあります。
+
+### Chrome
+
+Chromeは``をサポートしており、プリフェッチは意図どおりに動作します。
+
+また、[Speculation Rules API](https://developer.mozilla.org/ja/docs/Web/API/Speculation_Rules_API)の`
+```
+
+`src/pages/dashboard.astro` verificará o cookie de sessão do usuário usando o aplicativo de servidor do Firebase. Se o usuário não estiver autenticado, a página redirecionará o usuário para a página `/entrar`.
+
+A página de exemplo abaixo exibe o nome do usuário e um botão para sair. Clicar no botão enviará uma requisição `GET` para o endpoint `/api/auth/sair`.
+
+O endpoint excluirá o cookie de sessão do usuário e redirecionará o usuário para a página `/entrar`.
+
+```astro title="src/pages/dashboard.astro"
+---
+import { app } from "../firebase/server";
+import { getAuth } from "firebase-admin/auth";
+import Layout from "../layouts/Layout.astro";
+
+const auth = getAuth(app);
+
+/* Verificar sessão atual */
+if (!Astro.cookies.has("__session")) {
+ return Astro.redirect("/entrar");
+}
+const cookieSessao = Astro.cookies.get("__session")!.value;
+const cookieDecodificado = await auth.verifySessionCookie(cookieSessao);
+const usuario = await auth.getUser(cookieDecodificado.uid);
+
+if (!usuario) {
+ return Astro.redirect("/entrar");
+}
+---
+
+
+
Bem-vindo(a) {usuario.displayName}
+
Ficamos felizes em ver você aqui
+
+
+```
+
+### Adicionando provedores OAuth
+
+Para adicionar provedores OAuth ao seu aplicativo, você precisa ativá-los no console do Firebase.
+
+No console do Firebase, vá para a seção **Authentication** e clique na aba **Método de login**. Em seguida, clique no botão **Adicionar novo fornecedor** e ative os provedores que deseja usar.
+
+O exemplo abaixo usa o provedor do **Google**.
+
+Edite a página `entrar.astro` para adicionar:
+- um botão para entrar com o Google abaixo do formulário existente
+- um ouvinte de evento no botão para manipular o processo de login no `
+```
+
+Quando clicado, o botão de entrar com o Google abrirá uma janela pop-up para fazer login com o Google. Assim que o usuário entrar, ele enviará uma requisição `POST` para o endpoint `/api/auth/entrar` com o token de ID gerado pelo provedor OAuth.
+
+O endpoint verificará o token de ID e criará um novo cookie de sessão para o usuário. Em seguida, o endpoint redirecionará o usuário para a página `/dashboard`.
+
+## Conectando ao banco de dados Firestore
+
+### Pré-requisitos
+
+- Um projeto Astro inicializado com o Firebase conforme descrito na seção [Inicializando o Firebase no Astro](#inicializando-o-firebase-no-astro).
+
+- Um projeto Firebase com um banco de dados Firestore. Você pode seguir a [documentação do Firebase para criar um novo projeto e configurar um banco de dados Firestore](https://firebase.google.com/docs/firestore/quickstart?hl=pt-br).
+
+Nesta receita, a coleção do Firestore será chamada de **amigos** e conterá documentos com os seguintes campos:
+
+- `id`: gerado automaticamente pelo Firestore
+- `nome`: um campo do tipo string
+- `idade`: um campo do tipo number
+- `eMelhorAmigo`: um campo do tipo boolean
+
+### Criando os endpoints do servidor
+
+Crie dois novos arquivos em um novo diretório `src/pages/api/amigos/`: `index.ts` e `[id].ts`. Eles criarão dois endpoints de servidor para interagir com o banco de dados Firestore das seguintes maneiras:
+
+- `POST /api/amigos`: para criar um novo documento na coleção de amigos.
+- `POST /api/amigos/:id`: para atualizar um documento na coleção de amigos.
+- `DELETE /api/amigos/:id`: para excluir um documento na coleção de amigos.
+
+`index.ts` conterá o código para criar um novo documento na coleção de amigos:
+
+```ts title="src/pages/api/amigos/index.ts"
+import type { APIRoute } from "astro";
+import { app } from "../../../firebase/server";
+import { getFirestore } from "firebase-admin/firestore";
+
+export const POST: APIRoute = async ({ request, redirect }) => {
+ const dadosFormulario = await request.formData();
+ const nome = dadosFormulario.get("nome")?.toString();
+ const idade = dadosFormulario.get("idade")?.toString();
+ const eMelhorAmigo = dadosFormulario.get("eMelhorAmigo") === "on";
+
+ if (!nome || !idade) {
+ return new Response("Campos obrigatórios ausentes", {
+ status: 400,
+ });
+ }
+ try {
+ const bd = getFirestore(app);
+ const refAmigos = bd.collection("amigos");
+ await refAmigos.add({
+ nome,
+ idade: parseInt(idade),
+ eMelhorAmigo,
+ });
+ } catch (erro) {
+ return new Response("Ocorreu um erro", {
+ status: 500,
+ });
+ }
+ return redirect("/dashboard");
+};
+```
+
+:::note
+Esta é uma implementação básica do endpoint `amigos`. Você pode adicionar mais lógica a este endpoint para atender às suas necessidades.
+:::
+
+`[id].ts` conterá o código para atualizar e excluir um documento na coleção de amigos:
+
+```ts title="src/pages/api/amigos/[id].ts"
+import type { APIRoute } from "astro";
+import { app } from "../../../firebase/server";
+import { getFirestore } from "firebase-admin/firestore";
+
+const bd = getFirestore(app);
+const refAmigos = bd.collection("amigos");
+
+export const POST: APIRoute = async ({ params, redirect, request }) => {
+ const dadosFormulario = await request.formData();
+ const nome = dadosFormulario.get("nome")?.toString();
+ const idade = dadosFormulario.get("idade")?.toString();
+ const eMelhorAmigo = dadosFormulario.get("eMelhorAmigo") === "on";
+
+ if (!nome || !idade) {
+ return new Response("Campos obrigatórios ausentes", {
+ status: 400,
+ });
+ }
+
+ if (!params.id) {
+ return new Response("Amigo não encontrado", {
+ status: 404,
+ });
+ }
+
+ try {
+ await refAmigos.doc(params.id).update({
+ nome,
+ idade: parseInt(idade),
+ eMelhorAmigo,
+ });
+ } catch (erro) {
+ return new Response("Ocorreu um erro", {
+ status: 500,
+ });
+ }
+ return redirect("/dashboard");
+};
+
+export const DELETE: APIRoute = async ({ params, redirect }) => {
+ if (!params.id) {
+ return new Response("Amigo não encontrado", {
+ status: 404,
+ });
+ }
+
+ try {
+ await refAmigos.doc(params.id).delete();
+ } catch (erro) {
+ return new Response("Ocorreu um erro", {
+ status: 500,
+ });
+ }
+ return redirect("/dashboard");
+};
+```
+
+:::note
+Esta é uma implementação básica do endpoint `amigos/:id`. Você pode adicionar mais lógica a este endpoint para atender às suas necessidades.
+:::
+
+Após criar os endpoints de servidor para o Firestore, o diretório do seu projeto agora deve incluir estes novos arquivos:
+
+
+- src
+ - env.d.ts
+ - firebase
+ - client.ts
+ - server.ts
+ - pages
+ - api
+ - amigos
+ - **index.ts**
+ - **[id].ts**
+- .env
+- astro.config.mjs
+- package.json
+
+
+### Criando páginas
+
+Crie as páginas que usarão os endpoints do Firestore:
+
+- `src/pages/adicionar.astro` - conterá um formulário para adicionar um novo amigo.
+- `src/pages/editar/[id].astro` - conterá um formulário para editar um amigo e um botão para excluir um amigo.
+- `src/pages/amigo/[id].astro` - conterá os detalhes de um amigo.
+- `src/pages/dashboard.astro` - exibirá uma lista de amigos.
+
+#### Adicionar um novo registro
+
+O exemplo `src/pages/adicionar.astro` abaixo inclui um formulário que enviará uma requisição `POST` para o endpoint `/api/amigos`. Este endpoint criará um novo amigo usando os dados do formulário e então redirecionará o usuário para a página `/dashboard`.
+
+```astro title="src/pages/adicionar.astro"
+---
+import Layout from "../layouts/Layout.astro";
+---
+
+
+
Adicionar um novo amigo
+
+
+```
+
+#### Editar ou Excluir um registro
+
+`src/pages/editar/[id].astro` conterá um formulário para editar os dados de um amigo e um botão para excluir um amigo. Ao enviar, esta página enviará uma requisição `POST` para o endpoint `/api/amigos/:id` para atualizar os dados de um amigo.
+
+Se o usuário clicar no botão de excluir, esta página enviará uma requisição `DELETE` para o endpoint `/api/amigos/:id` para excluir o amigo.
+
+```astro title="src/pages/editar/[id].astro"
+---
+import Layout from "../../layouts/Layout.astro";
+import { app } from "../../firebase/server";
+import { getFirestore } from "firebase-admin/firestore";
+
+interface Amigo {
+ name: string;
+ idade: number;
+ eMelhorAmigo: boolean;
+}
+
+const { id } = Astro.params;
+
+if (!id) {
+ return Astro.redirect("/404");
+}
+
+const bd = getFirestore(app);
+const refAmigos = bd.collection("amigos");
+const snapshotAmigo = await refAmigos.doc(id).get();
+
+if (!snapshotAmigo.exists) {
+ return Astro.redirect("/404");
+}
+
+const amigo = snapshotAmigo.data() as Amigo;
+---
+
+
+
Editar {amigo.nome}
+
Aqui você pode editar ou excluir os dados do seu amigo.
É melhor amigo: {amigo.eMelhorAmigo ? "Sim" : "Não"}
+
+```
+
+#### Exibir uma lista de registros com um botão de edição
+
+Por fim, `src/pages/dashboard.astro` exibirá uma lista de amigos. Cada amigo terá um link para a página de detalhes e um botão de edição que redirecionará o usuário para a página de edição.
+
+```astro title="src/pages/dashboard.astro"
+---
+import { app } from "../firebase/server";
+import { getFirestore } from "firebase-admin/firestore";
+import Layout from "../layouts/Layout.astro";
+
+interface Amigo {
+ id: string;
+ nome: string;
+ idade: number;
+ eMelhorAmigo: boolean;
+}
+
+const bd = getFirestore(app);
+const refAmigos = bd.collection("amigos");
+const amigosSnapshot = await refAmigos.get();
+const amigos = amigosSnapshot.docs.map((doc) => ({
+ id: doc.id,
+ ...doc.data(),
+})) as Amigo[];
+---
+
+
+
+
+
+```
+
+Após criar todas as páginas, você deve ter a seguinte estrutura de arquivos:
+
+
+- src
+ - env.d.ts
+ - firebase
+ - client.ts
+ - server.ts
+ - pages
+ - dashboard.astro
+ - adicionar.astro
+ - editar
+ - [id].astro
+ - amigo
+ - [id].astro
+ - api
+ - amigos
+ - index.ts
+ - [id].ts
+- .env
+- astro.config.mjs
+- package.json
+
+
+## Recursos da Comunidade
+
+- [Exemplo de app SSR com Astro e Firebase](https://github.com/kevinzunigacuellar/astro-firebase)
+- [Usando Firebase Realtime Database no Astro com Vue: Um Guia Passo a Passo](https://www.launchfa.st/blog/vue-astro-firebase-realtime-database)
diff --git a/src/content/docs/pt-br/guides/backend/prisma-postgres.mdx b/src/content/docs/pt-br/guides/backend/prisma-postgres.mdx
new file mode 100644
index 0000000000000..8ca3d91d0c2c3
--- /dev/null
+++ b/src/content/docs/pt-br/guides/backend/prisma-postgres.mdx
@@ -0,0 +1,191 @@
+---
+title: Prisma Postgres & Astro
+description: Adicione um banco de dados Postgres serverless ao seu projeto Astro com o Prisma Postgres
+sidebar:
+ label: Prisma Postgres
+type: backend
+logo: 'prisma-postgres'
+stub: false
+i18nReady: true
+---
+
+import ReadMore from '~/components/ReadMore.astro';
+
+[Prisma Postgres](https://www.prisma.io/) é um banco de dados Postgres totalmente gerenciado e serverless construído para aplicativos web modernos.
+
+## Conectar com o Prisma ORM (Recomendado)
+
+O [Prisma ORM](https://www.prisma.io/orm) é a forma recomendada de se conectar ao seu banco de dados Prisma Postgres. Ele oferece consultas com segurança de tipos (type-safe), migrações e desempenho global.
+
+### Pré-requisitos
+- Um projeto Astro com um adaptador instalado para ativar a [renderização sob demanda (SSR)](/pt-br/guides/on-demand-rendering/).
+
+### Instalar dependências e inicializar o Prisma
+
+Execute os seguintes comandos para instalar as dependências necessárias do Prisma:
+
+```bash
+npm install prisma tsx --save-dev
+npm install @prisma/adapter-pg @prisma/client
+```
+
+Uma vez instalado, inicialize o Prisma no seu projeto com o seguinte comando:
+
+```bash
+npx prisma init --db --output ./generated
+```
+
+Você precisará responder a algumas perguntas ao configurar seu banco de dados Prisma Postgres. Selecione a região mais próxima da sua localização e um nome memorável para o seu banco de dados, como "Meu Projeto Astro".
+
+Isso criará:
+- Um diretório `prisma/` com um arquivo `schema.prisma`
+- Um arquivo `.env` com a variável `DATABASE_URL` já configurada
+
+### Definir um Modelo
+
+Mesmo se você não precisar de modelos de dados específicos ainda, o Prisma requer pelo menos um modelo no schema para gerar um cliente e aplicar migrações.
+
+O exemplo a seguir define um modelo `Postagem` como modelo provisório. Adicione o modelo ao seu schema para começar. Você pode excluí-lo ou substituí-lo com segurança mais tarde por modelos que reflitam seus dados reais.
+
+```prisma title="prisma/schema.prisma" ins={11-16}
+generator client {
+ provider = "prisma-client"
+ output = "./generated"
+}
+
+datasource db {
+ provider = "postgresql"
+ url = env("DATABASE_URL")
+}
+
+model Postagem {
+ id Int @id @default(autoincrement())
+ titulo String
+ conteudo String?
+ publicada Boolean @default(false)
+}
+```
+
+Saiba mais sobre como configurar a sua instalação do Prisma ORM na [referência do schema do Prisma](https://www.prisma.io/docs/concepts/components/prisma-schema).
+
+### Gerar cliente
+
+Execute o seguinte comando para gerar o Prisma Client a partir do seu schema:
+
+```bash
+npx prisma generate
+```
+
+### Gerar arquivos de migração
+
+Execute o seguinte comando para criar as tabelas do banco de dados e gerar o Prisma Client a partir do seu schema. Isso também criará um diretório `prisma/migrations/` com arquivos do histórico de migrações.
+
+```bash
+npx prisma migrate dev --name init
+```
+
+### Criar um Prisma Client
+
+Dentro de `/src/lib`, crie um arquivo `prisma.ts`. Este arquivo inicializará e exportará a instância do seu Prisma Client para que você possa consultar seu banco de dados em todo o seu projeto Astro.
+
+```typescript title="src/lib/prisma.ts"
+import { PrismaPg } from '@prisma/adapter-pg';
+import { PrismaClient } from '../../prisma/generated/client';
+
+const stringConexao = import.meta.env.DATABASE_URL;
+const adaptador = new PrismaPg({ connectionString: stringConexao });
+const prisma = new PrismaClient({ adapter: adaptador });
+
+export default prisma;
+```
+
+### Consultando e exibindo dados
+
+O exemplo a seguir mostra a busca apenas das suas postagens publicadas com o Prisma Client ordenadas por `id`, e então exibindo os títulos e o conteúdo da postagem no seu modelo do Astro:
+
+```astro title="src/pages/postagens.astro" {2, 4-7}
+---
+import prisma from '../lib/prisma';
+
+const postagens = await prisma.post.findMany({
+ where: { publicado: true },
+ orderBy: { id: 'desc' }
+});
+---
+
+
+
+ Postagens Publicadas
+
+
+
Postagens Publicadas
+
+ {postagens.map((post) => (
+
+
{post.titulo}
+ {post.conteudo &&
{post.conteudo}
}
+
+ ))}
+
+
+
+```
+
+A melhor prática é lidar com consultas em uma rota de API. Para mais informações sobre como usar o Prisma ORM no seu projeto Astro, veja o [Guia Astro + Prisma ORM](https://www.prisma.io/docs/guides/frameworks/astro).
+
+## Conectar com Outros ORMs e Bibliotecas
+
+Você pode se conectar ao Prisma Postgres via TCP direto usando qualquer outro ORM, biblioteca de banco de dados ou ferramenta de sua escolha. Crie uma string de conexão direta no seu Console Prisma para começar.
+
+### Pré-requisitos
+- Um projeto Astro com um adaptador instalado para ativar a [renderização sob demanda (SSR)](/pt-br/guides/on-demand-rendering/).
+- Um banco de dados [Prisma Postgres](https://pris.ly/ppg) com uma string de conexão com TCP ativado
+
+### Instalar dependências
+
+Este exemplo usa [`pg`, um cliente PostgreSQL para Node.js](https://github.com/brianc/node-postgres) para fazer uma conexão TCP direta.
+
+Execute o seguinte comando para instalar o pacote `pg`:
+
+```bash
+npm install pg
+```
+
+### Consultar o cliente do seu banco de dados
+
+Forneça sua string de conexão para o cliente `pg` para se comunicar com o seu servidor SQL e buscar dados do seu banco de dados.
+
+O exemplo a seguir de criação de uma tabela e inserção de dados pode ser usado para validar sua URL de consulta e conexão TCP:
+
+```astro title="src/pages/index.astro" {2-19}
+---
+import { Client } from 'pg';
+const client = new Client({
+ connectionString: import.meta.env.DATABASE_URL,
+ ssl: { rejectUnauthorized: false }
+});
+await client.connect();
+
+await client.query(`
+ CREATE TABLE IF NOT EXISTS postagens (
+ id SERIAL PRIMARY KEY,
+ titulo TEXT UNIQUE,
+ conteudo TEXT
+ );
+
+ INSERT INTO postagens (titulo, conteudo)
+ VALUES ('Olá', 'Mundo')
+ ON CONFLICT (titulo) DO NOTHING;
+`);
+
+const { rows } = await client.query('SELECT * FROM postagens');
+await client.end();
+---
+
+
Postagens
+
{rows[0].titulo}: {rows[0].conteudo}
+```
+
+## Recursos Oficiais
+
+- [Guia Astro + Prisma ORM](https://www.prisma.io/docs/guides/frameworks/astro)
From 0c45b8333fbd0e4a9c50d687a16cb397fd89124b Mon Sep 17 00:00:00 2001
From: Mikhail Alabugin <137305666+1t1sCooL@users.noreply.github.com>
Date: Mon, 7 Sep 2026 22:50:45 +0300
Subject: [PATCH 15/69] i18n(ru): add `guides/data-fetching.mdx` (#14348)
Co-authored-by: Yan <61414485+yanthomasdev@users.noreply.github.com>
---
src/content/docs/ru/guides/data-fetching.mdx | 110 +++++++++++++++++++
1 file changed, 110 insertions(+)
create mode 100644 src/content/docs/ru/guides/data-fetching.mdx
diff --git a/src/content/docs/ru/guides/data-fetching.mdx b/src/content/docs/ru/guides/data-fetching.mdx
new file mode 100644
index 0000000000000..4f268fe401583
--- /dev/null
+++ b/src/content/docs/ru/guides/data-fetching.mdx
@@ -0,0 +1,110 @@
+---
+title: Получение данных
+description: Узнайте, как получать удалённые данные в Astro с помощью fetch API.
+i18nReady: true
+---
+
+Файлы `.astro` могут получать удалённые данные, которые помогут вам генерировать страницы.
+
+## `fetch()` в Astro
+
+Все [компоненты Astro](/ru/basics/astro-components/) имеют доступ к [глобальной функции `fetch()`](https://developer.mozilla.org/ru/docs/Web/API/Window/fetch) в скрипте компонента, чтобы выполнять HTTP-запросы к API по полному URL (например, `https://example.com/api`).
+Кроме того, с помощью [`new URL("/api", Astro.url)`](/ru/reference/api-reference/#url) можно построить URL к страницам и эндпойнтам вашего проекта, которые рендерятся на сервере по запросу.
+
+Такой вызов fetch будет выполнен во время сборки, и данные будут доступны шаблону компонента для генерации динамического HTML. Если включён режим [SSR](/ru/guides/on-demand-rendering/), все вызовы fetch будут выполняться во время работы сервера.
+
+💡 Используйте [**`await` верхнего уровня**](https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Operators/await#top_level_await) в скрипте компонента Astro.
+
+💡 Передавайте полученные данные как пропсы и в компоненты Astro, и в компоненты фреймворков.
+
+```astro /await fetch\\(.*?\\);/
+---
+// src/components/User.astro
+import Contact from "../components/Contact.jsx";
+import Location from "../components/Location.astro";
+
+const response = await fetch("https://randomuser.me/api/");
+const data = await response.json();
+const randomUser = data.results[0];
+---
+
+
Пользователь
+
{randomUser.name.first} {randomUser.name.last}
+
+
+
+
+```
+
+:::note
+Помните: все данные в компонентах Astro запрашиваются в момент рендеринга компонента.
+
+Развёрнутый сайт Astro запрашивает данные **один раз, во время сборки**. В режиме разработки запросы данных происходят при обновлении компонентов. Если данные нужно многократно запрашивать на стороне клиента, используйте в компоненте Astro [компонент фреймворка](/ru/guides/framework-components/) или [клиентский скрипт](/ru/guides/client-side-scripts/).
+:::
+
+## `fetch()` в компонентах фреймворков
+
+Функция `fetch()` также глобально доступна в любых [компонентах фреймворков](/ru/guides/framework-components/):
+
+```tsx title="src/components/Movies.tsx" /await fetch\\(.*?\\)/
+import type { FunctionalComponent } from 'preact';
+
+const data = await fetch('https://example.com/movies.json').then((response) => response.json());
+
+// Компоненты, рендерящиеся во время сборки, выводят логи в CLI.
+// При рендеринге с директивой `client:*` они выводят логи и в консоль браузера.
+console.log(data);
+
+const Movies: FunctionalComponent = () => {
+ // Выводим результат на страницу
+ return
Получаем информацию о фильме «Звёздные войны: Новая надежда»
+
Название: {film.title}
+
Год: {film.releaseDate}
+```
+
+## Получение данных из headless CMS
+
+Компоненты Astro могут получать данные из вашей любимой CMS и рендерить их как содержимое страницы. С помощью [динамических маршрутов](/ru/guides/routing/#dynamic-routes) компоненты могут даже генерировать страницы на основе содержимого CMS.
+
+Подробности об интеграции Astro с headless CMS, включая Storyblok, Contentful и WordPress, смотрите в наших [руководствах по CMS](/ru/guides/cms/).
+
+## Ресурсы сообщества
+
+- [Создание fullstack-приложения с Astro + GraphQL](https://robkendal.co.uk/blog/how-to-build-astro-site-with-graphql/)
From 738be6e0633ae67d144d574037beb6528c929049 Mon Sep 17 00:00:00 2001
From: Angel Marfil <59626670+angelmarfil@users.noreply.github.com>
Date: Mon, 7 Sep 2026 15:05:42 -0500
Subject: [PATCH 16/69] i18n(es): add `guides/deploy/aws-via-flightcontrol.mdx`
(#14509)
Co-authored-by: Yan <61414485+yanthomasdev@users.noreply.github.com>
---
.../guides/deploy/aws-via-flightcontrol.mdx | 38 +++++++++++++++++++
1 file changed, 38 insertions(+)
create mode 100644 src/content/docs/es/guides/deploy/aws-via-flightcontrol.mdx
diff --git a/src/content/docs/es/guides/deploy/aws-via-flightcontrol.mdx b/src/content/docs/es/guides/deploy/aws-via-flightcontrol.mdx
new file mode 100644
index 0000000000000..50b495c977b92
--- /dev/null
+++ b/src/content/docs/es/guides/deploy/aws-via-flightcontrol.mdx
@@ -0,0 +1,38 @@
+---
+title: Despliega tu sitio de Astro en AWS con Flightcontrol
+description: Cómo desplegar tu sitio de Astro en AWS con Flightcontrol
+sidebar:
+ label: AWS via Flightcontrol
+type: deploy
+logo: flightcontrol
+supports: ['ssr', 'static']
+i18nReady: true
+---
+import { Steps } from '@astrojs/starlight/components';
+
+Puedes desplegar un sitio de Astro usando [Flightcontrol](https://www.flightcontrol.dev?ref=astro), el cual ofrece despliegues completamente automatizados en tu cuenta de AWS.
+
+Admite sitios de Astro tanto estáticos como SSR.
+
+## Cómo desplegar
+
+
+1. Crea una cuenta de Flightcontrol en [app.flightcontrol.dev/signup](https://app.flightcontrol.dev/signup?ref=astro)
+
+2. Ve a [app.flightcontrol.dev/projects/new/1](https://app.flightcontrol.dev/projects/new/1)
+
+3. Conecta tu cuenta de GitHub y selecciona tu repo
+
+4. Selecciona el "Config Type" que desees:
+ - `GUI` (toda la configuración se gestiona a través del panel de Flightcontrol) donde seleccionarás el preset `Astro Static` o `Astro SSR`
+ - `flightcontrol.json` (opción de "infraestructura como código" donde toda la configuración está en tu repo), donde seleccionarás una configuración de ejemplo de Astro y luego la añadirás a tu código fuente como `flightcontrol.json`
+
+5. Ajusta cualquier configuración según sea necesario
+
+6. Haz clic en "Create Project" y completa cualquier paso requerido (como vincular tu cuenta de AWS).
+
+
+### Configuración de SSR
+
+{/* TODO: add link to: es/guides/integrations-guide/node/ */}
+Para desplegar con soporte para SSR, asegúrate de configurar primero el adaptador `@astrojs/node`. Luego, sigue los pasos anteriores, eligiendo las configuraciones adecuadas para Astro SSR.
From 84422a0a4282681456ef1f6311fee1ae7ac1da24 Mon Sep 17 00:00:00 2001
From: Angel Marfil <59626670+angelmarfil@users.noreply.github.com>
Date: Mon, 7 Sep 2026 15:14:31 -0500
Subject: [PATCH 17/69] i18n(es): add `guides/deploy/firebase.mdx` (#14512)
Co-authored-by: Yan <61414485+yanthomasdev@users.noreply.github.com>
---
.../docs/es/guides/deploy/firebase.mdx | 137 ++++++++++++++++++
1 file changed, 137 insertions(+)
create mode 100644 src/content/docs/es/guides/deploy/firebase.mdx
diff --git a/src/content/docs/es/guides/deploy/firebase.mdx b/src/content/docs/es/guides/deploy/firebase.mdx
new file mode 100644
index 0000000000000..054625d5da377
--- /dev/null
+++ b/src/content/docs/es/guides/deploy/firebase.mdx
@@ -0,0 +1,137 @@
+---
+title: Despliega tu sitio de Astro en Firebase Hosting de Google
+description: Cómo desplegar tu sitio de Astro en la web usando Firebase Hosting de Google.
+sidebar:
+ label: Firebase
+type: deploy
+logo: firebase
+supports: ['ssr', 'static']
+i18nReady: true
+---
+import { Steps } from '@astrojs/starlight/components';
+import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro';
+
+[Firebase Hosting](https://firebase.google.com/products/hosting) es un servicio proporcionado por la plataforma de desarrollo de aplicaciones [Firebase](https://firebase.google.com/) de Google, que se puede utilizar para desplegar un sitio de Astro.
+
+Consulta nuestra guía separada para [agregar servicios de backend de Firebase](/es/guides/backend/firebase/) como bases de datos, autenticación y almacenamiento.
+
+## Configuración del proyecto
+
+Tu proyecto de Astro se puede desplegar en Firebase como un sitio estático o como un sitio renderizado del lado del servidor (SSR).
+
+### Sitio estático
+
+Tu proyecto de Astro es un sitio estático de forma predeterminada. No necesitas ninguna configuración adicional para desplegar un sitio estático de Astro en Firebase.
+
+### Adaptador para SSR
+
+{/* TODO: add link to: /en/guides/integrations-guide/node/ */}
+Para habilitar SSR en tu proyecto de Astro y desplegarlo en Firebase, agrega el adaptador de Node.js.
+
+:::note
+Desplegar un sitio SSR de Astro en Firebase requiere el [plan Blaze](https://firebase.google.com/pricing) o superior.
+:::
+
+## Cómo desplegar
+
+
+1. Instala la [Firebase CLI](https://github.com/firebase/firebase-tools). Esta es una herramienta de línea de comandos que te permite interactuar con Firebase desde la terminal.
+
+
+
+ ```shell
+ npm install firebase-tools
+ ```
+
+
+ ```shell
+ pnpm add firebase-tools
+ ```
+
+
+ ```shell
+ yarn add firebase-tools
+ ```
+
+
+
+2. Autentica la Firebase CLI con tu cuenta de Google. Esto abrirá una ventana del navegador donde podrás iniciar sesión en tu cuenta de Google.
+
+
+
+ ```shell
+ npx firebase login
+ ```
+
+
+ ```shell
+ pnpm exec firebase login
+ ```
+
+
+ ```shell
+ yarn firebase login
+ ```
+
+
+
+3. Habilita el soporte experimental para frameworks web. Esta es una característica experimental que permite a la Firebase CLI detectar y configurar tus ajustes de despliegue para Astro.
+
+
+
+ ```shell
+ npx firebase experiments:enable webframeworks
+ ```
+
+
+ ```shell
+ pnpm exec firebase experiments:enable webframeworks
+ ```
+
+
+ ```shell
+ yarn firebase experiments:enable webframeworks
+ ```
+
+
+
+4. Inicializa Firebase Hosting en tu proyecto. Esto creará los archivos `firebase.json` y `.firebaserc` en la raíz de tu proyecto.
+
+
+
+ ```shell
+ npx firebase init hosting
+ ```
+
+
+ ```shell
+ pnpm exec firebase init hosting
+ ```
+
+
+ ```shell
+ yarn firebase init hosting
+ ```
+
+
+
+5. Despliega tu sitio en Firebase Hosting. Esto construirá tu sitio de Astro y lo desplegará en Firebase.
+
+
+
+ ```shell
+ npx firebase deploy --only hosting
+ ```
+
+
+ ```shell
+ pnpm exec firebase deploy --only hosting
+ ```
+
+
+ ```shell
+ yarn firebase deploy --only hosting
+ ```
+
+
+
From ae13762517102f50f103106d1ce4609496909ef7 Mon Sep 17 00:00:00 2001
From: Mikhail Alabugin <137305666+1t1sCooL@users.noreply.github.com>
Date: Mon, 7 Sep 2026 23:26:11 +0300
Subject: [PATCH 18/69] i18n(ru): add `guides/server-islands.mdx` (#14467)
Co-authored-by: Yan <61414485+yanthomasdev@users.noreply.github.com>
---
src/content/docs/ru/guides/server-islands.mdx | 125 ++++++++++++++++++
1 file changed, 125 insertions(+)
create mode 100644 src/content/docs/ru/guides/server-islands.mdx
diff --git a/src/content/docs/ru/guides/server-islands.mdx b/src/content/docs/ru/guides/server-islands.mdx
new file mode 100644
index 0000000000000..06eca045eceb1
--- /dev/null
+++ b/src/content/docs/ru/guides/server-islands.mdx
@@ -0,0 +1,125 @@
+---
+title: Серверные островки
+description: Сочетайте высокопроизводительный статический HTML с динамическим контентом, отрендеренным на сервере.
+i18nReady: true
+---
+
+Серверные островки позволяют рендерить по запросу динамические или персонализированные «островки» по отдельности, не жертвуя производительностью остальной части страницы.
+
+Это значит, что посетитель раньше увидит самые важные части страницы, а основной контент можно будет кешировать агрессивнее, что ускорит работу сайта.
+
+## Компоненты серверных островков
+
+Серверный островок — это обычный [компонент Astro](/ru/basics/astro-components/), рендерящийся на сервере, которому указано отложить рендеринг до тех пор, пока его содержимое не станет доступно.
+
+Страница будет отрендерена сразу с указанным [резервным контентом в качестве заглушки](#резервный-контент-серверного-островка). Затем собственное содержимое компонента запрашивается на клиенте и отображается, когда оно готово.
+
+Установив [адаптер](/ru/guides/on-demand-rendering/#серверные-адаптеры) для выполнения отложенного рендеринга, добавьте [директиву `server:defer`](/ru/reference/directives-reference/#server-directives) любому компоненту на странице, чтобы превратить его в отдельный островок:
+
+```astro title="src/pages/index.astro" "server:defer"
+---
+import Avatar from '../components/Avatar.astro';
+---
+
+```
+
+Такие компоненты могут делать [всё, что обычно доступно на странице, рендерящейся по запросу](/ru/guides/on-demand-rendering/#возможности-рендеринга-по-запросу) через адаптер, — например, запрашивать контент и обращаться к кукам:
+
+```astro title="src/components/Avatar.astro"
+---
+import { getUserAvatar } from '../sessions';
+const userSession = Astro.cookies.get('session');
+const avatarURL = await getUserAvatar(userSession);
+---
+
+```
+
+### Передача пропсов серверным островкам
+
+Пропсы, передаваемые компонентам серверных островков, должны быть [сериализуемыми](https://developer.mozilla.org/ru/docs/Glossary/Serialization): то есть их можно преобразовать в формат, пригодный для передачи по сети или для хранения. Кроме того, Astro сериализует не все типы сериализуемых структур данных. Поэтому на то, что можно передать серверному островку в качестве пропсов, есть ограничения.
+
+В частности, компонентам с директивой `server:defer` нельзя передавать функции, так как они не сериализуются. Объекты с циклическими ссылками также не сериализуемы.
+
+Поддерживаются следующие типы пропсов:
+простой объект, `number`, `string`, `Array`, `Map`, `Set`, `RegExp`, `Date`, `BigInt`, `URL`, `Uint8Array`, `Uint16Array`, `Uint32Array` и `Infinity`
+
+## Резервный контент серверного островка
+
+Используя атрибут `server:defer` на компоненте для откладывания его рендеринга, вы можете «подставить» контент загрузки по умолчанию через встроенный именованный слот `"fallback"`.
+
+Резервный контент отрендерится вместе с остальной страницей при её первоначальной загрузке и будет заменён содержимым компонента, когда оно станет доступно.
+
+Чтобы добавить резервный контент, укажите `slot="fallback"` на дочернем элементе (другом компоненте или HTML-элементе), переданном компоненту серверного островка:
+
+```astro
+---
+import Avatar from '../components/Avatar.astro';
+import GenericAvatar from '../components/GenericAvatar.astro';
+---
+
+
+
+```
+
+Резервным контентом могут быть, например:
+
+- Обобщённый аватар вместо аватара пользователя.
+- UI-заглушки, например собственные сообщения.
+- Индикаторы загрузки, например спиннеры.
+
+## Как это работает
+
+Реализация серверных островков происходит в основном на этапе сборки, когда содержимое компонента подменяется небольшим скриптом.
+
+Каждый островок с директивой `server:defer` выделяется в собственный специальный маршрут, который этот скрипт запрашивает во время выполнения. При сборке сайта Astro пропустит компонент и вставит на его место скрипт, а также контент, помеченный `slot="fallback"`.
+
+Когда страница загрузится в браузере, эти компоненты будут запрошены со специального эндпоинта, который отрендерит их и вернёт HTML. Благодаря этому пользователи мгновенно увидят самые важные части страницы. Резервный контент будет виден непродолжительное время, пока не загрузятся динамические островки.
+
+Каждый островок загружается независимо от остальных. Это значит, что более медленный островок не задержит появление остального персонализированного контента.
+
+Этот паттерн рендеринга создавался переносимым. Он не зависит от какой-либо серверной инфраструктуры, поэтому будет работать с любым хостингом — от сервера Node.js в Docker-контейнере до бессерверного провайдера на ваш выбор.
+
+## Кеширование
+
+Данные для серверных островков запрашиваются через `GET`-запрос, а пропсы передаются в виде зашифрованной строки в query-параметрах URL. Это позволяет кешировать данные с помощью [HTTP-заголовка `Cache-Control`](https://developer.mozilla.org/ru/docs/Web/HTTP/Reference/Headers/Cache-Control), используя его стандартные директивы.
+
+Однако [браузер ограничивает длину URL максимумом в 2048 байт](https://chromium.googlesource.com/chromium/src/+/master/docs/security/url_display_guidelines/url_display_guidelines.md#url-length) из практических соображений и во избежание проблем типа «отказ в обслуживании». Если из-за строки запроса URL превышает этот лимит, Astro вместо этого отправит `POST`-запрос со всеми пропсами в теле.
+
+`POST`-запросы не кешируются браузерами, поскольку используются для отправки данных и могли бы привести к проблемам с целостностью данных или безопасностью. Поэтому существующая логика кеширования в вашем проекте перестанет работать. По возможности передавайте серверным островкам только необходимые пропсы и не отправляйте целые объекты данных и массивы, чтобы строка запроса оставалась небольшой.
+
+## Доступ к URL страницы в серверном островке
+
+В большинстве случаев компонент серверного островка может получить информацию о странице, которая его рендерит, через [передачу пропсов](/ru/basics/astro-components/#пропсы-компонента), как в обычных компонентах.
+
+Однако серверные островки выполняются в собственном изолированном контексте вне запроса страницы. `Astro.url` и `Astro.request.url` в компоненте серверного островка возвращают URL вида `/_server-islands/Avatar`, а не URL текущей страницы в браузере. Кроме того, при предварительном рендеринге страницы у вас не будет доступа, например, к query-параметрам, чтобы передать их как пропсы.
+
+Чтобы получить информацию из URL страницы, проверьте заголовок [Referer](https://developer.mozilla.org/ru/docs/Web/HTTP/Headers/Referer) — он содержит адрес страницы, загружающей островок в браузере:
+
+```astro
+---
+const referer = Astro.request.headers.get("Referer");
+
+if (!referer) {
+ throw new Error("Referer header is missing");
+}
+
+const url = new URL(referer);
+const productId = url.searchParams.get("product");
+---
+```
+
+## Повторное использование ключа шифрования
+
+Astro использует [криптографию](https://developer.mozilla.org/ru/docs/Glossary/Cryptography) для шифрования пропсов, передаваемых серверным островкам, защищая чувствительные данные от случайного раскрытия. Шифрование опирается на новый случайный ключ, который генерируется при каждой сборке и встраивается в серверный бандл.
+
+Большинство хостингов автоматически позаботятся о синхронизации фронтенда и бэкенда. Однако постоянный ключ шифрования может понадобиться, если вы используете скользящие развёртывания (rolling deployments), мультирегиональный хостинг или CDN, кеширующий страницы с серверными островками.
+
+В окружениях со скользящими развёртываниями (например, Kubernetes), где фронтенд-ресурсы (шифрующие пропсы) и бэкенд-функции (расшифровывающие их) могут временно использовать разные ключи, а также когда CDN всё ещё отдаёт страницы, собранные со старым ключом, зашифрованные пропсы серверного островка расшифровать не удастся.
+
+В таких ситуациях сгенерируйте с помощью Astro CLI многоразовый закодированный ключ шифрования и задайте его переменной окружения в сборочном окружении:
+
+```shell
+astro create-key
+```
+
+Используйте полученное значение для настройки переменной окружения `ASTRO_KEY` (например, в файле `.env`) и добавьте её в настройки сборки CI/CD или хостинга. Так в собираемом бандле всегда будет использоваться один и тот же ключ, а шифрование и расшифровка останутся синхронизированными.
From b5fe3544a6a3065aab92fbb9cbe81e3308f175c5 Mon Sep 17 00:00:00 2001
From: Daniel
Date: Wed, 9 Sep 2026 12:33:16 +0200
Subject: [PATCH 19/69] Expand the EmDash CMS guide from stub to full guide
(#14428)
Co-authored-by: Armand Philippot
---
src/content/docs/en/guides/cms/emdash.mdx | 223 +++++++++++++++++++++-
1 file changed, 222 insertions(+), 1 deletion(-)
diff --git a/src/content/docs/en/guides/cms/emdash.mdx b/src/content/docs/en/guides/cms/emdash.mdx
index 142a226188080..602d0ddbb9b8a 100644
--- a/src/content/docs/en/guides/cms/emdash.mdx
+++ b/src/content/docs/en/guides/cms/emdash.mdx
@@ -4,13 +4,234 @@ description: Add content to your Astro project using EmDash as a CMS
sidebar:
label: EmDash
type: cms
-stub: true
logo: emdash
i18nReady: true
---
+import { Steps } from '@astrojs/starlight/components';
+import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro';
[EmDash](https://emdashcms.com/) is an open-source, full-stack CMS built specifically for Astro, adding database-backed content, an admin UI, a media library, menus, and taxonomies to your site.
+:::tip
+To start a **new Astro + EmDash project from scratch**, use the EmDash CLI to generate a pre-wired project:
+
+
+
+ ```shell
+ npm create emdash@latest
+ ```
+
+
+ ```shell
+ pnpm create emdash@latest
+ ```
+
+
+ ```shell
+ yarn create emdash@latest
+ ```
+
+
+:::
+
+## Integrating with Astro
+
+EmDash runs within your Astro project and relies on a database. You can access the admin interface at `/_emdash/admin` to edit content. Your pages will display it by querying the database using [live content collections](/en/guides/content-collections/#live-content-collections).
+
+This guide uses the [Node.js adapter](/en/guides/integrations-guide/node/) and a local SQLite database. See the [EmDash docs for a list of supported databases](https://docs.emdashcms.com/deployment/database/).
+
+## Prerequisites
+
+- An existing Astro project (Astro 6 or later) configured [with an adapter](/en/guides/on-demand-rendering/) and [`output: "server"`](/en/reference/configuration-reference/#output).
+- Node.js v22.16.0 or higher.
+
+## Installing dependencies
+
+React powers the EmDash admin interface and is a required dependency. If your project does not use React, install it using the `astro add` command for your package manager:
+
+
+
+ ```shell
+ npx astro add react
+ ```
+
+
+ ```shell
+ pnpm astro add react
+ ```
+
+
+ ```shell
+ yarn astro add react
+ ```
+
+
+
+You also need to install the EmDash package:
+
+
+
+ ```shell
+ npm install emdash
+ ```
+
+
+ ```shell
+ pnpm add emdash
+ ```
+
+
+ ```shell
+ yarn add emdash
+ ```
+
+
+
+## Adding the integration
+
+Add the `emdash()` integration to your Astro config file, and configure a database and a media storage backend:
+
+```js title="astro.config.mjs" ins={4-5, 12-18}
+import { defineConfig } from "astro/config";
+import node from "@astrojs/node";
+import react from "@astrojs/react";
+import emdash, { local } from "emdash/astro";
+import { sqlite } from "emdash/db";
+
+export default defineConfig({
+ output: "server",
+ adapter: node({ mode: "standalone" }),
+ integrations: [
+ react(),
+ emdash({
+ database: sqlite({ url: "file:./data.db" }),
+ storage: local({
+ directory: "./uploads",
+ baseUrl: "/_emdash/api/media/file",
+ }),
+ }),
+ ],
+});
+```
+
+## Adding the live collections loader
+
+Create a `src/live.config.ts` file so that Astro's content layer can resolve EmDash content:
+
+```ts title="src/live.config.ts"
+import { defineLiveCollection } from "astro:content";
+import { emdashLoader } from "emdash/runtime";
+
+export const collections = {
+ _emdash: defineLiveCollection({ loader: emdashLoader() }),
+};
+```
+
+The `_emdash` collection internally routes to your content types (e.g. posts and pages). Any existing file-based collections in `src/content.config.ts` keep working alongside it.
+
+## Running EmDash locally
+
+EmDash requires you to complete the setup wizard before testing your own pages. Until the setup is complete, there is no published content and queries return empty results.
+
+
+1. Start Astro's dev server to initialize the database and launch the admin UI:
+
+
+
+ ```shell
+ npm run dev
+ ```
+
+
+ ```shell
+ pnpm run dev
+ ```
+
+
+ ```shell
+ yarn run dev
+ ```
+
+
+
+ On first run, EmDash creates `data.db` with its schema and two default collections, `pages` and `posts`.
+
+2. Visit `http://localhost:4321/_emdash/admin` in the browser. EmDash redirects you to the setup wizard.
+
+3. In the **Site** step, enter a site title and an optional tagline.
+
+4. In the **Account** step, enter your email address and name. This creates the administrator account.
+
+5. In the **Sign In** step, secure your account. Choose **Create Passkey** to register a passkey with your device's biometric authentication, security key, or PIN.
+
+6. Sign in with your new passkey to reach the dashboard.
+
+
+## Creating your first post
+
+
+1. In the dashboard, click the **+ Post** button.
+
+2. Add a title and some content. EmDash stores rich text as [Portable Text](https://github.com/portabletext/portabletext), edited in a block editor. A URL slug is generated from the title and can be edited in the sidebar.
+
+3. Click **Save**, then **Publish**. Only published posts are visible to site visitors.
+
+
+## Rendering EmDash content
+
+Query your content with `getEmDashCollection()` and `getEmDashEntry()`. Both follow the live collections pattern and return results at request time, so published changes appear without a rebuild.
+
+### Displaying a list of posts
+
+The following example displays a list of all published post titles, each linking to an individual post page:
+
+```astro title="src/pages/blog.astro"
+---
+import { getEmDashCollection } from "emdash";
+
+const { entries: posts } = await getEmDashCollection("posts", {
+ status: "published",
+});
+---
+
+```
+
+### Displaying a single post
+
+To display content from an individual post, fetch it by its slug and render the Portable Text content with the `` component:
+
+```astro title="src/pages/posts/[...slug].astro"
+---
+import { getEmDashEntry } from "emdash";
+import { PortableText } from "emdash/ui";
+
+const { slug } = Astro.params;
+const { entry: post } = await getEmDashEntry("posts", slug);
+
+if (!post) {
+ return Astro.redirect("/404");
+}
+---
+
+
{post.data.title}
+
+
+```
+
+See the [EmDash querying guide](https://docs.emdashcms.com/guides/querying-content/) for more information on filtering, pagination, previewing drafts, and visual editing.
+
+## Deploying EmDash + Astro
+
+EmDash deploys together with your site as a single Astro project. Choose a host that supports your adapter, and provision a production database and media storage.
+
+See the [EmDash deployment guide for Node.js](https://docs.emdashcms.com/deployment/nodejs/) and the [EmDash deployment guide for Cloudflare](https://docs.emdashcms.com/deployment/cloudflare/) for specific instructions. You can also visit Astro's [deployment guides](/en/guides/deploy/) and follow the instructions to deploy with your preferred hosting provider.
+
## Official Resources
- [EmDash Documentation for Astro Developers](https://docs.emdashcms.com/coming-from/astro/)
From 7591f98d3be681668b95428a057b1c9852442ff0 Mon Sep 17 00:00:00 2001
From: is*hosting
Date: Wed, 9 Sep 2026 12:49:34 +0200
Subject: [PATCH 20/69] Add is*hosting deploy guide (stub) (#14510)
Co-authored-by: Armand Philippot
---
public/logos/ishosting.svg | 1 +
src/content/docs/en/guides/deploy/ishosting.mdx | 16 ++++++++++++++++
src/data/logos.ts | 1 +
3 files changed, 18 insertions(+)
create mode 100644 public/logos/ishosting.svg
create mode 100644 src/content/docs/en/guides/deploy/ishosting.mdx
diff --git a/public/logos/ishosting.svg b/public/logos/ishosting.svg
new file mode 100644
index 0000000000000..90cf199e085d4
--- /dev/null
+++ b/public/logos/ishosting.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/src/content/docs/en/guides/deploy/ishosting.mdx b/src/content/docs/en/guides/deploy/ishosting.mdx
new file mode 100644
index 0000000000000..212033b568e98
--- /dev/null
+++ b/src/content/docs/en/guides/deploy/ishosting.mdx
@@ -0,0 +1,16 @@
+---
+title: Deploy your Astro Site to is*hosting
+description: How to deploy your Astro site to the web using is*hosting
+sidebar:
+ label: is*hosting
+type: deploy
+logo: ishosting
+supports: ['ssr', 'static']
+i18nReady: true
+---
+
+[is\*hosting](https://ishosting.com/) is a hosting provider offering VPS and dedicated servers in 40+ locations that you can use to self-host a static or server-rendered (SSR) Astro site.
+
+## Official Resources
+
+- [is\*hosting guide: deploy Astro on a VPS (static and SSR)](https://blog.ishosting.com/en/astro-on-vps)
diff --git a/src/data/logos.ts b/src/data/logos.ts
index e178b569b912b..0013b6de63a37 100644
--- a/src/data/logos.ts
+++ b/src/data/logos.ts
@@ -66,6 +66,7 @@ export const logos = LogoCheck({
hygraph: { file: 'hygraph.svg', padding: '.1em .125em .1em .1em' },
image: { file: 'astro-image.svg', padding: '.1875em' },
imagekit: { file: 'imagekit.svg', padding: '.15em' },
+ ishosting: { file: 'ishosting.svg', padding: '.1625em' },
jekyll: { file: 'jekyll.png', padding: '.1em .05em 0' },
jekyllpad: { file: 'jekyllpad.svg', padding: '0.2em' },
keystatic: { file: 'keystatic.svg', padding: '0' },
From cf14d7dd900c261c5c55079fca5e878945c9a96d Mon Sep 17 00:00:00 2001
From: Angel Marfil <59626670+angelmarfil@users.noreply.github.com>
Date: Wed, 9 Sep 2026 10:52:20 -0500
Subject: [PATCH 21/69] i18n(es): add `guides/deploy/index.mdx` (#14508)
Co-authored-by: mixto <326143391+mixto@users.noreply.github.com>
Co-authored-by: Yan <61414485+yanthomasdev@users.noreply.github.com>
---
src/content/docs/es/guides/deploy/index.mdx | 121 ++++++++++++++++++++
1 file changed, 121 insertions(+)
create mode 100644 src/content/docs/es/guides/deploy/index.mdx
diff --git a/src/content/docs/es/guides/deploy/index.mdx b/src/content/docs/es/guides/deploy/index.mdx
new file mode 100644
index 0000000000000..e7fcca01d2a3f
--- /dev/null
+++ b/src/content/docs/es/guides/deploy/index.mdx
@@ -0,0 +1,121 @@
+---
+title: Despliega tu sitio Astro
+description: Cómo desplegar tu sitio Astro en la web.
+sidebar:
+ label: Descripción general de despliegue
+i18nReady: true
+---
+
+import DeployGuidesNav from '~/components/DeployGuidesNav.astro';
+import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro';
+import { Steps } from '@astrojs/starlight/components'
+
+**¿Listo para construir y desplegar tu sitio Astro?** Sigue una de nuestras guías para diferentes servicios de despliegue o desplázate hacia abajo para obtener orientación general sobre cómo desplegar un sitio Astro.
+
+## Guías de despliegue
+
+
+
+## Opciones de despliegue rápido
+
+Puedes construir y desplegar un sitio de Astro rápidamente en varios proveedores de alojamiento usando la interfaz de su panel de control o una CLI.
+
+### Interfaz web
+
+Una forma rápida de desplegar tu sitio web es conectar el repositorio Git en línea de tu proyecto de Astro (p. ej. GitHub, GitLab, Bitbucket) a un proveedor de alojamiento y aprovechar el despliegue continuo mediante Git.
+
+Estas plataformas de alojamiento detectan automáticamente los cambios subidos al repositorio de origen de tu proyecto de Astro, construyen tu sitio y lo despliegan en la web en una URL personalizada o en tu dominio personal. Por lo general, la configuración de un despliegue en estas plataformas seguirá una serie de pasos similares a los siguientes:
+
+
+1. Añade tu repositorio a un proveedor de Git en línea (p. ej. en GitHub, GitLab, Bitbucket)
+
+2. Elige un proveedor de alojamiento que soporte **despliegue continuo** (p. ej. [Netlify](/es/guides/deploy/netlify/) o [Vercel](/es/guides/deploy/vercel/)) e importa tu repositorio Git como un nuevo sitio o proyecto.
+
+ Muchos proveedores de alojamiento comunes reconocerán tu proyecto como un sitio de Astro y deberían elegir la configuración adecuada para construir y desplegar tu sitio, como se muestra a continuación. (De no ser así, esta configuración se puede cambiar.)
+
+ :::note[Configuración de despliegue]
+ - **Comando de construcción:** `astro build` o `npm run build`
+ - **Directorio de publicación:** `dist`
+ :::
+
+3. Haz clic en "Deploy" y tu nuevo sitio web se creará en una URL única para ese proveedor (p. ej. `new-astro-site.netlify.app`).
+
+
+El host se configurará automáticamente para monitorear la rama principal de tu proveedor de Git en busca de cambios, y para reconstruir y republicar tu sitio con cada nuevo commit. Por lo general, estos ajustes se pueden configurar en la interfaz del panel de control de tu proveedor de alojamiento.
+
+### Despliegue mediante CLI
+
+Algunos hosts tendrán su propia interfaz de línea de comandos (CLI) que puedes instalar de forma global en tu máquina usando npm. A menudo, el uso de una CLI para realizar el despliegue es similar a lo siguiente:
+
+
+1. Instala globalmente la CLI de tu host, por ejemplo:
+
+
+
+ ```shell
+ npm install --global netlify-cli
+ ```
+
+
+ ```shell
+ pnpm add --global netlify-cli
+ ```
+
+
+ ```shell
+ yarn global add netlify-cli
+ ```
+
+
+
+2. Ejecuta la CLI y sigue las instrucciones para la autorización, configuración, etc.
+
+3. Construye tu sitio y despliégalo en tu host
+
+ Muchos hosts comunes construirán y desplegarán tu sitio por ti. Por lo general, reconocerán tu proyecto como un sitio de Astro, y deberían elegir los ajustes de configuración adecuados para construir y desplegar como se muestra a continuación. (Si no es así, estos ajustes se pueden cambiar).
+
+ :::note[Configuración de despliegue]
+ - **Comando de construcción:** `astro build` o `npm run build`
+ - **Directorio de publicación:** `dist`
+ :::
+
+
+ Otros hosts requerirán que [construyas tu sitio localmente](#construir-tu-sitio-de-forma-local) y lo despliegues usando la línea de comandos.
+
+
+## Construir tu sitio de forma local
+
+Muchos proveedores de alojamiento como Netlify y Vercel construirán tu sitio por ti y luego publicarán esos archivos generados en la web. Sin embargo, algunos sitios requerirán que lo construyas localmente y luego ejecutes un comando de despliegue o subas los archivos generados.
+
+También es posible que desees construirlo localmente para obtener una vista previa de tu sitio, o para detectar posibles errores y advertencias en tu propio entorno.
+
+Ejecuta el comando `npm run build` para construir tu sitio de Astro.
+
+
+
+ ```shell
+ npm run build
+ ```
+
+
+ ```shell
+ pnpm run build
+ ```
+
+
+ ```shell
+ yarn run build
+ ```
+
+
+
+Por defecto, los archivos generados se colocarán en `dist/`. Esta ubicación se puede cambiar usando la [opción de configuración `outDir`](/es/reference/configuration-reference/#outdir).
+
+## Añadir un adaptador para el renderizado bajo demanda
+
+:::note
+Antes de desplegar tu sitio de Astro con el [renderizado bajo demanda](/es/guides/on-demand-rendering/) habilitado, asegúrate de haber:
+
+- Instalado el [adaptador adecuado](/es/guides/on-demand-rendering/) en las dependencias de tu proyecto (ya sea manualmente o utilizando el comando `astro add` del adaptador, p. ej. `npx astro add netlify`).
+- [Añadido el adaptador](/es/reference/configuration-reference/#integrations) a la importación y exportación por defecto de tu archivo `astro.config.mjs` cuando lo instalas manualmente. (¡El comando `astro add` se encargará de este paso por ti!)
+:::
From 91f530d2c8e3dee958322e387e57866345036c09 Mon Sep 17 00:00:00 2001
From: Armand Philippot
Date: Fri, 11 Sep 2026 19:57:12 +0200
Subject: [PATCH 22/69] i18n(fr): add `guides/deploy/ishosting.mdx` (#14525)
Co-authored-by: Yan <61414485+yanthomasdev@users.noreply.github.com>
---
src/content/docs/fr/guides/deploy/ishosting.mdx | 16 ++++++++++++++++
1 file changed, 16 insertions(+)
create mode 100644 src/content/docs/fr/guides/deploy/ishosting.mdx
diff --git a/src/content/docs/fr/guides/deploy/ishosting.mdx b/src/content/docs/fr/guides/deploy/ishosting.mdx
new file mode 100644
index 0000000000000..7c7179330190c
--- /dev/null
+++ b/src/content/docs/fr/guides/deploy/ishosting.mdx
@@ -0,0 +1,16 @@
+---
+title: Déployer votre site Astro sur is*hosting
+description: Comment déployer votre site Astro sur le web en utilisant is*hosting
+sidebar:
+ label: is*hosting
+type: deploy
+logo: ishosting
+supports: ['ssr', 'static']
+i18nReady: true
+---
+
+[is\*hosting](https://ishosting.com/) est un fournisseur d'hébergement proposant des VPS et des serveurs dédiés dans plus de 40 emplacements, que vous pouvez utiliser pour auto-héberger un site Astro statique ou rendu côté serveur (SSR).
+
+## Ressources officielles
+
+- [Guide is\*hosting : déployer Astro sur un VPS (statique et SSR)](https://blog.ishosting.com/en/astro-on-vps)
From 485bf72f757766c4170f10425b123111c5c5fd83 Mon Sep 17 00:00:00 2001
From: Angel Marfil <59626670+angelmarfil@users.noreply.github.com>
Date: Fri, 11 Sep 2026 13:24:36 -0500
Subject: [PATCH 23/69] i18n(es): add `guides/integrations-guide/preact.mdx`
(#14456)
Co-authored-by: Waxer59 <78129249+Waxer59@users.noreply.github.com>
Co-authored-by: Yan <61414485+yanthomasdev@users.noreply.github.com>
---
.../es/guides/integrations-guide/preact.mdx | 267 ++++++++++++++++++
1 file changed, 267 insertions(+)
create mode 100644 src/content/docs/es/guides/integrations-guide/preact.mdx
diff --git a/src/content/docs/es/guides/integrations-guide/preact.mdx b/src/content/docs/es/guides/integrations-guide/preact.mdx
new file mode 100644
index 0000000000000..ed0063690a899
--- /dev/null
+++ b/src/content/docs/es/guides/integrations-guide/preact.mdx
@@ -0,0 +1,267 @@
+---
+type: integration
+title: '@astrojs/preact'
+description: Aprende a usar la integración del framework @astrojs/preact para extender el soporte de componentes en tu proyecto de Astro.
+sidebar:
+ label: Preact
+githubIntegrationURL: 'https://github.com/withastro/astro/tree/main/packages/integrations/preact/'
+category: renderer
+i18nReady: true
+---
+
+import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro'
+import Since from '~/components/Since.astro';
+
+{/* TODO: add link to /es/guides/integrations/ */}
+Esta **integración de Astro** permite el renderizado y la hidratación del lado del cliente para tus componentes de [Preact](https://preactjs.com/).
+
+## ¿Por qué Preact?
+
+Preact es una biblioteca que te permite construir componentes de UI interactivos para la web. Si deseas crear funciones interactivas en tu sitio usando JavaScript, es posible que prefieras usar su formato de componentes en lugar de utilizar las API del navegador directamente.
+
+Preact también es una excelente opción si has utilizado React anteriormente. Preact proporciona la misma API que React, pero en un paquete mucho más pequeño de 3kB. Incluso admite la renderización de muchos componentes de React mediante la opción de configuración `compat` (ver a continuación).
+
+**¿Quieres aprender más sobre Preact antes de usar esta integración?**\
+Echa un vistazo a [“Aprende Preact”](https://preactjs.com/tutorial), un tutorial interactivo en su sitio web.
+
+## Instalación
+
+Astro incluye un comando `astro add` para automatizar la configuración de las integraciones oficiales. Si lo prefieres, puedes [instalar las integraciones manualmente](#instalación-manual) en su lugar.
+
+Para instalar `@astrojs/preact`, ejecuta lo siguiente desde el directorio de tu proyecto y sigue las instrucciones:
+
+
+
+ ```sh
+ npx astro add preact
+ ```
+
+
+ ```sh
+ pnpm astro add preact
+ ```
+
+
+ ```sh
+ yarn astro add preact
+ ```
+
+
+
+Si tienes algún problema, [no dudes en reportarlo en GitHub](https://github.com/withastro/astro/issues) e intenta seguir los pasos de instalación manual que aparecen a continuación.
+
+### Instalación manual
+
+Primero, instala el paquete `@astrojs/preact`:
+
+
+
+ ```sh
+ npm install @astrojs/preact
+ ```
+
+
+ ```sh
+ pnpm add @astrojs/preact
+ ```
+
+
+ ```sh
+ yarn add @astrojs/preact
+ ```
+
+
+
+La mayoría de los gestores de paquetes también instalarán las dependencias de pares asociadas. Si ves una advertencia como `Cannot find package 'preact'` (o similar) al iniciar Astro, tendrás que instalar Preact:
+
+
+
+ ```sh
+ npm install preact
+ ```
+
+
+ ```sh
+ pnpm add preact
+ ```
+
+
+ ```sh
+ yarn add preact
+ ```
+
+
+
+Luego, aplica la integración a tu archivo `astro.config.*` usando la propiedad `integrations`:
+
+```js title="astro.config.mjs" ins={2} ins="preact()"
+import { defineConfig } from 'astro/config';
+import preact from '@astrojs/preact';
+
+export default defineConfig({
+ // ...
+ integrations: [preact()],
+});
+```
+
+Y agrega el siguiente código al archivo `tsconfig.json`.
+
+```json title="tsconfig.json" ins={5-8}
+{
+ "extends": "astro/tsconfigs/strict",
+ "include": [".astro/types.d.ts", "**/*"],
+ "exclude": ["dist"],
+ "compilerOptions": {
+ "jsx": "react-jsx",
+ "jsxImportSource": "preact"
+ }
+}
+```
+
+## Uso
+
+Para usar tu primer componente de Preact en Astro, dirígete a nuestra [documentación de frameworks de UI][astro-ui-frameworks]. Explorarás:
+
+* 📦 cómo se cargan los componentes del framework,
+* 💧 opciones de hidratación del lado del cliente y
+* 🤝 oportunidades para mezclar y anidar frameworks
+
+{/* TODO: add link to /es/guides/integrations/ */}
+También consulta nuestra Documentación de integraciones de Astro para obtener más información sobre las integraciones.
+
+## Configuración
+
+La integración de Preact en Astro maneja cómo se renderizan los componentes de Preact y tiene sus propias opciones. Cámbialas en el archivo `astro.config.mjs` que es donde residen los ajustes de integración de tu proyecto.
+
+Para un uso básico, no necesitas configurar la integración de Preact.
+
+### `compat`
+
+
+
+**Tipo:** `boolean`
+
+
+
+Puedes habilitar `preact/compat`, la capa de compatibilidad de Preact para renderizar componentes de React sin necesidad de instalar o enviar las bibliotecas más pesadas de React a los navegadores web de tus usuarios.
+
+Para hacerlo, pasa un objeto a la integración de Preact y establece `compat: true`.
+
+```js title="astro.config.mjs" "compat: true"
+import { defineConfig } from 'astro/config';
+import preact from '@astrojs/preact';
+
+export default defineConfig({
+ integrations: [preact({ compat: true })],
+});
+```
+
+Con la opción `compat` habilitada, la integración de Preact renderizará tanto componentes de React como componentes de Preact en tu proyecto y también te permitirá importar componentes de React dentro de componentes de Preact. Lee más en [“Cambiarse a Preact (desde React)”](https://preactjs.com/guide/v10/switching-to-preact) en el sitio web de Preact.
+
+Al importar bibliotecas de componentes de React, para intercambiar las dependencias de `react` y `react-dom` por `preact/compat`, puedes usar [`overrides`](https://docs.npmjs.com/cli/v8/configuring-npm/package-json#overrides) para lograrlo.
+
+```json title="package.json"
+{
+ "overrides": {
+ "react": "npm:@preact/compat@latest",
+ "react-dom": "npm:@preact/compat@latest"
+ }
+}
+```
+
+Consulta la documentación de [overrides de `pnpm`](https://pnpm.io/package_json#pnpmoverrides) y [resolutions de `yarn`](https://yarnpkg.com/configuration/manifest#resolutions) para sus respectivas características de sobrescritura.
+
+:::note
+Actualmente, la opción `compat` solo funciona para las bibliotecas de React que exportan código como ESM. Si ocurre un error durante el tiempo de compilación, intenta agregar la biblioteca a `vite.ssr.noExternal: ['the-react-library']` en tu archivo `astro.config.mjs`.
+:::
+
+### `babel`
+
+
+
+Puedes pasar [opciones de configuración de Babel](https://babeljs.io/docs/options) adicionales al plugin de Vite para Preact. Esto te permite personalizar la transformación de Babel aplicada a tus componentes de Preact.
+
+Por ejemplo, la siguiente configuración le indica a Babel que cargue `.babelrc` al procesar tus componentes de Preact:
+
+```js title="astro.config.mjs"
+import { defineConfig } from 'astro/config';
+import preact from '@astrojs/preact';
+
+export default defineConfig({
+ integrations: [
+ preact({
+ babel: {
+ babelrc: true,
+ },
+ }),
+ ],
+});
+```
+
+### `devtools`
+
+
+
+**Tipo:** `boolean`
+
+
+
+Puedes habilitar las [devtools de Preact](https://preactjs.github.io/preact-devtools/) en desarrollo pasando un objeto con `devtools: true` a la configuración de tu integración `preact()`:
+
+```js title="astro.config.mjs"
+import { defineConfig } from 'astro/config';
+import preact from '@astrojs/preact';
+
+export default defineConfig({
+ // ...
+ integrations: [preact({ devtools: true })],
+});
+```
+
+## Opciones
+
+### Combinando múltiples frameworks JSX
+
+Cuando utilizas múltiples frameworks JSX (React, Preact, Solid) en el mismo proyecto, Astro necesita determinar qué transformaciones específicas de cada framework JSX deben usarse para cada uno de tus componentes. Si solo has añadido la integración de un framework JSX a tu proyecto, no se necesita configuración adicional.
+
+Usa las opciones de configuración `include` (requerido) y `exclude` (opcional) para especificar qué archivos pertenecen a qué framework. Proporciona un array de archivos y/o carpetas en `include` para cada framework que estés utilizando. Se pueden usar comodines para incluir múltiples rutas de archivos.
+
+Recomendamos colocar los componentes de un mismo framework en la misma carpeta (p. ej. `/components/react/` y `/components/solid/`) para que sea más fácil especificar tus inclusiones, pero esto no es obligatorio:
+
+```js title="astro.config.mjs"
+import { defineConfig } from 'astro/config';
+import preact from '@astrojs/preact';
+import react from '@astrojs/react';
+import svelte from '@astrojs/svelte';
+import vue from '@astrojs/vue';
+import solid from '@astrojs/solid-js';
+
+export default defineConfig({
+ // Habilita varios frameworks para soportar todo tipo de componentes.
+ // ¡No se necesita `include` si solo estás usando un único framework JSX!
+ integrations: [
+ preact({
+ include: ['**/preact/*'],
+ }),
+ react({
+ include: ['**/react/*'],
+ }),
+ solid({
+ include: ['**/solid/*'],
+ }),
+ ],
+});
+```
+
+## Ejemplos
+
+* El [ejemplo de Astro Preact](https://github.com/withastro/astro/tree/latest/examples/framework-preact) muestra cómo usar un componente interactivo de Preact en un proyecto de Astro.
+* El [ejemplo de Astro Nanostores](https://github.com/withastro/astro/tree/latest/examples/with-nanostores) muestra cómo compartir el estado entre diferentes componentes — ¡e incluso entre diferentes frameworks! — en un proyecto de Astro.
+
+[astro-integration]: /en/guides/integrations/
+
+[astro-ui-frameworks]: /es/guides/framework-components/#uso-de-componentes-de-frameworks
From c5dabc3e67f215edb1d6587d0c9fd5b48af6a754 Mon Sep 17 00:00:00 2001
From: bulebrainbrand
Date: Sat, 12 Sep 2026 03:57:16 +0900
Subject: [PATCH 24/69] i18n(ja): update guides/integrations-guide/markdoc.mdx
(#14492)
Co-authored-by: Yan <61414485+yanthomasdev@users.noreply.github.com>
---
.../ja/guides/integrations-guide/markdoc.mdx | 56 +++++++++++++++++--
1 file changed, 51 insertions(+), 5 deletions(-)
diff --git a/src/content/docs/ja/guides/integrations-guide/markdoc.mdx b/src/content/docs/ja/guides/integrations-guide/markdoc.mdx
index 37d7055e1341b..854f36cd68165 100644
--- a/src/content/docs/ja/guides/integrations-guide/markdoc.mdx
+++ b/src/content/docs/ja/guides/integrations-guide/markdoc.mdx
@@ -113,13 +113,16 @@ Markdocファイルは、コンテンツコレクション内でのみ使用で
- quick-start.mdoc
-次に、[コンテンツコレクションAPI](/ja/guides/content-collections/#querying-build-time-collections)を使用してコレクションをクエリします。
+次に、[投稿やコレクションをクエリしてレンダリングします](/ja/guides/content-collections/#querying-build-time-collections)
```astro title="src/pages/why-markdoc.astro"
---
-import { getEntry, render } from 'astro:content';
+import { getEntry, render } from "astro:content";
-const entry = await getEntry('docs', 'why-markdoc');
+const entry = await getEntry("docs", "why-markdoc");
+if (!entry) {
+ throw new Error("Entry not found");
+}
const { Content } = await render(entry);
---
@@ -142,6 +145,9 @@ const { Content } = await render(entry);
import { getEntry, render } from 'astro:content';
const entry = await getEntry('docs', 'why-markdoc');
+if (!entry) {
+ throw new Error("Entry not found");
+}
const { Content } = await render(entry);
---
@@ -180,6 +186,9 @@ export default defineMarkdocConfig({
import { getEntry, render } from 'astro:content';
const entry = await getEntry('docs', 'why-markdoc');
+if (!entry) {
+ throw new Error("Entry not found");
+}
const { Content } = await render(entry);
---
@@ -500,8 +509,14 @@ Markdocの`image`タグを使用すると、`![]()`構文では不可能な追
const { src, alt, width, height, caption } = Astro.props;
---
-
- {caption && {caption}}
+ {
+ typeof src === "string" ? (
+
+ ) : (
+
+ )
+ }
+ {caption && {caption}}
```
@@ -661,6 +676,37 @@ Markdocでネストされたタグを使用する場合、タグ内のコンテ
{% /custom-tag %}
```
+### `typographer`
+
+
+
+**Type:** `boolean`
+**Default:** `false`
+
+
+
+Markdocのスマートクォートの組み込みサポートを有効にします。通常のシングルクォートやダブルクォートを、適切なカーリークォートに置き換えられます。
+
+```js title="astro.config.mjs" ins={6}
+ import { defineConfig } from 'astro/config';
+ import markdoc from '@astrojs/markdoc';
+
+ export default defineConfig({
+ // ...
+ integrations: [markdoc({ typographer: true })],
+ });
+```
+
+```md title="src/content/docs/why-markdoc.mdoc"
+She continued, "You know what they said? They said, 'It's astonishing how fancy these smart quotes look!'. That's what they said."
+```
+
+通常の引用符は自動的に変換され、以下のようにレンダリングされます。
+
+```md
+She continued, “You know what they said? They said, ‘It’s astonishing how fancy these smart quotes look!’. That’s what they said.”
+```
+
## 例
* [Astro Markdocスターターテンプレート](https://github.com/withastro/astro/tree/latest/examples/with-markdoc)は、AstroプロジェクトでMarkdocファイルを使用する方法を示しています。
From fcd725d2a20a361a19daeef11614b47937e329ea Mon Sep 17 00:00:00 2001
From: Angel Marfil <59626670+angelmarfil@users.noreply.github.com>
Date: Fri, 11 Sep 2026 16:02:36 -0500
Subject: [PATCH 25/69] i18n(es): add `guides/integrations.mdx` (#14506)
Co-authored-by: Waxer59 <78129249+Waxer59@users.noreply.github.com>
Co-authored-by: Yan <61414485+yanthomasdev@users.noreply.github.com>
---
src/content/docs/es/guides/integrations.mdx | 608 ++++++++++++++++++
.../docs/es/guides/on-demand-rendering.mdx | 8 +-
.../errors/client-address-not-available.mdx | 2 +-
.../reference/errors/no-matching-renderer.mdx | 2 +-
4 files changed, 614 insertions(+), 6 deletions(-)
create mode 100644 src/content/docs/es/guides/integrations.mdx
diff --git a/src/content/docs/es/guides/integrations.mdx b/src/content/docs/es/guides/integrations.mdx
new file mode 100644
index 0000000000000..b6eb0274d8d43
--- /dev/null
+++ b/src/content/docs/es/guides/integrations.mdx
@@ -0,0 +1,608 @@
+---
+title: Trabajando con integraciones
+description: Aprende a añadir, configurar y crear integraciones para tu proyecto de Astro.
+i18nReady: true
+---
+
+import IntegrationsNav from '~/components/IntegrationsNav.astro';
+import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro';
+import { Steps } from '@astrojs/starlight/components';
+import { FileTree } from '@astrojs/starlight/components';
+
+Las **integraciones de Astro** añaden nuevas funcionalidades y comportamientos a tu proyecto con solo unas pocas líneas de código. Puedes usar una integración oficial, [integraciones creadas por la comunidad](#encontrar-más-integraciones) o incluso [crear tu propia integración personalizada](#construir-tu-propia-integración).
+
+Las integraciones pueden…
+
+- Habilitar React, Vue, Svelte, Solid y otros frameworks populares de UI con un [renderizador](/es/guides/framework-components/).
+- Habilitar el renderizado bajo demanda con un [adaptador SSR](/es/guides/on-demand-rendering/).
+- Integrar herramientas como MDX y Partytown con unas pocas líneas de código.
+- Añadir nuevas funciones a tu proyecto, como la generación automática de sitemaps.
+- Escribir código personalizado que se enganche al proceso de compilación, al servidor de desarrollo y más.
+
+:::tip[Directorio de integraciones]
+Explora o busca la colección completa de cientos de integraciones oficiales y de la comunidad en nuestro [directorio de integraciones](https://astro.build/integrations/). Encuentra paquetes para añadir a tu proyecto de Astro para autenticación, analíticas, rendimiento, SEO, accesibilidad, UI, herramientas de desarrollo y más.
+:::
+
+## Integraciones oficiales
+
+Las siguientes integraciones son mantenidas por Astro.
+
+
+
+## Configuración automática de integraciones
+
+Astro incluye un comando `astro add` para automatizar la configuración de las integraciones oficiales. También se pueden añadir varios plugins de la comunidad usando este comando. Por favor, consulta la documentación propia de cada integración para comprobar si es compatible con `astro add`, o si debes [instalarla manualmente](#instalación-manual).
+
+Ejecuta el comando `astro add` utilizando el gestor de paquetes de tu preferencia y nuestro asistente automático de integraciones actualizará tu archivo de configuración e instalará cualquier dependencia necesaria.
+
+
+
+ ```shell
+ npx astro add react
+ ```
+
+
+ ```shell
+ pnpm astro add react
+ ```
+
+
+ ```shell
+ yarn astro add react
+ ```
+
+
+
+¡Incluso es posible añadir múltiples integraciones al mismo tiempo!
+
+
+
+ ```shell
+ npx astro add react sitemap partytown
+ ```
+
+
+ ```shell
+ pnpm astro add react sitemap partytown
+ ```
+
+
+ ```shell
+ yarn astro add react sitemap partytown
+ ```
+
+
+
+:::note[Manejo de dependencias de integración]
+Si ves alguna advertencia como `Cannot find package '[package-name]'` después de añadir una integración, es posible que tu gestor de paquetes no haya instalado las [dependencias compartidas](https://nodejs.org/en/blog/npm/peer-dependencies/) por ti. Para instalar estos paquetes faltantes, ejecuta el siguiente comando:
+
+
+
+ ```shell
+ npm install [nombre-del-paquete]
+ ```
+
+
+ ```shell
+ pnpm add [nombre-del-paquete]
+ ```
+
+
+ ```shell
+ yarn add [nombre-del-paquete]
+ ```
+
+
+:::
+
+### Instalación manual
+
+Las integraciones de Astro siempre se añaden a través de la propiedad `integrations` en tu archivo `astro.config.mjs`.
+
+Hay tres formas comunes de importar una integración a tu proyecto de Astro:
+
+1. [Instalar una integración desde un paquete npm](#instalar-un-paquete-npm).
+2. Importar tu propia integración desde un archivo local dentro de tu proyecto.
+3. Escribir tu integración en línea, directamente en tu archivo de configuración.
+
+ ```js
+ // astro.config.mjs
+ import { defineConfig } from 'astro/config';
+ import installedIntegration from '@astrojs/vue';
+ import localIntegration from './my-integration.js';
+
+ export default defineConfig({
+ integrations: [
+ // 1. Importado desde un paquete npm instalado
+ installedIntegration(),
+ // 2. Importado desde un archivo JS local
+ localIntegration(),
+ // 3. Un objeto en línea
+ { name: 'namespace:id', hooks: { /* ... */ } },
+ ]
+ });
+ ```
+
+{/*TODO: add link to /es/reference/integrations-reference/ */}
+Consulta la referencia de la API de Integraciones para aprender todas las diferentes maneras en que puedes escribir una integración.
+
+#### Instalar un paquete npm
+
+Instala una integración de un paquete npm utilizando un gestor de paquetes y luego actualiza `astro.config.mjs` manualmente.
+
+Por ejemplo, para instalar la integración `@astrojs/sitemap`:
+
+
+1. Instala la integración en las dependencias de tu proyecto utilizando tu gestor de paquetes preferido:
+
+
+
+ ```shell
+ npm install @astrojs/sitemap
+ ```
+
+
+ ```shell
+ pnpm add @astrojs/sitemap
+ ```
+
+
+ ```shell
+ yarn add @astrojs/sitemap
+ ```
+
+
+
+2. Importa la integración en tu archivo `astro.config.mjs` y añádela a tu array `integrations[]`, junto con cualquier opción de configuración:
+
+ ```js title="astro.config.mjs" ins={2} ins="sitemap()"
+ import { defineConfig } from 'astro/config';
+ import sitemap from '@astrojs/sitemap';
+
+ export default defineConfig({
+ // ...
+ integrations: [sitemap()],
+ // ...
+ });
+ ```
+
+ Ten en cuenta que diferentes integraciones pueden tener diferentes ajustes de configuración. Lee la documentación de cada integración y aplica cualquier opción de configuración necesaria a la integración que hayas elegido en `astro.config.mjs`.
+
+
+### Opciones personalizadas
+
+Las integraciones casi siempre se crean como funciones factoría que devuelven el objeto de integración real. Esto te permite pasar argumentos y opciones a la función factoría para personalizar la integración según tu proyecto.
+
+```js
+integrations: [
+ // Ejemplo: Personaliza tu integración con argumentos de función
+ sitemap({ filter: true })
+]
+```
+
+### Alternar una integración
+
+Las integraciones falsy se ignoran, por lo que puedes activar y desactivar integraciones sin preocuparte por dejar valores booleanos o `undefined` restantes.
+
+```js
+integrations: [
+ // Ejemplo: Omite la construcción de un sitemap en Windows
+ process.platform !== 'win32' && sitemap()
+]
+```
+
+## Actualizar integraciones
+
+Para actualizar todas las integraciones oficiales a la vez, ejecuta el comando `@astrojs/upgrade`. Esto actualizará tanto Astro como todas las integraciones oficiales a sus últimas versiones.
+
+### Actualización automática
+
+
+
+ ```shell
+ # Actualizar Astro y las integraciones oficiales a la vez a la última versión
+ npx @astrojs/upgrade
+ ```
+
+
+ ```shell
+ # Actualizar Astro y las integraciones oficiales a la vez a la última versión
+ pnpm dlx @astrojs/upgrade
+ ```
+
+
+ ```shell
+ # Actualizar Astro y las integraciones oficiales a la vez a la última versión
+ yarn dlx @astrojs/upgrade
+ ```
+
+
+
+### Actualización manual
+
+Para actualizar una o más integraciones manualmente, usa el comando adecuado para tu gestor de paquetes.
+
+
+
+ ```shell
+ # Ejemplo: actualizar las integraciones de React y Partytown
+ npm install @astrojs/react@latest @astrojs/partytown@latest
+ ```
+
+
+ ```shell
+ # Ejemplo: actualizar las integraciones de React y Partytown
+ pnpm add @astrojs/react@latest @astrojs/partytown@latest
+ ```
+
+
+ ```shell
+ # Ejemplo: actualizar las integraciones de React y Partytown
+ yarn add @astrojs/react@latest @astrojs/partytown@latest
+ ```
+
+
+
+## Eliminar una integración
+
+
+1. Para eliminar una integración, primero desinstala la integración de tu proyecto.
+
+
+
+ ```shell
+ npm uninstall @astrojs/react
+ ```
+
+
+ ```shell
+ pnpm remove @astrojs/react
+ ```
+
+
+ ```shell
+ yarn remove @astrojs/react
+ ```
+
+
+
+2. A continuación, elimina la integración de tu archivo `astro.config.*`:
+
+ ```js title="astro.config.mjs" del={2,6}
+ import { defineConfig } from 'astro/config';
+ import react from '@astrojs/react';
+
+ export default defineConfig({
+ integrations: [
+ react()
+ ]
+ });
+ ```
+
+
+## Encontrar más integraciones
+
+Puedes encontrar muchas integraciones desarrolladas por la comunidad en el [Directorio de Integraciones de Astro](https://astro.build/integrations/). Sigue los enlaces para obtener instrucciones detalladas de uso y configuración.
+
+## Construir tu propia integración
+
+La API de integraciones de Astro está inspirada en Rollup y Vite, y diseñada para resultar familiar a cualquiera que haya escrito antes un plugin de Rollup o Vite.
+
+{/*TODO: add link to /es/reference/integrations-reference/ */}
+Consulta la referencia de la API de Integraciones para aprender qué pueden hacer las integraciones y cómo escribir una tú mismo.
+
+## Publicar tu integración en npm
+
+Publicar un componente de Astro es una excelente manera de reutilizar tu trabajo existente en tus proyectos y de compartirlo con la comunidad de Astro en general. Los componentes de Astro se pueden publicar directamente e instalar desde npm, al igual que cualquier otro paquete de JavaScript.
+
+¿Buscas inspiración? Revisa algunos de los [temas](https://astro.build/themes/) y [componentes](https://astro.build/integrations/) favoritos de la comunidad de Astro. También puedes [buscar en npm](https://www.npmjs.com/search?q=keywords:astro-component,withastro) para ver todo el catálogo público.
+
+:::tip[¿No quieres hacerlo solo?]
+¡Revisa la [plantilla de componentes de la comunidad de Astro](https://github.com/Princesseuh/component-template) para obtener una plantilla lista para usar y respaldada por la comunidad!
+:::
+
+### Inicio rápido
+
+Para empezar a desarrollar tu componente rápidamente, puedes usar una plantilla ya configurada.
+
+
+
+ ```shell
+ # Inicializa la plantilla de componentes de Astro en un nuevo directorio
+ npm create astro@latest my-new-component-directory -- --template component
+ ```
+
+
+ ```shell
+ # Inicializa la plantilla de componentes de Astro en un nuevo directorio
+ pnpm create astro@latest my-new-component-directory -- --template component
+ ```
+
+
+ ```shell
+ # Inicializa la plantilla de componentes de Astro en un nuevo directorio
+ yarn create astro my-new-component-directory --template component
+ ```
+
+
+
+### Crear un paquete
+
+:::note[Requisitos previos]
+Antes de empezar, te será útil tener un conocimiento básico sobre:
+
+- [Módulos de Node](https://docs.npmjs.com/creating-node-js-modules)
+- [Manifiesto del paquete (`package.json`)](https://docs.npmjs.com/creating-a-package-json-file)
+- [Workspaces](https://docs.npmjs.com/cli/v7/configuring-npm/package-json#workspaces)
+:::
+
+Para crear un nuevo paquete, configura tu entorno de desarrollo para usar **workspaces** dentro de tu proyecto. Esto te permitirá desarrollar tu componente junto a una copia funcional de Astro.
+
+
+- my-new-component-directory/
+ - demo/
+ - ... para pruebas y demostración
+ - package.json
+ - packages/
+ - my-component/
+ - index.js
+ - package.json
+ - ... archivos adicionales utilizados por el paquete
+
+
+Este ejemplo, llamado `my-project`, crea un proyecto con un único paquete, llamado `my-component`, y un directorio `demo/` para probar y demostrar el componente.
+
+Esto se configura en el archivo `package.json` de la raíz del proyecto:
+
+```json
+{
+ "name": "my-project",
+ "workspaces": ["demo", "packages/*"]
+}
+```
+
+En este ejemplo, se pueden desarrollar múltiples paquetes juntos desde el directorio `packages`. Estos paquetes también se pueden referenciar desde `demo`, donde puedes instalar una copia funcional de Astro.
+
+
+
+ ```shell
+ npm create astro@latest demo -- --template minimal
+ ```
+
+
+ ```shell
+ pnpm create astro@latest demo -- --template minimal
+ ```
+
+
+ ```shell
+ yarn create astro demo --template minimal
+ ```
+
+
+
+Hay dos archivos iniciales que conformarán tu paquete individual: `package.json` e `index.js`.
+
+#### `package.json`
+
+El `package.json` en el directorio del paquete incluye toda la información relacionada con tu paquete, incluyendo su descripción, dependencias y cualquier otro metadato del paquete.
+
+```json
+{
+ "name": "my-component",
+ "description": "Descripción del componente",
+ "version": "1.0.0",
+ "homepage": "https://github.com/owner/project#readme",
+ "type": "module",
+ "exports": {
+ ".": "./index.js",
+ "./astro": "./MyAstroComponent.astro",
+ "./react": "./MyReactComponent.jsx"
+ },
+ "files": ["index.js", "MyAstroComponent.astro", "MyReactComponent.jsx"],
+ "keywords": ["astro-component", "withastro", "... etc", "... etc"]
+}
+```
+
+##### `description`
+
+Una breve descripción de tu componente utilizada para ayudar a otros a saber qué hace.
+
+```json
+{
+ "description": "Un generador de elementos de Astro"
+}
+```
+
+##### `type`
+
+El formato de módulo utilizado por Node.js y Astro para interpretar tus archivos `index.js`.
+
+```json
+{
+ "type": "module"
+}
+```
+
+Usa `"type": "module"` para que tu `index.js` pueda usarse como punto de entrada con `import` y `export` .
+
+##### `homepage`
+
+La URL de la página principal del proyecto.
+
+```json
+{
+ "homepage": "https://github.com/owner/project#readme"
+}
+```
+
+Esta es una excelente manera de dirigir a los usuarios a una demostración en línea, documentación o a la página principal de tu proyecto.
+
+##### `exports`
+
+Los puntos de entrada de un paquete cuando se importa por su nombre.
+
+```json
+{
+ "exports": {
+ ".": "./index.js",
+ "./astro": "./MyAstroComponent.astro",
+ "./react": "./MyReactComponent.jsx"
+ }
+}
+```
+
+En este ejemplo, importar `my-component` usaría `index.js`, mientras que importar `my-component/astro` o `my-component/react` usaría `MyAstroComponent.astro` o `MyReactComponent.jsx` respectivamente.
+
+##### `files`
+
+Una optimización opcional para excluir archivos innecesarios del paquete enviado a los usuarios a través de npm. Ten en cuenta que **solo los archivos listados aquí se incluirán en tu paquete**, por lo que si agregas o cambias archivos necesarios para que tu paquete funcione, debes actualizar esta lista en consecuencia.
+
+```json
+{
+ "files": ["index.js", "MyAstroComponent.astro", "MyReactComponent.jsx"]
+}
+```
+
+##### `keywords`
+
+Un array de palabras clave relevantes para tu componente, utilizado para ayudar a otros a [encontrar tu componente en npm](https://www.npmjs.com/search?q=keywords:astro-component,withastro) y en cualquier otro catálogo de búsqueda.
+
+Agrega `astro-component`, `astro-integration`, o `withastro` como una palabra clave especial para maximizar su visibilidad en el ecosistema de Astro.
+
+```json
+{
+ "keywords": ["astro-component", "withastro", "... etc", "... etc"]
+}
+```
+
+:::tip
+¡Nuestra [biblioteca de integraciones](https://astro.build/integrations/) también utiliza las palabras clave! [Consulta a continuación](#biblioteca-de-integraciones) la lista completa de palabras clave que buscamos en npm.
+:::
+
+---
+
+#### `index.js`
+
+El **punto de entrada principal del paquete** utilizado siempre que se importa tu paquete.
+
+```js
+export { default as MyAstroComponent } from './MyAstroComponent.astro';
+export { default as MyReactComponent } from './MyReactComponent.jsx';
+```
+
+Esto te permite empaquetar múltiples componentes juntos en una única interfaz.
+
+##### Ejemplo: Uso de importaciones con nombre
+
+```astro
+---
+import { MyAstroComponent } from 'my-component';
+import { MyReactComponent } from 'my-component';
+---
+
+
+```
+
+##### Ejemplo: Uso de importaciones de espacio de nombres
+
+```astro
+---
+import * as Example from 'example-astro-component';
+---
+
+
+```
+
+##### Ejemplo: Uso de importaciones individuales
+
+```astro
+---
+import MyAstroComponent from 'example-astro-component/astro';
+import MyReactComponent from 'example-astro-component/react';
+---
+
+
+```
+
+---
+
+### Desarrollo de tu paquete
+
+Astro no tiene un "modo de paquete" dedicado para el desarrollo. En su lugar, debes usar un proyecto de demostración para desarrollar y probar tu paquete dentro de tu proyecto. Este puede ser un sitio web privado utilizado únicamente para desarrollo, o un sitio web público de demostración/documentación para tu paquete.
+
+Si estás extrayendo componentes de un proyecto existente, incluso puedes continuar usando ese proyecto para desarrollar tus componentes recién extraídos.
+
+### Probar tu componente
+
+Actualmente, Astro no incluye un ejecutor de pruebas. _(Si te interesa ayudar con esto, [¡únete a nosotros en Discord!](https://astro.build/chat))_
+
+Mientras tanto, nuestra recomendación actual para las pruebas es:
+
+
+1. Agrega un directorio de pruebas `fixtures` a tu directorio `demo/src/pages`.
+
+2. Agrega una nueva página por cada prueba que te gustaría ejecutar.
+
+3. Cada página debe incluir un uso diferente del componente que te gustaría probar.
+
+4. Ejecuta `astro build` para compilar tus fixtures y luego compara la salida del directorio `dist/__fixtures__/` con lo que esperabas.
+
+ - my-project/demo/src/pages/\_\_fixtures\_\_/
+ - test-name-01.astro
+ - test-name-02.astro
+ - test-name-03.astro
+
+
+
+
+### Publicar tu componente
+
+Una vez que tengas tu paquete listo, puedes publicarlo en npm usando el comando `npm publish`. Si esto falla, asegúrate de haber iniciado sesión con `npm login` y de que tu archivo `package.json` esté correcto. Si se ejecuta con éxito, ¡ya terminaste!
+
+Ten en cuenta que no hubo un paso de `compilación` para los paquetes de Astro. Cualquier tipo de archivo que Astro admita de forma nativa, como `.astro`, `.ts`, `.jsx`, y `.css`, se puede publicar directamente sin un paso de compilación.
+
+Si necesitas utilizar otro tipo de archivo que Astro no admita de forma nativa, añade un paso de compilación a tu paquete. Este ejercicio avanzado corre por tu cuenta.
+
+### Biblioteca de integraciones
+
+¡Comparte tu gran trabajo añadiendo tu integración a nuestra [biblioteca de integraciones](https://astro.build/integrations/)!
+
+:::tip
+¿Necesitas ayuda para desarrollar tu integración, o simplemente quieres conocer a otros creadores de integraciones? Tenemos un canal dedicado `#integrations` en nuestro [servidor de Discord](https://astro.build/chat). ¡Ven a saludar!
+:::
+
+#### Datos de `package.json`
+
+La biblioteca se actualiza automáticamente cada semana, incorporando todos los paquetes publicados en npm con la palabra clave `astro-component`, `astro-integration`, o `withastro`.
+
+La biblioteca de integraciones lee los datos de `name`, `description`, `repository` y `homepage` desde tu archivo `package.json`.
+
+¡Los avatares son una excelente manera de destacar tu marca en la biblioteca! Una vez que tu paquete esté publicado, puedes [abrir una incidencia en GitHub](https://github.com/withastro/astro.build/issues/new/choose) con tu avatar adjunto y lo agregaremos a tu listado.
+
+:::tip
+¿Necesitas sobrescribir la información que nuestra biblioteca lee de npm? ¡No hay problema! [Abre una incidencia](https://github.com/withastro/astro.build/issues/new/choose) con la información actualizada y nos aseguraremos de utilizar tu `name`, `description`, o `homepage` personalizado en su lugar.
+:::
+
+#### Categorías
+
+Además de la palabra clave obligatoria `astro-component`, `astro-integration` o `withastro`, también se utilizan palabras clave especiales para organizar los paquetes de forma automática. Incluir cualquiera de las siguientes palabras clave añadirá tu integración a la categoría correspondiente en nuestra biblioteca de integraciones.
+
+| categoría | palabras clave |
+|--------------------------------------- | -------------------------------------------- |
+| Accesibilidad | `a11y`, `accessibility` |
+| Adaptadores | `astro-adapter` |
+| Analíticas | `analytics` |
+| CSS + UI | `css`, `ui`, `icon`, `icons`, `renderer` |
+| Frameworks | `renderer` |
+| Cargadores de contenido | `astro-loader` |
+| Imágenes + Multimedia | `media`, `image`, `images`, `video`, `audio` |
+| Rendimiento + SEO | `performance`, `perf`, `seo`, `optimization` |
+| Barra de herramientas de desarrollo | `devtools`, `dev-overlay`, `dev-toolbar` |
+| Utilidades | `tooling`, `utils`, `utility` |
+
+Los paquetes que no incluyan ninguna palabra clave que coincida con una categoría se mostrarán como `Uncategorized`.
+
+### Compartir
+
+Te animamos a compartir tu trabajo, de verdad nos encanta ver lo que crean nuestros talentosos Astronautas. ¡Ven a compartir lo que has creado con nosotros en nuestro [Discord](https://astro.build/chat) o menciona a [@astrodotbuild](https://twitter.com/astrodotbuild) en un Tweet!
diff --git a/src/content/docs/es/guides/on-demand-rendering.mdx b/src/content/docs/es/guides/on-demand-rendering.mdx
index fc2005dd7c385..f82e99f6c0e4d 100644
--- a/src/content/docs/es/guides/on-demand-rendering.mdx
+++ b/src/content/docs/es/guides/on-demand-rendering.mdx
@@ -29,7 +29,7 @@ Astro mantiene adaptadores oficiales para [Node.js](https://nodejs.org/), [Netli
### Agrega un adaptador
-Puedes agregar cualquiera de las [integraciones oficiales de adaptadores mantenidas por Astro](/es/guides/integrations/#official-integrations) con el siguiente comando `astro add`. Esto instalará el adaptador y realizará los cambios correspondientes en tu archivo `astro.config.mjs` en un solo paso.
+Puedes agregar cualquiera de las [integraciones oficiales de adaptadores mantenidas por Astro](/es/guides/integrations/#integraciones-oficiales) con el siguiente comando `astro add`. Esto instalará el adaptador y realizará los cambios correspondientes en tu archivo `astro.config.mjs` en un solo paso.
Por ejemplo, para instalar el adaptador de Netlify, ejecuta:
@@ -51,7 +51,7 @@ Por ejemplo, para instalar el adaptador de Netlify, ejecuta:
-También puedes [agregar un adaptador manualmente instalando el paquete de NPM](/es/guides/integrations/#installing-an-npm-package) (por ejemplo, `@astrojs/netlify`) y actualizando tu archivo `astro.config.mjs` por tu cuenta.
+También puedes [agregar un adaptador manualmente instalando el paquete de NPM](/es/guides/integrations/#instalar-un-paquete-npm) (por ejemplo, `@astrojs/netlify`) y actualizando tu archivo `astro.config.mjs` por tu cuenta.
Ten en cuenta que los diferentes adaptadores pueden tener configuraciones distintas. Lee la documentación de cada adaptador y aplica las opciones de configuración necesarias en `astro.config.mjs`.
@@ -73,7 +73,7 @@ export const prerender = false
Solo agrega una integración de adaptador para un entorno de servidor.
¡Todas las demás páginas se generan estáticamente en el momento de la compilación!
-->
-
+
```
El siguiente ejemplo muestra cómo excluirse del prerenderizado para mostrar un número aleatorio cada vez que se accede al endpoint:
@@ -106,7 +106,7 @@ export const prerender = true
`output: 'server' `está configurado, ¡pero esta página es estática!
¡El resto de mi sitio se renderiza bajo demanda!
-->
-
+
```
Agrega `export const prerender = true` a cualquier página o ruta para prerenderizar una página estática o endpoint:
diff --git a/src/content/docs/es/reference/errors/client-address-not-available.mdx b/src/content/docs/es/reference/errors/client-address-not-available.mdx
index ef4862d13a6c9..cd8e8ca1a44b1 100644
--- a/src/content/docs/es/reference/errors/client-address-not-available.mdx
+++ b/src/content/docs/es/reference/errors/client-address-not-available.mdx
@@ -12,5 +12,5 @@ Lamentablemente, el adaptador que estás utilizando no es compatible con `Astro.
**Ver también:**
-- [Integraciones oficiales](/es/guides/integrations/#official-integrations)
+- [Integraciones oficiales](/es/guides/integrations/#integraciones-oficiales)
- [Astro.clientAddress](/es/reference/api-reference/#clientaddress)
diff --git a/src/content/docs/es/reference/errors/no-matching-renderer.mdx b/src/content/docs/es/reference/errors/no-matching-renderer.mdx
index 6c88341ca4649..4f7c4132b159b 100644
--- a/src/content/docs/es/reference/errors/no-matching-renderer.mdx
+++ b/src/content/docs/es/reference/errors/no-matching-renderer.mdx
@@ -20,4 +20,4 @@ Para archivos JSX/TSX, [@astrojs/react](/es/guides/integrations-guide/react/), [
**Ver también:**
- [Componentes de framework](/es/guides/framework-components/)
-- [Frameworks officiales](/es/guides/integrations/#official-integrations)
+- [Frameworks oficiales](/es/guides/integrations/#integraciones-oficiales)
From 1945e96e21eb1d120e82945ec7087a3b54a35e81 Mon Sep 17 00:00:00 2001
From: Armand Philippot
Date: Sat, 12 Sep 2026 12:34:23 +0200
Subject: [PATCH 26/69] Deduplicate `` and `getImage()` props
description (#14511)
Co-authored-by: Yan <61414485+yanthomasdev@users.noreply.github.com>
---
.../en/reference/modules/astro-assets.mdx | 64 ++-----------------
1 file changed, 4 insertions(+), 60 deletions(-)
diff --git a/src/content/docs/en/reference/modules/astro-assets.mdx b/src/content/docs/en/reference/modules/astro-assets.mdx
index 774cb2e15bd18..21a41dfcbedb6 100644
--- a/src/content/docs/en/reference/modules/astro-assets.mdx
+++ b/src/content/docs/en/reference/modules/astro-assets.mdx
@@ -646,7 +646,7 @@ If you need the resulting image URL client-side, you can [pass the `src` from a
The `getImage()` function is intended for generating images destined to be used somewhere else than directly in HTML, for example in an [API Route](/en/guides/endpoints/#server-endpoints-api-routes). It also allows you to create your own custom `` component.
-This takes an options object with the [same properties as the Image component](#image-) (except `alt`) and returns a [`GetImageResult` object](#getimageresult).
+This takes an options object with the [same properties as the Image component](#image-) (except `alt` and `sizes`) and returns a [`GetImageResult` object](#getimageresult).
The following example generates an AVIF `background-image` for a ``:
@@ -1423,7 +1423,9 @@ A value ready to use in the `srcset` attribute.
**Type:** `object`
-Defines the options accepted by the image transformation service. This contains a required `src` property, optional predefined properties, and any additional properties required by the image service:
+Defines the options accepted by the image transformation service. This contains a required `src` property, optional predefined properties, and any additional properties required by the image service.
+
+The predefined properties match those accepted by the [`` component](#image-), except for `alt` and `sizes`. The following properties use different types.
#### `ImageTransform.src`
@@ -1452,64 +1454,6 @@ The width of the image.
The height of the image.
-#### `ImageTransform.widths`
-
-
-
-**Type:** `number[] | undefined`
-
-
-
-A list of widths to generate for the image.
-
-#### `ImageTransform.densities`
-
-
-
-Defines a list of allowed values for the `object-fit` CSS property, extensible with any string.
-
-#### `ImageTransform.position`
-
-
-
-**Type:** `string | undefined`
-
-
-
-Controls the value for the `object-position` CSS property.
-
### `UnresolvedImageTransform`
From f62b11a289c86c03436726fe1eab465ca46c8298 Mon Sep 17 00:00:00 2001
From: mrchatam
Date: Sat, 12 Sep 2026 14:11:17 +0330
Subject: [PATCH 27/69] docs: fix 'allows to' grammar in paginate format option
[i18nIgnore] (#14528)
Co-authored-by: Armand Philippot
---
src/content/docs/en/reference/routing-reference.mdx | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/src/content/docs/en/reference/routing-reference.mdx b/src/content/docs/en/reference/routing-reference.mdx
index df0d1ccf64a2f..c48b3f242063e 100644
--- a/src/content/docs/en/reference/routing-reference.mdx
+++ b/src/content/docs/en/reference/routing-reference.mdx
@@ -247,7 +247,7 @@ const { page } = Astro.props;
- `pageSize` - The number of items shown per page (`10` by default)
- `params` - Send additional parameters for creating dynamic routes
- `props` - Send additional props to be available on each page
- - `format` - **Since v7.1.0.** A function that allows to manipulate the computed URLs before being rendered.
+ - `format` - **Since v7.1.0.** A function that allows you to manipulate the computed URLs before being rendered.
`paginate()` assumes a file name of `[page].astro` or `[...page].astro`. The `page` param becomes the page number in your URL:
From 99dba9d030986f3febba953185b8c5c8b9049c89 Mon Sep 17 00:00:00 2001
From: Armand Philippot
Date: Sat, 12 Sep 2026 12:45:50 +0200
Subject: [PATCH 28/69] i18n(fr): update `guides/cms/emdash.mdx` (#14524)
Co-authored-by: Yan <61414485+yanthomasdev@users.noreply.github.com>
---
src/content/docs/fr/guides/cms/emdash.mdx | 225 +++++++++++++++++++++-
1 file changed, 223 insertions(+), 2 deletions(-)
diff --git a/src/content/docs/fr/guides/cms/emdash.mdx b/src/content/docs/fr/guides/cms/emdash.mdx
index 26261ad9272fe..9c2d2eb6d8171 100644
--- a/src/content/docs/fr/guides/cms/emdash.mdx
+++ b/src/content/docs/fr/guides/cms/emdash.mdx
@@ -4,14 +4,235 @@ description: Ajouter du contenu à votre projet Astro en utilisant EmDash comme
sidebar:
label: EmDash
type: cms
-stub: true
logo: emdash
i18nReady: true
---
+import { Steps } from '@astrojs/starlight/components';
+import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro';
[EmDash](https://emdashcms.com/) est un CMS open-source full-stack conçu spécifiquement pour Astro, ajoutant du contenu reposant sur une base de données, une interface d'administration, une bibliothèque multimédia, des menus et des taxonomies à votre site.
+:::tip
+Pour démarrer un **nouveau projet Astro + EmDash à partir de zéro**, utilisez la CLI d'EmDash pour générer un projet préconfiguré :
+
+
+
+ ```shell
+ npm create emdash@latest
+ ```
+
+
+ ```shell
+ pnpm create emdash@latest
+ ```
+
+
+ ```shell
+ yarn create emdash@latest
+ ```
+
+
+:::
+
+## Intégration avec Astro
+
+EmDash s'exécute au sein de votre projet Astro et s'appuie sur une base de données. Vous pouvez accéder à l'interface d'administration à l'adresse `/_emdash/admin` pour modifier le contenu. Vos pages l'afficheront en interrogeant la base de données à l'aide des [collections de contenu en direct](/fr/guides/content-collections/#collections-de-contenu-en-direct).
+
+Ce guide utilise l'[adaptateur Node.js](/fr/guides/integrations-guide/node/) et une base de données SQLite locale. Consultez la [documentation d'EmDash pour obtenir la liste des bases de données prises en charge](https://docs.emdashcms.com/deployment/database/).
+
+## Prérequis
+
+- Un projet Astro existant (Astro 6 ou une version ultérieure) configuré [avec un adaptateur](/fr/guides/on-demand-rendering/) et [`output: "server"`](/fr/reference/configuration-reference/#output).
+- Node.js v22.16.0 ou version ultérieure.
+
+## Installation des dépendances
+
+React propulse l'interface d'administration d'EmDash et est une dépendance requise. Si votre projet n'utilise pas React, installez-le à l'aide de la commande `astro add` pour votre gestionnaire de paquets :
+
+
+
+ ```shell
+ npx astro add react
+ ```
+
+
+ ```shell
+ pnpm astro add react
+ ```
+
+
+ ```shell
+ yarn astro add react
+ ```
+
+
+
+Vous devez également installer le paquet EmDash :
+
+
+
+ ```shell
+ npm install emdash
+ ```
+
+
+ ```shell
+ pnpm add emdash
+ ```
+
+
+ ```shell
+ yarn add emdash
+ ```
+
+
+
+## Ajout de l'intégration
+
+Ajoutez l'intégration `emdash()` à votre fichier de configuration d'Astro, puis configurez une base de données ainsi qu'un backend de stockage multimédia :
+
+```js title="astro.config.mjs" ins={4-5, 12-18}
+import { defineConfig } from "astro/config";
+import node from "@astrojs/node";
+import react from "@astrojs/react";
+import emdash, { local } from "emdash/astro";
+import { sqlite } from "emdash/db";
+
+export default defineConfig({
+ output: "server",
+ adapter: node({ mode: "standalone" }),
+ integrations: [
+ react(),
+ emdash({
+ database: sqlite({ url: "file:./data.db" }),
+ storage: local({
+ directory: "./uploads",
+ baseUrl: "/_emdash/api/media/file",
+ }),
+ }),
+ ],
+});
+```
+
+## Ajout du chargeur de collections en direct
+
+Créez un fichier `src/live.config.ts` afin que la couche de contenu d'Astro puisse résoudre le contenu d'EmDash :
+
+```ts title="src/live.config.ts"
+import { defineLiveCollection } from "astro:content";
+import { emdashLoader } from "emdash/runtime";
+
+export const collections = {
+ _emdash: defineLiveCollection({ loader: emdashLoader() }),
+};
+```
+
+La collection `_emdash` redirige en interne vers vos types de contenu (par exemple, articles et pages). Toutes les collections existantes reposant sur des fichiers dans `src/content.config.ts` continuent de fonctionner parallèlement à celle-ci.
+
+## Exécution d'EmDash en local
+
+EmDash nécessite que vous complétiez l'assistant de configuration avant de tester vos propres pages. Tant que la configuration n'est pas terminée, aucun contenu n'est publié et les requêtes renvoient des résultats vides.
+
+
+1. Démarrez le serveur de développement d'Astro pour initialiser la base de données et lancer l'interface d'administration :
+
+
+
+ ```shell
+ npm run dev
+ ```
+
+
+ ```shell
+ pnpm run dev
+ ```
+
+
+ ```shell
+ yarn run dev
+ ```
+
+
+
+ Lors de la première exécution, EmDash crée `data.db` avec son schéma et deux collections par défaut : `pages` et `posts`.
+
+2. Rendez-vous sur `http://localhost:4321/_emdash/admin` dans le navigateur. EmDash vous redirige vers l'assistant de configuration.
+
+3. Dans l'étape **Site**, saisissez un titre de site et un slogan facultatif.
+
+4. Dans l'étape **Compte**, saisissez votre adresse e-mail et votre nom. Cela crée le compte administrateur.
+
+5. Dans l'étape **Se connecter**, sécurisez votre compte. Choisissez **Créer une clé d'accès** pour enregistrer une clé d'accès avec l'authentification biométrique de votre appareil, une clé de sécurité ou un code PIN.
+
+6. Connectez-vous avec votre nouvelle clé d'accès pour accéder au tableau de bord.
+
+
+## Création de votre premier article
+
+
+1. Dans le tableau de bord, cliquez sur le bouton **+ Post**.
+
+2. Ajoutez un titre et du contenu. EmDash stocke le texte enrichi au format [Portable Text](https://github.com/portabletext/portabletext), modifié dans un éditeur de blocs. Un slug d'URL est généré à partir du titre et peut être modifié dans la barre latérale.
+
+3. Cliquez sur **Enregistrer**, puis sur **Publier**. Seuls les articles publiés sont visibles par les visiteurs du site.
+
+
+## Affichage du contenu EmDash
+
+Interrogez votre contenu avec `getEmDashCollection()` et `getEmDashEntry()`. Les deux suivent le modèle des collections en direct et renvoient les résultats au moment de la requête, de sorte que les modifications publiées apparaissent sans nouvelle compilation.
+
+### Affichage d'une liste d'articles
+
+L'exemple suivant affiche une liste de tous les titres d'articles publiés, chacun étant lié à une page d'article individuelle :
+
+```astro title="src/pages/blog.astro"
+---
+import { getEmDashCollection } from "emdash";
+
+const { entries: posts } = await getEmDashCollection("posts", {
+ status: "published",
+});
+---
+
+```
+
+### 단일 게시물 표시하기
+
+개별 게시물의 콘텐츠를 표시하려면 슬러그로 게시물을 가져온 뒤 `` 컴포넌트로 Portable Text 콘텐츠를 렌더링하세요:
+
+```astro title="src/pages/posts/[...slug].astro"
+---
+import { getEmDashEntry } from "emdash";
+import { PortableText } from "emdash/ui";
+
+const { slug } = Astro.params;
+const { entry: post } = await getEmDashEntry("posts", slug);
+
+if (!post) {
+ return Astro.redirect("/404");
+}
+---
+
+
{post.data.title}
+
+
+```
+
+필터링, 페이지네이션, 초안 미리보기, 비주얼 편집에 대한 자세한 내용은 [EmDash 쿼리 가이드](https://docs.emdashcms.com/guides/querying-content/)를 참조하세요.
+
+## EmDash + Astro 배포하기
+
+EmDash는 단일 Astro 프로젝트로서 사이트와 함께 배포됩니다. 어댑터를 지원하는 호스트를 선택하고, 프로덕션 데이터베이스와 미디어 스토리지를 프로비저닝하세요.
+
+구체적인 지침은 [Node.js용 EmDash 배포 가이드](https://docs.emdashcms.com/deployment/nodejs/)와 [Cloudflare용 EmDash 배포 가이드](https://docs.emdashcms.com/deployment/cloudflare/)를 참조하세요. 선호하는 호스팅 제공업체로 배포하려면 Astro의 [배포 가이드](/ko/guides/deploy/)를 방문하여 지침을 따를 수도 있습니다.
+
## 공식 리소스
- [Astro 개발자를 위한 EmDash 문서](https://docs.emdashcms.com/coming-from/astro/)
From a01ff4f5eacc03978ad800a93da628b8a3ef204b Mon Sep 17 00:00:00 2001
From: mrchatam
Date: Mon, 14 Sep 2026 23:31:38 +0330
Subject: [PATCH 38/69] docs: set Firebase session cookie maxAge to match
expiresIn (#14534)
Signed-off-by: mrchatam
Co-authored-by: mrchatam
Co-authored-by: Armand Philippot
---
src/content/docs/en/guides/backend/firebase.mdx | 1 +
1 file changed, 1 insertion(+)
diff --git a/src/content/docs/en/guides/backend/firebase.mdx b/src/content/docs/en/guides/backend/firebase.mdx
index 9c0172a591926..0e36507d606aa 100644
--- a/src/content/docs/en/guides/backend/firebase.mdx
+++ b/src/content/docs/en/guides/backend/firebase.mdx
@@ -233,6 +233,7 @@ export const GET: APIRoute = async ({ request, cookies, redirect }) => {
cookies.set("__session", sessionCookie, {
path: "/",
+ maxAge: fiveDays / 1000,
});
return redirect("/dashboard");
From 477381594c417649b23dcb53c254b3d9b7bfee24 Mon Sep 17 00:00:00 2001
From: "Houston (Bot)" <108291165+astrobot-houston@users.noreply.github.com>
Date: Mon, 14 Sep 2026 13:09:24 -0700
Subject: [PATCH 39/69] ci: update error reference docs (#14550)
Co-authored-by: delucis <357379+delucis@users.noreply.github.com>
Co-authored-by: Armand Philippot
Co-authored-by: Yan <61414485+yanthomasdev@users.noreply.github.com>
---
.../docs/en/reference/errors/redirect-with-no-location.mdx | 2 ++
1 file changed, 2 insertions(+)
diff --git a/src/content/docs/en/reference/errors/redirect-with-no-location.mdx b/src/content/docs/en/reference/errors/redirect-with-no-location.mdx
index a71b66e5bbc61..41157653f393d 100644
--- a/src/content/docs/en/reference/errors/redirect-with-no-location.mdx
+++ b/src/content/docs/en/reference/errors/redirect-with-no-location.mdx
@@ -13,6 +13,8 @@ import DontEditWarning from '~/components/DontEditWarning.astro'
+> **RedirectWithNoLocation**: The redirect `Response` has no `Location` header. Use `Astro.redirect()` to create redirects, or add a `Location` header to the `Response`.
+
## What went wrong?
A redirect must be given a location with the `Location` header.
From 9e9cb75f2209ffbbf0bb2d0130b0de56a940e09a Mon Sep 17 00:00:00 2001
From: Armand Philippot
Date: Mon, 14 Sep 2026 22:15:25 +0200
Subject: [PATCH 40/69] Fix code snippets and outdated docs in the
Authentication guide (#14549)
Co-authored-by: Yan <61414485+yanthomasdev@users.noreply.github.com>
---
src/content/docs/en/guides/authentication.mdx | 126 ++++++++++++------
1 file changed, 82 insertions(+), 44 deletions(-)
diff --git a/src/content/docs/en/guides/authentication.mdx b/src/content/docs/en/guides/authentication.mdx
index 25544d2ac4689..6c38149ed187a 100644
--- a/src/content/docs/en/guides/authentication.mdx
+++ b/src/content/docs/en/guides/authentication.mdx
@@ -4,7 +4,7 @@ description: An intro to authentication in Astro
i18nReady: true
---
-import { Steps } from '@astrojs/starlight/components'
+import { Steps, Tabs, TabItem } from '@astrojs/starlight/components'
import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro'
import UIFrameworkTabs from '~/components/tabs/UIFrameworkTabs.astro'
import ReadMore from '~/components/ReadMore.astro'
@@ -66,12 +66,10 @@ Follow the [Better Auth Astro Guide](https://www.better-auth.com/docs/integratio
### Usage
-Better Auth offers a `createAuthClient` helper for various frameworks, including Vanilla JS, React, Vue, Svelte, and Solid.
+Better Auth offers a `createAuthClient()` helper for various frameworks, including Vanilla JS, React, Vue, Svelte, and Solid.
For example, to create a client for React, import the helper from `'better-auth/react'`:
-
-
```ts title="src/lib/auth-client.ts"
@@ -116,19 +114,26 @@ Once your client is set up, you can use it to authenticate users in your Astro c
```astro title="src/pages/index.astro"
---
-import Layout from 'src/layouts/Base.astro';
+import Layout from "../layouts/Base.astro";
---
+
```
@@ -137,12 +142,12 @@ You can then use the `auth` object to get the user's session data in your server
```astro title="src/pages/index.astro"
---
-import { auth } from "../../../lib/auth"; // import your Better Auth instance
+import { auth } from "../lib/auth"; // import your Better Auth instance
export const prerender = false; // Not needed in 'server' mode
-
+
const session = await auth.api.getSession({
- headers: Astro.request.headers,
+ headers: Astro.request.headers,
});
---
@@ -152,9 +157,9 @@ const session = await auth.api.getSession({
You can also use the `auth` object to protect your routes. The following example uses [Astro's advanced routing](/en/guides/routing/#advanced-routing) with [Hono](https://hono.dev/) to require an authenticated session for every route under `/dashboard`, redirecting to the home page otherwise:
```ts title="src/fetch.ts"
-import { Hono } from "hono";
+import { Hono, type Context, type Next } from "hono";
import { astro } from "astro/hono";
-import { auth } from "../auth"; // import your Better Auth instance
+import { auth } from "./lib/auth"; // import your Better Auth instance
const app = new Hono();
@@ -167,12 +172,14 @@ app.use(astro());
export default app;
-async function requireAuth(c, next) {
- const session = await auth.api.getSession({ headers: c.req.raw.headers });
- if (!session) {
- return c.redirect("/");
- }
- return next();
+async function requireAuth(c: Context, next: Next) {
+ const session = await auth.api.getSession({
+ headers: c.req.raw.headers,
+ });
+ if (!session) {
+ return c.redirect("/");
+ }
+ return next();
}
```
@@ -225,38 +232,67 @@ Clerk provides components that allow you to control the visibility of pages base
```astro title="src/pages/index.astro"
---
-import Layout from 'src/layouts/Base.astro';
-import { SignedIn, SignedOut, UserButton, SignInButton } from '@clerk/astro/components';
+import Layout from "../layouts/Base.astro";
+import { Show, UserButton, SignInButton } from "@clerk/astro/components";
export const prerender = false; // Not needed in 'server' mode
---
-
-
-
-
-
-
+
+
+
+
+
+
```
-Clerk also allows you to protect routes on the server using middleware. Specify which routes are protected, and prompt unauthenticated users to sign in:
+Clerk also allows you to protect routes on the server using middleware:
-```ts title="src/middleware.ts"
-import { clerkMiddleware, createRouteMatcher } from '@clerk/astro/server';
+
-const isProtectedRoute = createRouteMatcher([
- '/dashboard(.*)',
- '/forum(.*)',
-]);
+1. Set `clerkMiddleware()` as the `onRequest` handler in your middleware:
-export const onRequest = clerkMiddleware((auth, context) => {
- if (!auth().userId && isProtectedRoute(context.request)) {
- return auth().redirectToSignIn();
- }
-});
-```
+ ```ts title="src/middleware.ts"
+ import { clerkMiddleware } from "@clerk/astro/server";
+
+ export const onRequest = clerkMiddleware({
+ /* options */
+ });
+ ```
+
+2. Access the authentication state in your pages and API routes with `locals.auth()`. This allows you to check if a user is authenticated and take appropriate actions (e.g. redirecting to the sign-in page or returning a different response).
+
+
+
+ ```astro title="src/pages/dashboard.astro"
+ ---
+ const { isAuthenticated, redirectToSignIn } = Astro.locals.auth();
+
+ if (!isAuthenticated) return redirectToSignIn();
+ ---
+
+
Dashboard
+ ```
+
+
+ ```ts title="src/pages/api/data.ts"
+ import type { APIRoute } from "astro";
+
+ export const GET: APIRoute = ({ locals }) => {
+ const { isAuthenticated, userId } = locals.auth();
+
+ if (!isAuthenticated) {
+ return new Response("Unauthorized", { status: 401 });
+ }
+
+ return Response.json({ userId });
+ };
+ ```
+
+
+
### Next Steps
@@ -286,7 +322,9 @@ export const onRequest = clerkMiddleware((auth, context) => {
## Scalekit
-[Scalekit](https://scalekit.com/) is an authentication platform built for B2B and AI applications. It provides social login, enterprise SSO, magic links, and more — managing the full OAuth 2.0 / OIDC flow so you get back tokens and a user profile without building any login UI. A single Scalekit environment supports multiple applications, so users authenticate once and share the same session across all your properties (for example, `app.yourcompany.com` and `docs.yourcompany.com`).
+[Scalekit](https://scalekit.com/) is an authentication platform for B2B and AI applications. It manages the full OAuth 2.0 and OIDC flow, supporting methods such as social login, enterprise SSO, and magic links. It then returns tokens and a user profile without requiring a custom login UI.
+
+A single Scalekit environment can support multiple applications. This allows you to authenticate once and share the same session across all your properties (e.g. `app.yourcompany.com` and `docs.yourcompany.com`).
### Guide
From 8e2996acf365ced4e9fae486c121df2261a745d1 Mon Sep 17 00:00:00 2001
From: Angel Marfil <59626670+angelmarfil@users.noreply.github.com>
Date: Mon, 14 Sep 2026 19:54:38 -0500
Subject: [PATCH 41/69] i18n(es): add `guides/integrations-guide/prefetch.mdx`
(#14552)
Co-authored-by: mixto <326143391+mixto@users.noreply.github.com>
Co-authored-by: paul valladares <85648028+dreyfus92@users.noreply.github.com>
---
.../docs/es/guides/integrations-guide/prefetch.mdx | 13 +++++++++++++
1 file changed, 13 insertions(+)
create mode 100644 src/content/docs/es/guides/integrations-guide/prefetch.mdx
diff --git a/src/content/docs/es/guides/integrations-guide/prefetch.mdx b/src/content/docs/es/guides/integrations-guide/prefetch.mdx
new file mode 100644
index 0000000000000..84844856e8943
--- /dev/null
+++ b/src/content/docs/es/guides/integrations-guide/prefetch.mdx
@@ -0,0 +1,13 @@
+---
+title: '@astrojs/prefetch'
+description: La integración obsoleta de prefetch.
+sidebar:
+ label: Prefetch
+i18nReady: true
+---
+
+:::caution[Eliminado]
+`@astrojs/prefetch` ha sido reemplazado por la [funcionalidad `prefetch` integrada](/es/guides/prefetch/) introducida en Astro 3.5. Consulta la [guía de migración](/es/guides/prefetch/#migrando-desde-astrojsprefetch) para obtener instrucciones sobre cómo actualizar un proyecto más antiguo.
+
+Si todavía estás utilizando esta integración en un proyecto de Astro anterior a la versión 3.5, puedes leer una copia archivada del [README de `@astrojs/prefetch`](https://github.com/withastro/astro/blob/c47478bbf6b21973419f25234c68efb59466b368/packages%2Fintegrations%2Fprefetch%2FREADME.md) en GitHub.
+:::
From 92870c6fde19148bbf200d5b37f7b3f43c6a1be9 Mon Sep 17 00:00:00 2001
From: Junseong Park <39112954+jsparkdev@users.noreply.github.com>
Date: Tue, 15 Sep 2026 09:59:22 +0900
Subject: [PATCH 42/69] i18n(ko-KR): update `authentication`, `firebase`,
`errors/` (#14557)
Co-authored-by: paul valladares <85648028+dreyfus92@users.noreply.github.com>
---
src/content/docs/ko/guides/authentication.mdx | 135 +++++++++++-------
.../docs/ko/guides/backend/firebase.mdx | 1 +
.../errors/redirect-with-no-location.mdx | 2 +
3 files changed, 90 insertions(+), 48 deletions(-)
diff --git a/src/content/docs/ko/guides/authentication.mdx b/src/content/docs/ko/guides/authentication.mdx
index 12510a81643d5..30da31dc1bd49 100644
--- a/src/content/docs/ko/guides/authentication.mdx
+++ b/src/content/docs/ko/guides/authentication.mdx
@@ -4,12 +4,12 @@ description: Astro 인증 소개
i18nReady: true
---
-import { Steps } from '@astrojs/starlight/components'
+import { Steps, Tabs, TabItem } from '@astrojs/starlight/components'
import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro'
import UIFrameworkTabs from '~/components/tabs/UIFrameworkTabs.astro'
import ReadMore from '~/components/ReadMore.astro'
-인증 및 승인은 웹사이트 또는 앱에 대한 액세스를 관리하는 두 가지 보안 프로세스입니다. 인증은 방문자의 신원을 확인하는 반면, 승인은 보호 구역 및 자원에 대한 접근 권한을 부여합니다.
+인증 및 권한 부여는 웹사이트 또는 앱에 대한 액세스를 관리하는 두 가지 보안 프로세스입니다. 인증은 방문자의 신원을 확인하는 반면, 권한 부여는 보호 구역 및 자원에 대한 접근 권한을 부여합니다.
인증을 사용하면 사이트의 특정 영역을 로그인한 개인에 맞춰 사용자 정의할 수 있으며 개인 정보 또는 비공개 정보를 최대한 보호할 수 있습니다. 인증 라이브러리 (예: [Better Auth](https://better-auth.com/), [Clerk](https://clerk.com))는 이메일 로그인 및 OAuth 공급자와 같은 다양한 인증 방법을 위한 유틸리티를 제공합니다.
@@ -17,13 +17,13 @@ import ReadMore from '~/components/ReadMore.astro'
Astro에 대한 공식 인증 솔루션은 없지만 통합 디렉터리에서 [커뮤니티 "인증" 통합](https://astro.build/integrations/?search=auth)을 찾을 수 있습니다.
:::
-이러한 백엔드 서비스에 대한 전용 가이드에서 [Supabase로 인증을 추가](/ko/guides/backend/supabase/#supabase로-인증-추가)하거나 [Firebase로 인증을 추가](/ko/guides/backend/firebase/#firebase로-인증-추가), 또는 [Scalekit로 인증을 추가](/ko/guides/backend/scalekit/#scalekit로-인증-추가)하는 방법을 알아보세요.
+이러한 백엔드 서비스에 대한 전용 가이드에서 [Supabase로 인증을 추가](/ko/guides/backend/supabase/#supabase로-인증-추가)하거나 [Firebase로 인증을 추가](/ko/guides/backend/firebase/#firebase로-인증-추가), 또는 [Scalekit으로 인증을 추가](/ko/guides/backend/scalekit/#scalekit로-인증-추가)하는 방법을 알아보세요.
## Better Auth
Better Auth는 프레임워크에 구애받지 않는 TypeScript용 인증 (및 권한 부여) 프레임워크입니다. 기본적으로 포괄적인 기능 세트를 제공하며 고급 기능을 간편하게 추가할 수 있는 플러그인 생태계가 포함되어 있습니다.
-Astro를 즉시 지원하며, 이를 사용하여 Astro 프로젝트에 인증을 추가할 수 있습니다.
+Astro를 별도의 설정 없이 지원하며, 이를 사용하여 Astro 프로젝트에 인증을 추가할 수 있습니다.
### 설치
@@ -64,14 +64,12 @@ export const ALL: APIRoute = async (ctx) => {
자세한 내용은 [Better Auth Astro 가이드](https://www.better-auth.com/docs/integrations/astro)를 참조하세요.
-
### 사용
-Better Auth는 Vanilla JS, React, Vue, Svelte, Solid를 포함한 다양한 프레임워크를 위한 `createAuthClient` 헬퍼를 제공합니다.
+Better Auth는 Vanilla JS, React, Vue, Svelte, Solid를 포함한 다양한 프레임워크를 위한 `createAuthClient()` 헬퍼를 제공합니다.
예를 들어, React용 클라이언트를 생성하려면 `better-auth/react`에서 헬퍼를 가져옵니다:
-
```ts title="src/lib/auth-client.ts"
@@ -111,24 +109,31 @@ Better Auth는 Vanilla JS, React, Vue, Svelte, Solid를 포함한 다양한 프
-클라이언트가 설정되면 이를 사용하여 Astro 컴포넌트 또는 프레임워크별 파일에서 사용자를 인증할 수 있습니다. 다음 예시에서는 구성된 `signIn()` 및 `signOut()` 함수를 사용하여 로그인 또는 로그아웃 기능을 추가합니다.
+클라이언트가 설정되면 이를 사용하여 Astro 컴포넌트 또는 모든 프레임워크별 파일에서 사용자를 인증할 수 있습니다. 다음 예시에서는 구성된 `signIn()` 및 `signOut()` 함수를 사용하여 로그인 또는 로그아웃 기능을 추가합니다.
```astro title="src/pages/index.astro"
---
-import Layout from 'src/layouts/Base.astro';
+import Layout from "../layouts/Base.astro";
---
+
```
@@ -137,12 +142,12 @@ import Layout from 'src/layouts/Base.astro';
```astro title="src/pages/index.astro"
---
-import { auth } from "../../../lib/auth"; // Better Auth 인스턴스를 가져옵니다.
+import { auth } from "../lib/auth"; // Better Auth 인스턴스를 가져옵니다.
export const prerender = false; // 'server' 모드에서는 필요하지 않습니다.
const session = await auth.api.getSession({
- headers: Astro.request.headers,
+ headers: Astro.request.headers,
});
---
@@ -152,9 +157,9 @@ const session = await auth.api.getSession({
`auth` 객체를 사용하여 경로를 보호할 수도 있습니다. 다음 예시는 [Astro의 고급 라우팅](/ko/guides/routing/#고급-라우팅)과 [Hono](https://hono.dev/)를 사용하여 `/dashboard` 아래의 모든 경로에 인증된 세션을 요구하고, 그렇지 않으면 홈 페이지로 리디렉션합니다:
```ts title="src/fetch.ts"
-import { Hono } from "hono";
+import { Hono, type Context, type Next } from "hono";
import { astro } from "astro/hono";
-import { auth } from "../auth"; // Better Auth 인스턴스를 가져옵니다.
+import { auth } from "./lib/auth"; // Better Auth 인스턴스를 가져옵니다.
const app = new Hono();
@@ -167,12 +172,14 @@ app.use(astro());
export default app;
-async function requireAuth(c, next) {
- const session = await auth.api.getSession({ headers: c.req.raw.headers });
- if (!session) {
- return c.redirect("/");
- }
- return next();
+async function requireAuth(c: Context, next: Next) {
+ const session = await auth.api.getSession({
+ headers: c.req.raw.headers,
+ });
+ if (!session) {
+ return c.redirect("/");
+ }
+ return next();
}
```
@@ -225,37 +232,67 @@ Clerk는 사용자의 인증 상태에 따라 페이지의 표시 여부를 제
```astro title="src/pages/index.astro"
---
-import Layout from 'src/layouts/Base.astro';
-import { SignedIn, SignedOut, UserButton, SignInButton } from '@clerk/astro/components';
+import Layout from "../layouts/Base.astro";
+import { Show, UserButton, SignInButton } from "@clerk/astro/components";
export const prerender = false; // 'server' 모드에서는 필요하지 않습니다.
---
+
-
-
-
-
-
-
+
+
+
+
+
+
```
-또한 Clerk를 사용하면 미들웨어를 통해 서버에서 경로를 보호할 수 있습니다. 보호할 경로를 지정하고 인증되지 않은 사용자에게 로그인하라는 메시지를 표시할 수 있습니다:
+또한 Clerk를 사용하면 미들웨어를 통해 서버에서 경로를 보호할 수 있습니다:
-```ts title="src/middleware.ts"
-import { clerkMiddleware, createRouteMatcher } from '@clerk/astro/server';
+
-const isProtectedRoute = createRouteMatcher([
- '/dashboard(.*)',
- '/forum(.*)',
-]);
+1. 미들웨어에서 `onRequest` 핸들러로 `clerkMiddleware()`를 설정하세요:
-export const onRequest = clerkMiddleware((auth, context) => {
- if (!auth().userId && isProtectedRoute(context.request)) {
- return auth().redirectToSignIn();
- }
-});
-```
+ ```ts title="src/middleware.ts"
+ import { clerkMiddleware } from "@clerk/astro/server";
+
+ export const onRequest = clerkMiddleware({
+ /* 옵션 */
+ });
+ ```
+
+2. 페이지와 API 라우트에서 `locals.auth()`로 인증 상태에 접근하세요. 이를 통해 사용자가 인증되었는지 확인하고 적절한 조치(예: 로그인 페이지로 리디렉션하거나 다른 응답 반환)를 취할 수 있습니다.
+
+
+
+ ```astro title="src/pages/dashboard.astro"
+ ---
+ const { isAuthenticated, redirectToSignIn } = Astro.locals.auth();
+
+ if (!isAuthenticated) return redirectToSignIn();
+ ---
+
+
Dashboard
+ ```
+
+
+ ```ts title="src/pages/api/data.ts"
+ import type { APIRoute } from "astro";
+
+ export const GET: APIRoute = ({ locals }) => {
+ const { isAuthenticated, userId } = locals.auth();
+
+ if (!isAuthenticated) {
+ return new Response("Unauthorized", { status: 401 });
+ }
+
+ return Response.json({ userId });
+ };
+ ```
+
+
+
### 다음 단계
@@ -280,12 +317,14 @@ export const onRequest = clerkMiddleware((auth, context) => {
- [Astro에서 GitHub OAuth를 구현하는 예시](https://github.com/lucia-auth/example-astro-github-oauth)
- [Astro에서 Google OAuth를 구현하는 예시](https://github.com/lucia-auth/example-astro-google-oauth)
-- [Astro에서 2FA를 사용하여 이메일 및 비밀번호를 구현하는 예시 example](https://github.com/lucia-auth/example-astro-email-password-2fa)
+- [Astro에서 2FA를 사용하여 이메일 및 비밀번호를 구현하는 예시](https://github.com/lucia-auth/example-astro-email-password-2fa)
- [Astro에서 2FA와 WebAuthn를 사용하여 이메일 및 비밀번호를 구현하는 예시](https://github.com/lucia-auth/example-astro-email-password-webauthn)
## Scalekit
-[Scalekit](https://scalekit.com/)은 B2B 및 AI 애플리케이션을 위해 구축된 인증 플랫폼입니다. 소셜 로그인, 엔터프라이즈 SSO, 매직 링크 등을 제공합니다 — 전체 OAuth 2.0 / OIDC 흐름을 관리하므로 로그인 UI를 구축할 필요 없이 토큰과 사용자 프로필을 얻을 수 있습니다. 단일 Scalekit 환경이 여러 애플리케이션을 지원하므로 사용자가 한 번 인증하면 모든 속성(예: `app.yourcompany.com` 및 `docs.yourcompany.com`)에서 동일한 세션을 공유합니다.
+[Scalekit](https://scalekit.com/)은 B2B 및 AI 애플리케이션을 위한 인증 플랫폼입니다. 전체 OAuth 2.0 및 OIDC 흐름을 관리하며, 소셜 로그인, 엔터프라이즈 SSO, 매직 링크 등의 방식을 지원합니다. 그런 다음 별도의 로그인 UI 없이도 토큰과 사용자 프로필을 반환합니다.
+
+단일 Scalekit 환경은 여러 애플리케이션을 지원할 수 있습니다. 이를 통해 한 번 인증하면 모든 속성(예: `app.yourcompany.com` 및 `docs.yourcompany.com`)에서 동일한 세션을 공유할 수 있습니다.
### 가이드
diff --git a/src/content/docs/ko/guides/backend/firebase.mdx b/src/content/docs/ko/guides/backend/firebase.mdx
index ab6a85ecbcc5b..b148f4c357d5c 100644
--- a/src/content/docs/ko/guides/backend/firebase.mdx
+++ b/src/content/docs/ko/guides/backend/firebase.mdx
@@ -233,6 +233,7 @@ export const GET: APIRoute = async ({ request, cookies, redirect }) => {
cookies.set("__session", sessionCookie, {
path: "/",
+ maxAge: fiveDays / 1000,
});
return redirect("/dashboard");
diff --git a/src/content/docs/ko/reference/errors/redirect-with-no-location.mdx b/src/content/docs/ko/reference/errors/redirect-with-no-location.mdx
index 64f7540cb861d..2b97a9c79e43f 100644
--- a/src/content/docs/ko/reference/errors/redirect-with-no-location.mdx
+++ b/src/content/docs/ko/reference/errors/redirect-with-no-location.mdx
@@ -4,6 +4,8 @@ i18nReady: true
githubURL: https://github.com/withastro/astro/blob/main/packages/astro/src/core/errors/errors-data.ts
---
+> **RedirectWithNoLocation**: The redirect `Response` has no `Location` header. Use `Astro.redirect()` to create redirects, or add a `Location` header to the `Response`.
+
## 무엇이 잘못되었나요?
리디렉션에는 `Location` 헤더가 있는 위치가 제공되어야 합니다.
From 811b0afe016289d6f5268308da539817c33504bf Mon Sep 17 00:00:00 2001
From: Angel Marfil <59626670+angelmarfil@users.noreply.github.com>
Date: Mon, 14 Sep 2026 20:37:36 -0500
Subject: [PATCH 43/69] i18n(es): add `guides/integrations-guide/alpinejs.mdx`
(#14555)
Co-authored-by: paul valladares <85648028+dreyfus92@users.noreply.github.com>
---
.../es/guides/integrations-guide/alpinejs.mdx | 172 ++++++++++++++++++
1 file changed, 172 insertions(+)
create mode 100644 src/content/docs/es/guides/integrations-guide/alpinejs.mdx
diff --git a/src/content/docs/es/guides/integrations-guide/alpinejs.mdx b/src/content/docs/es/guides/integrations-guide/alpinejs.mdx
new file mode 100644
index 0000000000000..bb74fe8c0fb4a
--- /dev/null
+++ b/src/content/docs/es/guides/integrations-guide/alpinejs.mdx
@@ -0,0 +1,172 @@
+---
+type: integration
+title: '@astrojs/alpinejs'
+description: Aprende a usar la integración del framework @astrojs/alpinejs para extender el soporte de componentes en tu proyecto de Astro.
+sidebar:
+ label: Alpine.js
+githubIntegrationURL: 'https://github.com/withastro/astro/tree/main/packages/integrations/alpinejs/'
+category: renderer
+i18nReady: true
+---
+import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro';
+import Since from '~/components/Since.astro';
+
+Esta **[integración de Astro][astro-integration]** añade [Alpine.js](https://alpinejs.dev/) a tu proyecto para que puedas usar Alpine.js en cualquier lugar de tu página.
+
+## Instalación
+
+Astro incluye un comando `astro add` para automatizar la configuración de las integraciones oficiales. Si lo prefieres, puedes [instalar las integraciones manualmente](#instalación-manual) en su lugar.
+
+Para instalar `@astrojs/alpinejs`, ejecuta lo siguiente desde el directorio de tu proyecto y sigue las instrucciones:
+
+
+
+ ```sh
+ npx astro add alpinejs
+ ```
+
+
+ ```sh
+ pnpm astro add alpinejs
+ ```
+
+
+ ```sh
+ yarn astro add alpinejs
+ ```
+
+
+
+Si tienes algún problema, [no dudes en informarnos en GitHub](https://github.com/withastro/astro/issues) e intenta los pasos de instalación manual a continuación.
+
+### Instalación manual
+
+Primero, instala el paquete `@astrojs/alpinejs`.
+
+
+
+ ```sh
+ npm install @astrojs/alpinejs
+ ```
+
+
+ ```sh
+ pnpm add @astrojs/alpinejs
+ ```
+
+
+ ```sh
+ yarn add @astrojs/alpinejs
+ ```
+
+
+
+La mayoría de los gestores de paquetes también instalarán las dependencias de pares asociadas. Sin embargo, si ves una advertencia como `Cannot find package 'alpinejs'` (o similar) al iniciar Astro, tendrás que instalar Alpine.js manualmente:
+
+
+
+ ```sh
+ npm install alpinejs @types/alpinejs
+ ```
+
+
+ ```sh
+ pnpm add alpinejs @types/alpinejs
+ ```
+
+
+ ```sh
+ yarn add alpinejs @types/alpinejs
+ ```
+
+
+
+Luego, aplica la integración a tu archivo `astro.config.*` usando la propiedad `integrations`:
+
+```js ins="alpinejs()" title="astro.config.mjs" ins={2}
+import { defineConfig } from 'astro/config';
+import alpinejs from '@astrojs/alpinejs';
+
+export default defineConfig({
+ // ...
+ integrations: [alpinejs()],
+});
+```
+
+## Opciones de configuración
+
+### `entrypoint`
+
+
+
+**Tipo:** `string`
+
+
+
+Puedes extender Alpine configurando la opción `entrypoint` con un especificador de importación relativo a la raíz (p. ej. `entrypoint: "/src/entrypoint"`).
+
+La exportación por defecto de este archivo debe ser una función que acepte una instancia de Alpine antes de iniciarse. Esto permite el uso de directivas personalizadas, complementos y otras personalizaciones para casos de uso avanzados.
+
+```js title="astro.config.mjs"
+import { defineConfig } from 'astro/config';
+import alpinejs from '@astrojs/alpinejs';
+
+export default defineConfig({
+ // ...
+ integrations: [alpinejs({ entrypoint: '/src/entrypoint' })],
+});
+```
+
+```js title="src/entrypoint.ts"
+import type { Alpine } from 'alpinejs'
+import intersect from '@alpinejs/intersect'
+
+export default (Alpine: Alpine) => {
+ Alpine.plugin(intersect)
+}
+```
+
+## Uso
+
+Una vez instalada la integración, puedes usar las directivas y la sintaxis de [Alpine.js](https://alpinejs.dev/) dentro de cualquier componente de Astro. El script de Alpine.js se añade y habilita automáticamente en cada página de tu sitio web, por lo que no se necesitan directivas de cliente. Añade los scripts de los complementos en el `` de la página.
+
+El siguiente ejemplo añade el [complemento Collapse de Alpine](https://alpinejs.dev/plugins/collapse) para expandir y colapsar el texto de un párrafo:
+
+```astro title="src/pages/index.astro" ins={6} ins="x-collapse"
+---
+---
+
+
+
+
+
+
+
+
+
+
+
+ Lorem ipsum
+
+
+
+
+```
+
+## Intellisense para TypeScript
+
+La integración `@astrojs/alpine` añade `Alpine` al [objeto global window](/es/guides/typescript/#window-y-globalthis). Para el autocompletado del IDE, añade lo siguiente a tu `src/env.d.ts`:
+
+```ts title="src/env.d.ts"
+interface Window {
+ Alpine: import('alpinejs').Alpine;
+}
+```
+
+## Ejemplos
+
+* El [ejemplo de Astro y Alpine.js](https://github.com/withastro/astro/tree/main/examples/framework-alpine) muestra cómo usar Alpine.js en un proyecto de Astro.
+
+[astro-integration]: /es/guides/integrations/
+
+[astro-ui-frameworks]: /es/guides/framework-components/#uso-de-componentes-de-frameworks
From 46b8ac1a111dd13b6078bf5e9b0b0ed0e93f1f13 Mon Sep 17 00:00:00 2001
From: Angel Marfil <59626670+angelmarfil@users.noreply.github.com>
Date: Mon, 14 Sep 2026 20:42:42 -0500
Subject: [PATCH 44/69] i18n(es): add `guides/deploy/google-cloud.mdx` (#14546)
Co-authored-by: paul valladares <85648028+dreyfus92@users.noreply.github.com>
---
.../docs/es/guides/deploy/google-cloud.mdx | 91 +++++++++++++++++++
1 file changed, 91 insertions(+)
create mode 100644 src/content/docs/es/guides/deploy/google-cloud.mdx
diff --git a/src/content/docs/es/guides/deploy/google-cloud.mdx b/src/content/docs/es/guides/deploy/google-cloud.mdx
new file mode 100644
index 0000000000000..5fcd32052181a
--- /dev/null
+++ b/src/content/docs/es/guides/deploy/google-cloud.mdx
@@ -0,0 +1,91 @@
+---
+title: Despliega tu sitio Astro en Google Cloud
+description: Cómo desplegar tu sitio Astro en la web usando Google Cloud.
+sidebar:
+ label: Google Cloud
+type: deploy
+logo: google-cloud
+supports: ['ssr', 'static']
+i18nReady: true
+---
+import { Steps } from '@astrojs/starlight/components';
+
+[Google Cloud](https://cloud.google.com/) es una plataforma de alojamiento de aplicaciones web con todas las funciones que se puede utilizar para desplegar un sitio Astro.
+
+## Cómo desplegar
+
+### Cloud Storage (solo estático)
+
+
+1. [Crea un nuevo proyecto de GCP](https://console.cloud.google.com/projectcreate), o selecciona uno que ya tengas.
+
+2. Crea un nuevo bucket en [Cloud Storage](https://cloud.google.com/storage).
+
+3. Asígnale un nombre y ajusta las otras configuraciones requeridas.
+
+4. Sube tu carpeta `dist` allí o súbela usando [Cloud Build](https://cloud.google.com/build).
+
+5. Habilita el acceso público agregando un nuevo permiso a `allUsers` llamado `Storage Object Viewer`.
+
+6. Edita la configuración del sitio web y agrega `index.html` como punto de entrada y `404.html` como página de error.
+
+
+### Cloud Run (SSR y estático)
+
+Cloud Run es una plataforma serverless que te permite ejecutar un contenedor sin tener que gestionar ninguna infraestructura. Se puede utilizar para desplegar tanto sitios estáticos como SSR.
+
+#### Prepara el Servicio
+
+
+1. [Crea un nuevo proyecto de GCP](https://console.cloud.google.com/projectcreate), o selecciona uno que ya tengas.
+
+2. Asegúrate de que la [API de Cloud Run](https://console.cloud.google.com/apis/library/run.googleapis.com) esté habilitada.
+
+3. Crea un nuevo servicio.
+
+
+#### Crea el Dockerfile y Construye el Contenedor
+
+Antes de que puedas desplegar tu sitio Astro en Cloud Run, necesitas crear un Dockerfile que se utilizará para construir el contenedor. Encuentra más información sobre [cómo usar Docker con Astro](/es/recipes/docker/#creating-a-dockerfile) en nuestra sección de recetas.
+
+Una vez que el Dockerfile esté creado, constrúyelo como una imagen y súbela a Google Cloud. Hay algunas formas de lograr esto:
+
+**Construir localmente usando Docker**:
+
+Usa el comando `docker build` para construir la imagen, `docker tag` para asignarle una etiqueta, y luego `docker push` para subirla a un registro. En el caso de Google Cloud, [`Artifact Registry`](https://cloud.google.com/artifact-registry/docs/docker/pushing-and-pulling) es la opción más sencilla, pero también puedes usar [Docker Hub](https://hub.docker.com/).
+
+```bash
+# construye tu contenedor
+docker build .
+
+docker tag SOURCE_IMAGE HOSTNAME/PROJECT-ID/TARGET-IMAGE:TAG
+
+# Sube tu imagen a un registro
+docker push HOSTNAME/PROJECT-ID/IMAGE:TAG
+```
+
+Cambia los siguientes valores en los comandos anteriores para que coincidan con tu proyecto:
+
+- `SOURCE_IMAGE`: el nombre de la imagen local o el ID de la imagen.
+- `HOSTNAME`: el host del registro (`gcr.io`, `eu.gcr.io`, `asia.gcr.io`, `us.gcr.io`, `docker.io`).
+- `PROJECT`: el ID de tu proyecto de Google Cloud.
+- `TARGET-IMAGE`: el nombre de la imagen cuando se almacena en el registro.
+- `TAG` es la versión asociada con la imagen.
+
+[Lee más en la documentación de Google Cloud.](https://cloud.google.com/artifact-registry/docs/docker/pushing-and-pulling)
+
+**Usando otra herramienta**:
+
+Puedes usar una herramienta de CI/CD que soporte Docker, como [GitHub Actions](https://github.com/marketplace/actions/push-to-gcr-github-action).
+
+**Construir usando [Cloud Build](https://cloud.google.com/build)**:
+
+En lugar de construir el Dockerfile localmente, puedes indicarle a Google Cloud que construya la imagen de forma remota. Consulta la [documentación de Google Cloud Build aquí](https://cloud.google.com/build/docs/build-push-docker-image).
+
+#### Desplegar el contenedor
+
+El despliegue se puede manejar manualmente en tu terminal [usando `gcloud`](https://cloud.google.com/run/docs/deploying#service) o automáticamente usando [Cloud Build](https://cloud.google.com/build) o cualquier otro sistema de CI/CD.
+
+:::note[¿Necesitas acceso público?]
+¡No olvides agregar el permiso `Cloud Run Invoker` al grupo `allUsers` en la configuración de permisos de Cloud Run!
+:::
From b09086951fe0e100dd66726a7b06c90d89d70cdf Mon Sep 17 00:00:00 2001
From: Angel Marfil <59626670+angelmarfil@users.noreply.github.com>
Date: Mon, 14 Sep 2026 20:48:00 -0500
Subject: [PATCH 45/69] i18n(es): add `guides/deploy/gitlab.mdx` (#14545)
Co-authored-by: paul valladares <85648028+dreyfus92@users.noreply.github.com>
---
src/content/docs/es/guides/deploy/gitlab.mdx | 126 +++++++++++++++++++
1 file changed, 126 insertions(+)
create mode 100644 src/content/docs/es/guides/deploy/gitlab.mdx
diff --git a/src/content/docs/es/guides/deploy/gitlab.mdx b/src/content/docs/es/guides/deploy/gitlab.mdx
new file mode 100644
index 0000000000000..c31475bf87908
--- /dev/null
+++ b/src/content/docs/es/guides/deploy/gitlab.mdx
@@ -0,0 +1,126 @@
+---
+title: Despliega tu sitio de Astro en GitLab Pages
+description: Cómo desplegar tu sitio de Astro en la web usando GitLab Pages.
+sidebar:
+ label: GitLab Pages
+type: deploy
+logo: gitlab
+supports: ['static']
+i18nReady: true
+---
+import { Steps } from '@astrojs/starlight/components';
+
+Puedes usar [GitLab Pages](https://docs.gitlab.com/ee/user/project/pages/) para alojar un sitio de Astro para tus proyectos, grupos o cuenta de usuario de [GitLab](https://about.gitlab.com/).
+
+:::tip[¿Buscas un ejemplo?]
+¡Echa un vistazo al [proyecto de ejemplo oficial de Astro en GitLab Pages](https://gitlab.com/pages/astro)!
+:::
+
+## Cómo desplegar
+
+Puedes desplegar un sitio de Astro en GitLab Pages utilizando GitLab CI/CD para compilar y desplegar tu sitio automáticamente. Para hacer esto, tu código fuente debe estar alojado en GitLab y necesitas hacer los siguientes cambios en tu proyecto de Astro:
+
+
+
+1. Configura las opciones [`site`](/es/reference/configuration-reference/#site) y [`base`](/es/reference/configuration-reference/#base) en `astro.config.mjs`.
+
+ ```js title="astro.config.mjs" ins={4-5}
+ import { defineConfig } from 'astro/config';
+
+ export default defineConfig({
+ site: 'https://.gitlab.io',
+ base: '/',
+ outDir: 'public',
+ publicDir: 'static',
+ });
+ ```
+
+ `site`
+
+ El valor para `site` debe ser uno de los siguientes:
+
+ - La siguiente URL basada en tu nombre de usuario: `https://.gitlab.io`
+ - La siguiente URL basada en el nombre de tu grupo: `https://.gitlab.io`
+ - Tu dominio personalizado si lo tienes configurado en los ajustes de tu proyecto de GitLab: `https://example.com`
+
+ Para las instancias autogestionadas de GitLab, reemplaza `gitlab.io` con el dominio de Pages de tu instancia.
+
+ `base`
+
+ Puede que se requiera un valor para `base` para que Astro trate el nombre de tu repositorio (p. ej. `/my-repo`) como la raíz de tu sitio web.
+
+ :::note
+ No configures un parámetro `base` si tu página se sirve desde la carpeta raíz.
+ :::
+
+ El valor para `base` debe ser el nombre de tu repositorio comenzando con una barra diagonal, por ejemplo `/my-blog`. Esto es para que Astro entienda que la raíz de tu sitio web es `/my-repo`, en lugar del predeterminado `/`.
+
+ :::caution
+ Cuando este valor está configurado, todos los enlaces internos de tus páginas deben llevar como prefijo tu valor `base`:
+
+ ```astro ins="/my-repo"
+ About
+ ```
+
+ Lee más sobre cómo [configurar un valor `base`](/es/reference/configuration-reference/#base)
+ :::
+
+
+2. Renombra el directorio `public/` a `static/`.
+
+3. Configura `outDir: 'public'` en `astro.config.mjs`. Esta configuración le indica a Astro que coloque el resultado de la compilación estática en una carpeta llamada `public`, que es la carpeta requerida por GitLab Pages para exponer los archivos.
+
+ Si estabas usando el [directorio `public/`](/es/basics/project-structure/#public) como fuente de archivos estáticos en tu proyecto de Astro, renómbralo y usa ese nuevo nombre de carpeta en `astro.config.mjs` como el valor de `publicDir`.
+
+ Por ejemplo, aquí tienes la configuración correcta en `astro.config.mjs` cuando el directorio `public/` se renombra a `static/`:
+
+ ```js title="astro.config.mjs" ins={4-5}
+ import { defineConfig } from 'astro/config';
+
+ export default defineConfig({
+ outDir: 'public',
+ publicDir: 'static',
+ });
+ ```
+
+4. Cambia la carpeta de salida en `.gitignore`. En nuestro ejemplo necesitamos cambiar `dist/` a `public/`:
+
+ ```diff title=".gitignore"
+ # salida de compilación
+ -dist/
+ +public/
+ ```
+
+5. Crea un archivo llamado `.gitlab-ci.yml` en la raíz de tu proyecto con el contenido a continuación. Esto compilará y desplegará tu sitio cada vez que realices cambios en tu contenido:
+
+ ```yaml title=".gitlab-ci.yml"
+ pages:
+ # La imagen de Docker que se usará para compilar tu aplicación
+ image: node:lts
+
+ before_script:
+ - npm ci
+
+ script:
+ # Especifica aquí los pasos necesarios para compilar tu aplicación
+ - npm run build
+
+ artifacts:
+ paths:
+ # La carpeta que contiene los archivos compilados que se publicarán.
+ # Esta debe llamarse "public".
+ - public
+
+ only:
+ # Desencadena una nueva compilación y despliegue solo
+ # cuando se hace un push a la(s) rama(s) a continuación
+ - main
+ ```
+
+6. Haz un commit con tus cambios y súbelos a GitLab.
+
+7. En GitLab, ve al menú **Deploy** de tu repositorio y selecciona **Pages**. Aquí verás la URL completa de tu sitio web de GitLab Pages. Para asegurarte de que estás usando el formato de URL `https://username.gitlab.io/my-repo`, desmarca la opción **Use unique domain** en esta página.
+
+
+
+¡Tu sitio ya debería estar publicado! Cuando subas cambios al repositorio de tu proyecto de Astro, el pipeline de CI/CD de GitLab los desplegará automáticamente por ti.
From 9541ab134dea4ebd2c91695c8cc94d5854d23959 Mon Sep 17 00:00:00 2001
From: Angel Marfil <59626670+angelmarfil@users.noreply.github.com>
Date: Mon, 14 Sep 2026 20:52:28 -0500
Subject: [PATCH 46/69] i18n(es): add `guides/deploy/cloudflare.mdx` (#14543)
Co-authored-by: paul valladares <85648028+dreyfus92@users.noreply.github.com>
---
.../docs/es/guides/deploy/cloudflare.mdx | 169 ++++++++++++++++++
1 file changed, 169 insertions(+)
create mode 100644 src/content/docs/es/guides/deploy/cloudflare.mdx
diff --git a/src/content/docs/es/guides/deploy/cloudflare.mdx b/src/content/docs/es/guides/deploy/cloudflare.mdx
new file mode 100644
index 0000000000000..90768a6326f54
--- /dev/null
+++ b/src/content/docs/es/guides/deploy/cloudflare.mdx
@@ -0,0 +1,169 @@
+---
+title: Despliega tu sitio Astro en Cloudflare
+description: Cómo desplegar tu sitio Astro en la web usando Cloudflare
+sidebar:
+ label: Cloudflare
+type: deploy
+logo: cloudflare
+supports: ['ssr', 'static']
+i18nReady: true
+---
+import ReadMore from '~/components/ReadMore.astro';
+import { Steps } from '@astrojs/starlight/components';
+import StaticSsrTabs from '~/components/tabs/StaticSsrTabs.astro';
+import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro'
+
+Puedes desplegar aplicaciones full-stack, incluyendo recursos estáticos en el front-end y APIs en el back-end, así como sitios renderizados bajo demanda, en [Cloudflare Workers](https://developers.cloudflare.com/workers/static-assets/).
+
+
+:::note
+
+Cloudflare recomienda usar Cloudflare Workers para proyectos nuevos. Para proyectos de Pages existentes, consulta la [guía de migración de Cloudflare](https://developers.cloudflare.com/workers/static-assets/migration-guides/migrate-from-pages/) y su [matriz de compatibilidad](https://developers.cloudflare.com/workers/static-assets/migration-guides/migrate-from-pages/#compatibility-matrix).
+
+:::
+
+Lee más sobre el [uso del tiempo de ejecución de Cloudflare](/es/guides/integrations-guide/cloudflare/) en tu proyecto de Astro.
+## Requisitos previos
+
+Para empezar, necesitarás:
+
+- Una cuenta de Cloudflare. Si aún no tienes una, puedes crear una cuenta gratuita de Cloudflare durante el proceso.
+
+## Cloudflare Workers
+
+### Cómo desplegar con Wrangler
+
+
+1. Instala la [CLI de Wrangler](https://developers.cloudflare.com/workers/wrangler/get-started/).
+
+ ```bash
+ npm install wrangler@latest --save-dev
+ ```
+
+2. Si tu sitio utiliza renderizado bajo demanda, instala el [adaptador `@astrojs/cloudflare`](/es/guides/integrations-guide/cloudflare/).
+
+ Esto instalará el adaptador y realizará los cambios correspondientes en tu archivo `astro.config.mjs` en un solo paso.
+
+
+
+ ```sh
+ npx astro add cloudflare
+ ```
+
+
+ ```sh
+ pnpm astro add cloudflare
+ ```
+
+
+ ```sh
+ yarn astro add cloudflare
+ ```
+
+
+
+ Lee más sobre el [renderizado bajo demanda en Astro](/es/guides/on-demand-rendering/).
+
+3. Crea un [archivo de configuración de Wrangler](https://developers.cloudflare.com/workers/wrangler/configuration/).
+
+ Ejecutar `astro add cloudflare` lo creará por ti; si no estás usando el adaptador, tendrás que crearlo tú mismo.
+
+
+
+ ```jsonc title="wrangler.jsonc"
+ {
+ "name": "my-astro-app",
+ "compatibility_date": "YYYY-MM-DD", // Actualiza al día en que realices el despliegue
+ "assets": {
+ "directory": "./dist",
+ }
+ }
+ ```
+
+
+ ```jsonc title="wrangler.jsonc"
+ {
+ "main": "@astrojs/cloudflare/entrypoints/server",
+ "name": "my-astro-app",
+ "compatibility_date": "YYYY-MM-DD", // Actualiza al día en que realices el despliegue
+ "compatibility_flags": [
+ "nodejs_compat",
+ "global_fetch_strictly_public"
+ ],
+ "assets": {
+ "binding": "ASSETS",
+ "directory": "./dist"
+ },
+ "observability": {
+ "enabled": true
+ }
+ }
+ ```
+
+
+
+4. Previsualiza tu proyecto localmente con Wrangler.
+
+ ```bash
+ npx astro build && npx wrangler dev
+ ```
+
+5. Despliega usando `npx wrangler deploy`.
+
+ ```bash
+ npx astro build && npx wrangler deploy
+ ```
+
+
+Una vez que tus recursos se hayan subido, Wrangler te proporcionará una URL de vista previa para inspeccionar tu sitio.
+
+Lee más sobre el uso de las [APIs del tiempo de ejecución de Cloudflare](/es/guides/integrations-guide/cloudflare/) como los bindings.
+
+### Cómo desplegar con CI/CD
+
+También puedes usar un sistema de CI/CD como [Workers Builds](https://developers.cloudflare.com/workers/ci-cd/builds/) para compilar y desplegar automáticamente tu sitio al hacer push.
+
+Si usas Workers Builds:
+
+
+1. Sigue los pasos 1 al 3 de la sección de Wrangler anterior.
+
+2. Inicia sesión en el [panel de control de Cloudflare](https://dash.cloudflare.com/) y navega hasta `Compute > Workers & Pages`. Selecciona `Create application`.
+
+3. En la sección `Import a repository`, selecciona una cuenta de Git y luego el repositorio que contiene tu proyecto de Astro.
+
+4. Configura tu proyecto con:
+ - Comando de compilación: `npx astro build`
+ - Comando de despliegue: `npx wrangler deploy`
+
+5. Haz clic en `Save and Deploy`. Ahora puedes previsualizar tu Worker en el subdominio `workers.dev` proporcionado.
+
+
+## Solución de problemas
+
+### Comportamiento 404
+
+Para los proyectos de Workers, necesitarás configurar `not_found_handling` si deseas servir una página 404 personalizada. Puedes leer más sobre esto en la [sección de comportamiento de enrutamiento](https://developers.cloudflare.com/workers/static-assets/#routing-behavior) de la documentación de Cloudflare.
+
+```jsonc title="wrangler.jsonc"
+{
+ "assets": {
+ "directory": "./dist",
+ "not_found_handling": "404-page"
+ }
+}
+```
+
+### Hidratación del lado del cliente
+
+La hidratación del lado del cliente puede fallar debido a la configuración Auto Minify de Cloudflare. Si ves el mensaje `Hydration completed but contains mismatches` en la consola, asegúrate de desactivar Auto Minify en la configuración de Cloudflare.
+
+### APIs del tiempo de ejecución de Node.js
+
+Si estás construyendo un proyecto que utiliza renderizado bajo demanda con [el adaptador de Cloudflare](/es/guides/integrations-guide/cloudflare/) y el servidor falla al compilar con un mensaje de error como `[Error] Could not resolve "XXXX. The package "XXXX" wasn't found on the file system but is built into node.`:
+
+- Esto significa que un paquete o importación que estás utilizando en el entorno del lado del servidor no es compatible con las [APIs del tiempo de ejecución de Cloudflare](https://developers.cloudflare.com/workers/runtime-apis/nodejs/).
+
+- Si estás importando directamente una API del tiempo de ejecución de Node.js, consulta la documentación de Astro sobre la [compatibilidad con Node.js](/es/guides/integrations-guide/cloudflare/#nodejs-compatibility) en Cloudflare para ver los siguientes pasos sobre cómo resolver esto.
+
+- Si estás importando un paquete que a su vez importa una API del tiempo de ejecución de Node.js, comunícate con el autor del paquete para ver si admite la sintaxis de importación `node:*`. Si no lo hace, es posible que debas buscar un paquete alternativo.
From 013faa0a41af694da9b3c8bee3d6cc9b9420010a Mon Sep 17 00:00:00 2001
From: Armand Philippot
Date: Tue, 15 Sep 2026 16:43:23 +0200
Subject: [PATCH 47/69] i18n(fr): update `guides/backend/firebase.mdx` (#14560)
Co-authored-by: Yan <61414485+yanthomasdev@users.noreply.github.com>
---
src/content/docs/fr/guides/backend/firebase.mdx | 1 +
1 file changed, 1 insertion(+)
diff --git a/src/content/docs/fr/guides/backend/firebase.mdx b/src/content/docs/fr/guides/backend/firebase.mdx
index ae063352858d6..5b15cd468bdd8 100644
--- a/src/content/docs/fr/guides/backend/firebase.mdx
+++ b/src/content/docs/fr/guides/backend/firebase.mdx
@@ -233,6 +233,7 @@ export const GET: APIRoute = async ({ request, cookies, redirect }) => {
cookies.set("__session", sessionCookie, {
path: "/",
+ maxAge: fiveDays / 1000,
});
return redirect("/dashboard");
From 91f4e4c53af8bdd10a403fe15f3e3c83e460f68d Mon Sep 17 00:00:00 2001
From: Armand Philippot
Date: Tue, 15 Sep 2026 16:54:49 +0200
Subject: [PATCH 48/69] i18n(fr): update `guides/authentication.mdx` (#14561)
Co-authored-by: Yan <61414485+yanthomasdev@users.noreply.github.com>
---
src/content/docs/fr/guides/authentication.mdx | 126 ++++++++++++------
1 file changed, 82 insertions(+), 44 deletions(-)
diff --git a/src/content/docs/fr/guides/authentication.mdx b/src/content/docs/fr/guides/authentication.mdx
index 8f45e5aba0821..10cad95e1b77f 100644
--- a/src/content/docs/fr/guides/authentication.mdx
+++ b/src/content/docs/fr/guides/authentication.mdx
@@ -4,7 +4,7 @@ description: Une introduction à l'authentification avec Astro
i18nReady: true
---
-import { Steps } from '@astrojs/starlight/components'
+import { Steps, Tabs, TabItem } from '@astrojs/starlight/components'
import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro'
import UIFrameworkTabs from '~/components/tabs/UIFrameworkTabs.astro'
import ReadMore from '~/components/ReadMore.astro'
@@ -66,12 +66,10 @@ Suivez le [guide Astro de Better Auth](https://www.better-auth.com/docs/integrat
### Utilisation
-Better Auth propose un assistant `createAuthClient` pour divers frameworks, dont Vanilla JS, React, Vue, Svelte et Solid.
+Better Auth propose un assistant `createAuthClient()` pour divers frameworks, dont Vanilla JS, React, Vue, Svelte et Solid.
Par exemple, pour créer un client pour React, importez l'assistant depuis `'better-auth/react'` :
-
-
```ts title="src/lib/auth-client.ts"
@@ -116,19 +114,26 @@ Une fois votre client configuré, vous pouvez l'utiliser pour authentifier les u
```astro title="src/pages/index.astro"
---
-import Layout from 'src/layouts/Base.astro';
+import Layout from "../layouts/Base.astro";
---
+
```
@@ -137,12 +142,12 @@ Vous pouvez ensuite utiliser l'objet `auth` pour obtenir les données de session
```astro title="src/pages/index.astro"
---
-import { auth } from "../../../lib/auth"; // importe votre instance Better Auth
+import { auth } from "../lib/auth"; // importez votre instance Better Auth
export const prerender = false; // Pas nécessaire en mode `server`
-
+
const session = await auth.api.getSession({
- headers: Astro.request.headers,
+ headers: Astro.request.headers,
});
---
@@ -152,9 +157,9 @@ const session = await auth.api.getSession({
Vous pouvez également utiliser l'objet `auth` pour protéger vos routes. L'exemple suivant utilise [le routage avancé d'Astro](/fr/guides/routing/#routage-avancé) avec [Hono](https://hono.dev/) pour exiger une session authentifiée pour chaque route sous `/dashboard`, en redirigeant vers la page d'accueil dans le cas contraire :
```ts title="src/fetch.ts"
-import { Hono } from "hono";
+import { Hono, type Context, type Next } from "hono";
import { astro } from "astro/hono";
-import { auth } from "../auth"; // importez votre instance Better Auth
+import { auth } from "./lib/auth"; // importez votre instance Better Auth
const app = new Hono();
@@ -167,12 +172,14 @@ app.use(astro());
export default app;
-async function requireAuth(c, next) {
- const session = await auth.api.getSession({ headers: c.req.raw.headers });
- if (!session) {
- return c.redirect("/");
- }
- return next();
+async function requireAuth(c: Context, next: Next) {
+ const session = await auth.api.getSession({
+ headers: c.req.raw.headers,
+ });
+ if (!session) {
+ return c.redirect("/");
+ }
+ return next();
}
```
@@ -225,38 +232,67 @@ Clerk fournit des composants qui vous permettent de contrôler la visibilité de
```astro title="src/pages/index.astro"
---
-import Layout from 'src/layouts/Base.astro';
-import { SignedIn, SignedOut, UserButton, SignInButton } from '@clerk/astro/components';
+import Layout from "../layouts/Base.astro";
+import { Show, UserButton, SignInButton } from "@clerk/astro/components";
export const prerender = false; // Pas nécessaire en mode `server`
---
-
-
-
-
-
-
+
+
+
+
+
+
```
-Clerk vous permet également de protéger les routes sur le serveur à l'aide d'un middleware. Spécifiez les routes protégées et invitez les utilisateurs non authentifiés à se connecter :
+Clerk vous permet également de protéger les routes sur le serveur à l'aide d'un middleware :
-```ts title="src/middleware.ts"
-import { clerkMiddleware, createRouteMatcher } from '@clerk/astro/server';
+
-const isProtectedRoute = createRouteMatcher([
- '/dashboard(.*)',
- '/forum(.*)',
-]);
+1. Définissez `clerkMiddleware()` comme gestionnaire `onRequest` dans votre middleware :
-export const onRequest = clerkMiddleware((auth, context) => {
- if (!auth().userId && isProtectedRoute(context.request)) {
- return auth().redirectToSignIn();
- }
-});
-```
+ ```ts title="src/middleware.ts"
+ import { clerkMiddleware } from "@clerk/astro/server";
+
+ export const onRequest = clerkMiddleware({
+ /* options */
+ });
+ ```
+
+2. Accédez à l'état d'authentification dans vos pages et vos routes d'API avec `locals.auth()`. Cela vous permet de vérifier si un utilisateur est authentifié et de prendre les mesures appropriées (par exemple, rediriger vers la page de connexion ou renvoyer une réponse différente).
+
+
+
+ ```astro title="src/pages/dashboard.astro"
+ ---
+ const { isAuthenticated, redirectToSignIn } = Astro.locals.auth();
+
+ if (!isAuthenticated) return redirectToSignIn();
+ ---
+
+
Tableau de bord
+ ```
+
+
+ ```ts title="src/pages/api/data.ts"
+ import type { APIRoute } from "astro";
+
+ export const GET: APIRoute = ({ locals }) => {
+ const { isAuthenticated, userId } = locals.auth();
+
+ if (!isAuthenticated) {
+ return new Response("Unauthorized", { status: 401 });
+ }
+
+ return Response.json({ userId });
+ };
+ ```
+
+
+
### Prochaines étapes
@@ -286,7 +322,9 @@ export const onRequest = clerkMiddleware((auth, context) => {
## Scalekit
-[Scalekit](https://scalekit.com/) est une plateforme d'authentification conçue pour les applications B2B et d'IA. Elle propose la connexion via les réseaux sociaux, l'authentification unique (SSO) d'entreprise, les liens magiques et bien plus encore, en gérant l'intégralité du flux OAuth 2.0 / OIDC afin que vous récupériez des jetons et un profil utilisateur sans avoir à créer d'interface utilisateur de connexion. Un seul environnement Scalekit prend en charge plusieurs applications, de sorte que les utilisateurs s'authentifient une seule fois et partagent la même session sur toutes vos plateformes (par exemple, `app.votreentreprise.com` et `doc.votreentreprise.com`).
+[Scalekit](https://scalekit.com/) est une plateforme d'authentification pour les applications B2B et d'IA. Elle gère l'intégralité du flux OAuth 2.0 et OIDC, prenant en charge des méthodes telles que la connexion via les réseaux sociaux, l'authentification unique d'entreprise (SSO) et les liens magiques. Elle renvoie ensuite des jetons ainsi qu'un profil utilisateur sans nécessiter d'interface de connexion personnalisée.
+
+Un seul environnement Scalekit peut prendre en charge plusieurs applications. Cela vous permet de vous authentifier une seule fois et de partager la même session sur toutes vos plateformes (par exemple, `app.votreentreprise.com` et `doc.votreentreprise.com`).
### Guide
From a62b016958f5290ea27de3dc5ad3b498b98b52df Mon Sep 17 00:00:00 2001
From: Armand Philippot
Date: Tue, 15 Sep 2026 17:03:20 +0200
Subject: [PATCH 49/69] i18n(fr): update `errors/redirect-with-no-location.mdx`
(#14559)
Co-authored-by: Yan <61414485+yanthomasdev@users.noreply.github.com>
---
.../docs/fr/reference/errors/redirect-with-no-location.mdx | 2 ++
1 file changed, 2 insertions(+)
diff --git a/src/content/docs/fr/reference/errors/redirect-with-no-location.mdx b/src/content/docs/fr/reference/errors/redirect-with-no-location.mdx
index 6b62284cf7c86..4512ea1bbfb3c 100644
--- a/src/content/docs/fr/reference/errors/redirect-with-no-location.mdx
+++ b/src/content/docs/fr/reference/errors/redirect-with-no-location.mdx
@@ -4,6 +4,8 @@ i18nReady: true
githubURL: https://github.com/withastro/astro/blob/main/packages/astro/src/core/errors/errors-data.ts
---
+> **RedirectWithNoLocation**: The redirect `Response` has no `Location` header. Use `Astro.redirect()` to create redirects, or add a `Location` header to the `Response`.
+
## Qu'est-ce qui a mal tourné ?
Une redirection doit recevoir un emplacement avec l'en-tête `Location`.
From bef50184c2e4e316ff2a457eaefd7bf21d7bab60 Mon Sep 17 00:00:00 2001
From: Armand Philippot
Date: Tue, 15 Sep 2026 17:11:32 +0200
Subject: [PATCH 50/69] i18n(fr): update `modules/astro-assets.mdx` (#14558)
Co-authored-by: Yan <61414485+yanthomasdev@users.noreply.github.com>
---
.../fr/reference/modules/astro-assets.mdx | 64 ++-----------------
1 file changed, 4 insertions(+), 60 deletions(-)
diff --git a/src/content/docs/fr/reference/modules/astro-assets.mdx b/src/content/docs/fr/reference/modules/astro-assets.mdx
index daca5477511aa..d9c5c06e8960a 100644
--- a/src/content/docs/fr/reference/modules/astro-assets.mdx
+++ b/src/content/docs/fr/reference/modules/astro-assets.mdx
@@ -646,7 +646,7 @@ Si vous avez besoin de l'URL de l'image résultante côté client, vous pouvez [
La fonction `getImage()` est prévue pour générer des images destinées à être utilisées ailleurs que directement en HTML, par exemple dans une [route d'API](/fr/guides/endpoints/#points-de-terminaison-du-serveur-routes-api). Elle vous permet également de créer votre propre composant `` personnalisé.
-Cette fonction prend un objet d'options avec les [mêmes propriétés que le composant Image](#image-) (sauf `alt`) et renvoie un [objet `GetImageResult`](#getimageresult).
+Cette fonction prend un objet d'options avec les [mêmes propriétés que le composant Image](#image-) (sauf `alt` et `sizes`) et renvoie un [objet `GetImageResult`](#getimageresult).
L'exemple suivant génère un arrière-plan (`background-image`) au format AVIF pour un élément `` :
@@ -1423,7 +1423,9 @@ Une valeur prête à être utilisée dans l'attribut `srcset`.
**Type :** `object`
-Définit les options acceptées par le service de transformation d'images. Ceci contient une propriété `src` obligatoire, des propriétés prédéfinies facultatives et toutes les propriétés supplémentaires requises par le service d'images :
+Définit les options acceptées par le service de transformation d'images. Ceci contient une propriété `src` obligatoire, des propriétés prédéfinies facultatives et toutes les propriétés supplémentaires requises par le service d'images.
+
+Les propriétés prédéfinies correspondent à celles acceptées par le [composant ``](#image-), à l'exception de `alt` et `sizes`. Les propriétés suivantes utilisent des types différents.
#### `ImageTransform.src`
@@ -1452,64 +1454,6 @@ La largeur de l'image.
La hauteur de l'image.
-#### `ImageTransform.widths`
-
-
-
-**Type :** `number[] | undefined`
-
-
-
-Une liste de largeurs à générer pour l'image.
-
-#### `ImageTransform.densities`
-
-
-
-Définit une liste de valeurs autorisées pour la propriété CSS `object-fit`, extensible avec n'importe quelle chaîne de caractères.
-
-#### `ImageTransform.position`
-
-
-
-**Type :** `string | undefined`
-
-
-
-Contrôle la valeur de la propriété CSS `object-position`.
-
### `UnresolvedImageTransform`
+ If you're interested in helping us translate
+ docs.astro.build into one of the languages listed
+ below, you've come to the right place! This auto-updating page always lists all the
+ content that could use your help right now.
+
+
+ Before starting, please read our
+ i18n Guide
+ to learn about our translation process and how you can get involved.
+
- If you're interested in helping us translate
- docs.astro.build into one of the languages listed below,
- you've come to the right place! This auto-updating page always lists all the content that could
- use your help right now.
-
-
- Before starting, please read our
- i18n Guide
- to learn about our translation process and how you can get involved.
-
-`;
-
-/**
- * Build an SVG file showing a summary of each language’s translation progress.
- */
-export const SvgSummary = (config: LunariaConfig, status: LunariaStatus): string => {
- const localeHeight = 56; // Each locale’s summary is 56px high.
- const svgHeight = localeHeight * Math.ceil(config.locales.length / 2);
- return html``;
-};
-
-function SvgLocaleSummary(
- status: LunariaStatus,
- { label, lang }: Locale
-): { svg: string; progress: number } {
- const missingFiles = status.filter(
- (file) =>
- file.localizations.find((localization) => localization.lang === lang)?.status === 'missing'
- );
- const outdatedFiles = status.filter((file) => {
- const localization = file.localizations.find((localization) => localization.lang === lang);
- if (!localization || localization.status === 'missing') {
- return false;
- } else if (file.type === 'dictionary') {
- return 'missingKeys' in localization ? localization.missingKeys.length > 0 : false;
- } else {
- return (
- localization.status === 'outdated' ||
- ('missingKeys' in localization && localization.missingKeys.length > 0)
- );
- }
- });
-
- const doneLength = status.length - outdatedFiles.length - missingFiles.length;
- const barWidth = 184;
- const doneFraction = doneLength / status.length;
- const outdatedFraction = outdatedFiles.length / status.length;
- const doneWidth = (doneFraction * barWidth).toFixed(2);
- const outdatedWidth = ((outdatedFraction + doneFraction) * barWidth).toFixed(2);
-
- return {
- progress: doneFraction,
- svg: html`${label} (${lang})
-
- ${missingFiles.length == 0 && outdatedFiles.length == 0
- ? '100% complete, amazing job! 🎉'
- : html`${doneLength} done, ${outdatedFiles.length} outdated, ${missingFiles.length}
- missing`}
-
-
-
- `,
- };
-}
diff --git a/scripts/lunaria/styles.css b/scripts/lunaria/styles.css
new file mode 100644
index 0000000000000..2184a9cf9d50c
--- /dev/null
+++ b/scripts/lunaria/styles.css
@@ -0,0 +1,42 @@
+/* Custom styles inlined into the Lunaria dashboard after its built-in styles. */
+:root {
+ --theme-navbar-height: 6rem;
+ --theme-mobile-toc-height: 4rem;
+ --theme-accent-secondary: hsla(22, 100%, 60%, 1);
+ --theme-text: hsla(250, 14%, 90%, 1);
+ --theme-bg: hsl(256, 27%, 19%);
+ --theme-bg-gradient-top: var(--theme-bg);
+ --theme-bg-gradient-bottom: hsl(251, 29%, 11%);
+ --theme-bg-gradient: linear-gradient(
+ 180deg,
+ var(--theme-bg-gradient-top),
+ var(--theme-bg-gradient-top) calc(var(--theme-navbar-height) + var(--theme-mobile-toc-height)),
+ var(--theme-bg-gradient-bottom)
+ );
+
+ --ln-color-link: #539bf5;
+ --ln-color-table-background: hsl(252, 34%, 25%);
+ --ln-color-table-border: hsl(252, 34%, 37%);
+ --ln-color-background: var(--theme-bg-gradient);
+ --ln-color-black: var(--theme-text);
+ --ln-color-missing: var(--ln-color-black);
+ --ln-color-outdated: #fb923c;
+ --ln-color-done: #c084fc;
+
+ color-scheme: dark;
+}
+
+p a {
+ color: var(--theme-accent-secondary);
+ text-decoration: underline;
+}
+
+details summary:hover strong,
+details summary:hover::marker {
+ color: var(--theme-accent-secondary);
+}
+
+.create-button {
+ background-color: hsl(213deg 89% 64% / 20%);
+ border-radius: 0.5em;
+}
diff --git a/scripts/lunaria/styles.ts b/scripts/lunaria/styles.ts
deleted file mode 100644
index 5ce1886aa51d1..0000000000000
--- a/scripts/lunaria/styles.ts
+++ /dev/null
@@ -1,331 +0,0 @@
-import { html } from './components.ts';
-
-export const BaseStyles = html`
-
-`;
-
-export const CustomStyles = html`
-
-`;
diff --git a/scripts/lunaria/summary.ts b/scripts/lunaria/summary.ts
new file mode 100644
index 0000000000000..c3af6f2a76cf1
--- /dev/null
+++ b/scripts/lunaria/summary.ts
@@ -0,0 +1,67 @@
+import type { Locale, LunariaConfig, LunariaStatus } from '@lunariajs/core';
+import { getDashboardStatus, getLocalization, html } from '@lunariajs/core/dashboard';
+
+/**
+ * Build an SVG file showing a summary of each language’s translation progress.
+ * Embedded in the repository README and served at `https://i18n.docs.astro.build/summary.svg`.
+ */
+export const SvgSummary = (config: LunariaConfig, status: LunariaStatus): string => {
+ const localeHeight = 56; // Each locale’s summary is 56px high.
+ const svgHeight = localeHeight * Math.ceil(config.locales.length / 2);
+ return html``;
+};
+
+function SvgLocaleSummary(
+ status: LunariaStatus,
+ { label, lang }: Locale
+): { svg: string; progress: number } {
+ let missing = 0;
+ let outdated = 0;
+ for (const entry of status) {
+ const dashboardStatus = getDashboardStatus(getLocalization(entry, lang));
+ if (dashboardStatus === 'missing') missing++;
+ else if (dashboardStatus === 'outdated') outdated++;
+ }
+
+ const done = status.length - outdated - missing;
+ const barWidth = 184;
+ const doneFraction = done / status.length;
+ const outdatedFraction = outdated / status.length;
+ const doneWidth = (doneFraction * barWidth).toFixed(2);
+ const outdatedWidth = ((outdatedFraction + doneFraction) * barWidth).toFixed(2);
+ const summary =
+ missing === 0 && outdated === 0
+ ? '100% complete, amazing job! 🎉'
+ : `${done} done, ${outdated} outdated, ${missing} missing`;
+
+ return {
+ progress: doneFraction,
+ svg: html`${label} (${lang})
+ ${summary}
+
+
+ `,
+ };
+}
From c64a8686481cd33f7bd0965d79f193e67a131704 Mon Sep 17 00:00:00 2001
From: Armand Philippot
Date: Tue, 15 Sep 2026 17:35:52 +0200
Subject: [PATCH 52/69] Fix some code snippets in the Media guides (#14562)
Co-authored-by: Yan <61414485+yanthomasdev@users.noreply.github.com>
---
.../docs/en/guides/media/cloudinary.mdx | 2 +-
src/content/docs/en/guides/media/imagekit.mdx | 2 +-
src/content/docs/en/guides/media/mux.mdx | 27 ++++++++++++-------
3 files changed, 19 insertions(+), 12 deletions(-)
diff --git a/src/content/docs/en/guides/media/cloudinary.mdx b/src/content/docs/en/guides/media/cloudinary.mdx
index cf6dfd189f74f..e35e9999d9135 100644
--- a/src/content/docs/en/guides/media/cloudinary.mdx
+++ b/src/content/docs/en/guides/media/cloudinary.mdx
@@ -121,7 +121,7 @@ The Cloudinary Astro SDK provides the `cldAssetsLoader` content loader to load C
To load a collection of images or videos, set `loader: cldAssetsLoader ({})` with a `folder`, if required:
-```jsx title="config.ts"
+```jsx title="content.config.ts"
import { defineCollection } from 'astro:content';
import { cldAssetsLoader } from 'astro-cloudinary/loaders';
diff --git a/src/content/docs/en/guides/media/imagekit.mdx b/src/content/docs/en/guides/media/imagekit.mdx
index 9c90d0feed52d..1ae6153ec573c 100644
--- a/src/content/docs/en/guides/media/imagekit.mdx
+++ b/src/content/docs/en/guides/media/imagekit.mdx
@@ -428,7 +428,7 @@ const gallery = defineCollection({
}));
},
schema: z.object({
- url: z.string().url(),
+ url: z.url(),
width: z.number(),
height: z.number(),
name: z.string(),
diff --git a/src/content/docs/en/guides/media/mux.mdx b/src/content/docs/en/guides/media/mux.mdx
index 1600f85a5be7e..522499abf2017 100644
--- a/src/content/docs/en/guides/media/mux.mdx
+++ b/src/content/docs/en/guides/media/mux.mdx
@@ -86,6 +86,10 @@ You will need the `playbackId` for your asset, which can be found in your Mux da
All other [options to control the Mux web player](https://www.mux.com/docs/guides/player-api-reference/?utm_campaign=21819274-Astro&utm_source=astro-docs) (e.g. hide or display controls, style elements, disable cookies) are optional:
```astro title="src/components/StarlightVideo.astro"
+---
+import { MuxPlayer } from "@mux/mux-player-astro";
+---
+
-
```
Every live stream is recorded and saved on Mux as a video asset for future on-demand playback.
@@ -211,7 +218,7 @@ const mux = new Mux ({
To fetch information about your video to use in your Astro project, provide the video's `ASSET_ID` (available in the Mux dashboard) to the `retrieve()` helper function. This will allow you to pass values to both your Mux components and your HTML template, such as the video's title or duration:
-```astro
+```astro title="src/components/StarlightVideo.astro"
---
import Mux from "@mux/mux-node";
import { MuxPlayer } from "@mux/mux-player-astro";
@@ -278,9 +285,9 @@ Install the Astro version of Mux Uploader using your preferred package manager:
Before uploading a video, make sure you have your [Mux API access tokens](#mux-environment-api-access) configured. With those in place, you can use the `create()` function from the Mux Node SDK to start a new video upload:
-```astro
+```astro title="src/components/VideoUploader.astro"
---
-import Layout from '../../layouts/Layout.astro';
+import Layout from '../layouts/Layout.astro';
import Mux from "@mux/mux-node";
import { MuxUploader } from "@mux/mux-uploader-astro";
@@ -306,7 +313,7 @@ const upload = await mux.video.uploads.create({
You can customize the functionality and appearance of the `` with additional component attributes. In addition to styling your element, this allows you to control options such as the ability to pause a download or set a maximum file size.
-```astro
+```astro title="src/components/VideoUploader.astro"
---
import { MuxUploader } from '@mux/mux-uploader-astro';
---
@@ -331,7 +338,7 @@ Mux Uploader provides a feature-rich, dynamic UI that changes based on the curre
You can listen for these events and handle them in your Astro component with [client-side scripts](/en/guides/client-side-scripts/). A `MuxUploaderElement` type is also available.
-```astro
+```astro title="src/components/VideoUploader.astro"
---
import { MuxUploader } from '@mux/mux-uploader-astro';
---
@@ -373,4 +380,4 @@ For the full API and webhook reference, usage guides, and information about addi
- [`@mux/mux-player-astro` API reference](https://github.com/muxinc/elements/blob/main/packages/mux-player-astro/README.md)
- [`@mux/mux-uploader-astro` API reference](https://github.com/muxinc/elements/blob/main/packages/mux-uploader-astro/REFERENCE.md)
- [Building a video uploader with Mux and Astro (YouTube)](https://www.youtube.com/watch?v=aaL1k5FsWfE)
-- [Astro uploader and player code example (GitHub)](https://github.com/muxinc/examples/tree/main/astro-uploader-and-player)
\ No newline at end of file
+- [Astro uploader and player code example (GitHub)](https://github.com/muxinc/examples/tree/main/astro-uploader-and-player)
From 35bb47272da9703566866eba33fb73ad56868559 Mon Sep 17 00:00:00 2001
From: jacobortiz <54605823+jacobortiz@users.noreply.github.com>
Date: Wed, 16 Sep 2026 05:47:49 -0700
Subject: [PATCH 53/69] docs: fix typo in CONTRIBUTING.md (en-only) (#14565)
Co-authored-by: angelmarfil <59626670+angelmarfil@users.noreply.github.com>
Co-authored-by: Armand <59021693+ArmandPhilippot@users.noreply.github.com>
---
CONTRIBUTING.md | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
index a661afd021a08..efcd78b0134e2 100644
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@@ -160,7 +160,7 @@ git checkout -b add/partial-hydration-typo-fix
```
### Opening a PR
-One you have made your changes using any of the above methods, you’re ready to create a “Pull Request!”
+Once you have made your changes using any of the above methods, you’re ready to create a “Pull Request!”
This will let the Astro docs team know you have some changes to propose. At this point we can give you feedback and might request changes. For translations, we like to have at least one other person who knows the language you are translating into review the PR.
From 86728b0b20285ebdb451f6cdac1313c77a1e015f Mon Sep 17 00:00:00 2001
From: Yan <61414485+yanthomasdev@users.noreply.github.com>
Date: Wed, 16 Sep 2026 14:23:34 -0300
Subject: [PATCH 54/69] Update Lunaria Action version (#14567)
Co-authored-by: Armand Philippot <59021693+ArmandPhilippot@users.noreply.github.com>
Co-authored-by: angelmarfil <59626670+angelmarfil@users.noreply.github.com>
---
.github/workflows/lunaria.yml | 2 +-
lunaria.config.ts | 6 +++---
2 files changed, 4 insertions(+), 4 deletions(-)
diff --git a/.github/workflows/lunaria.yml b/.github/workflows/lunaria.yml
index 1abb334fa2199..643bcbf9c481d 100644
--- a/.github/workflows/lunaria.yml
+++ b/.github/workflows/lunaria.yml
@@ -33,6 +33,6 @@ jobs:
uses: ./.github/actions/install
- name: Generate Lunaria Overview
- uses: lunariajs/action@dfc554fd4330c79f8465c8bcd4257a25a663ea34 # v0.2.0
+ uses: lunariajs/action@e5ab09c3c8353fa80786d8c2149873ba3978a3a7 # v0.2.0
with:
token: ${{ secrets.FREDKBOT_GITHUB_TOKEN }}
diff --git a/lunaria.config.ts b/lunaria.config.ts
index 4f909e968b7f2..17741d053b718 100644
--- a/lunaria.config.ts
+++ b/lunaria.config.ts
@@ -1,4 +1,4 @@
-import { defineRendererConfig, html } from '@lunariajs/core';
+import { html } from '@lunariajs/core';
import { defineConfig } from '@lunariajs/core/config';
export default defineConfig({
@@ -154,7 +154,7 @@ export default defineConfig({
'statusByFile.heading': 'Translation status by file',
},
},
- renderer: defineRendererConfig({
+ renderer: {
slots: {
head: () => html``,
afterTitle: () => html`
@@ -171,5 +171,5 @@ export default defineConfig({
`,
},
- }),
+ },
});
From bb454f17d330dc54b8fc0a622e5065d5f415e34e Mon Sep 17 00:00:00 2001
From: Angel Marfil <59626670+angelmarfil@users.noreply.github.com>
Date: Wed, 16 Sep 2026 12:30:47 -0500
Subject: [PATCH 55/69] i18n(es): add `reference/modules/astro-hono.mdx`
(#14569)
Co-authored-by: Yan <61414485+yanthomasdev@users.noreply.github.com>
---
.../docs/es/reference/modules/astro-hono.mdx | 36 +++++++++++++++++++
1 file changed, 36 insertions(+)
create mode 100644 src/content/docs/es/reference/modules/astro-hono.mdx
diff --git a/src/content/docs/es/reference/modules/astro-hono.mdx b/src/content/docs/es/reference/modules/astro-hono.mdx
new file mode 100644
index 0000000000000..9f1cc6ce10512
--- /dev/null
+++ b/src/content/docs/es/reference/modules/astro-hono.mdx
@@ -0,0 +1,36 @@
+---
+title: Referencia de la API de enrutamiento de Hono
+sidebar:
+ label: 'astro/hono'
+i18nReady: true
+tableOfContents:
+ minHeadingLevel: 2
+ maxHeadingLevel: 4
+---
+import ReadMore from '~/components/ReadMore.astro';
+import Since from '~/components/Since.astro';
+
+
+
+El módulo `astro/hono` proporciona manejadores de [enrutamiento avanzado](/es/guides/routing/#enrutamiento-avanzado) construidos como envoltorios compatibles con Hono.
+
+## Importaciones de `astro/hono`
+
+```ts
+import {
+ FetchState,
+ astro,
+ actions,
+ cache,
+ i18n,
+ middleware,
+ pages,
+ redirects,
+ sessions,
+ trailingSlash,
+} from "astro/hono";
+```
+
+El módulo `astro/hono` exporta los mismos nombres de manejadores que [`astro/fetch`](/es/reference/modules/astro-fetch/), pero cada uno devuelve una función de middleware de Hono. Esto te permite mezclar los manejadores de Astro con cualquier middleware de Hono del ecosistema.
+
+Aprende cómo [usar Hono](/es/guides/routing/#uso-con-hono) con Astro en la guía de enrutamiento avanzado.
From 7326425c3162414953743b24030c8a0f975d6305 Mon Sep 17 00:00:00 2001
From: Junseong Park <39112954+jsparkdev@users.noreply.github.com>
Date: Thu, 17 Sep 2026 02:45:23 +0900
Subject: [PATCH 56/69] i18n(ko-KR): update `media/` (#14568)
Co-authored-by: Yan <61414485+yanthomasdev@users.noreply.github.com>
---
.../docs/ko/guides/media/cloudinary.mdx | 2 +-
src/content/docs/ko/guides/media/imagekit.mdx | 2 +-
src/content/docs/ko/guides/media/mux.mdx | 25 ++++++++++++-------
3 files changed, 18 insertions(+), 11 deletions(-)
diff --git a/src/content/docs/ko/guides/media/cloudinary.mdx b/src/content/docs/ko/guides/media/cloudinary.mdx
index 7a54a2aa5fda6..d2e452caea3ef 100644
--- a/src/content/docs/ko/guides/media/cloudinary.mdx
+++ b/src/content/docs/ko/guides/media/cloudinary.mdx
@@ -121,7 +121,7 @@ Cloudinary Astro SDK는 콘텐츠 컬렉션을 위한 Cloudinary 자산을 불
이미지 또는 동영상 컬렉션을 불러오려면 `loader: cldAssetsLoader ({})`의 `folder`를 설정합니다 (필요한 경우):
-```jsx title="config.ts"
+```jsx title="content.config.ts"
import { defineCollection } from 'astro:content';
import { cldAssetsLoader } from 'astro-cloudinary/loaders';
diff --git a/src/content/docs/ko/guides/media/imagekit.mdx b/src/content/docs/ko/guides/media/imagekit.mdx
index c22ed310bb97d..6ff10090dc74a 100644
--- a/src/content/docs/ko/guides/media/imagekit.mdx
+++ b/src/content/docs/ko/guides/media/imagekit.mdx
@@ -428,7 +428,7 @@ const gallery = defineCollection({
}));
},
schema: z.object({
- url: z.string().url(),
+ url: z.url(),
width: z.number(),
height: z.number(),
name: z.string(),
diff --git a/src/content/docs/ko/guides/media/mux.mdx b/src/content/docs/ko/guides/media/mux.mdx
index cd1dac4f70904..93c1c67324521 100644
--- a/src/content/docs/ko/guides/media/mux.mdx
+++ b/src/content/docs/ko/guides/media/mux.mdx
@@ -87,6 +87,10 @@ Astro 프로젝트에서 Mux Player를 다음과 같이 사용할 수도 있습
[Mux 웹 플레이어를 제어하는 다른 모든 옵션](https://www.mux.com/docs/guides/player-api-reference/?utm_campaign=21819274-Astro&utm_source=astro-docs) (예: 컨트롤 표시/숨기기, 스타일 요소, 쿠키 비활성화)은 선택 사항입니다.
```astro title="src/components/StarlightVideo.astro"
+---
+import { MuxPlayer } from "@mux/mux-player-astro";
+---
+
-
```
모든 라이브 스트림은 향후 요청 시 재생할 수 있도록 Mux에 동영상 자산으로 녹화 및 저장됩니다.
@@ -212,7 +219,7 @@ const mux = new Mux ({
Astro 프로젝트에서 사용할 동영상 정보를 가져오려면 동영상의 `ASSET_ID` (Mux 대시보드에서 확인 가능)를 `retrieve()` 도우미 함수에 제공하세요. 이를 통해 동영상 제목이나 재생 시간과 같은 값을 Mux 컴포넌트와 HTML 템플릿에 전달할 수 있습니다.
-```astro
+```astro title="src/components/StarlightVideo.astro"
---
import Mux from "@mux/mux-node";
import { MuxPlayer } from "@mux/mux-player-astro";
@@ -278,9 +285,9 @@ Mux Uploader는 파일 업로드 시 수동 파일 선택과 드래그 앤 드
동영상을 업로드하기 전에 [Mux API 액세스 토큰](#mux-환경-api-액세스)이 구성되어 있는지 확인하세요. 토큰이 구성되면 Mux Node SDK의 `create()` 함수를 사용하여 새 동영상 업로드를 시작할 수 있습니다.
-```astro
+```astro title="src/components/VideoUploader.astro"
---
-import Layout from '../../layouts/Layout.astro';
+import Layout from '../layouts/Layout.astro';
import Mux from "@mux/mux-node";
import { MuxUploader } from "@mux/mux-uploader-astro";
@@ -306,7 +313,7 @@ const upload = await mux.video.uploads.create({
추가 컴포넌트 속성을 사용하여 ``의 기능과 모양을 사용자 정의할 수 있습니다. 요소 스타일링 외에도, 다운로드 일시 중지 기능이나 최대 파일 크기 설정과 같은 옵션을 제어할 수 있습니다.
-```astro
+```astro title="src/components/VideoUploader.astro"
---
import { MuxUploader } from '@mux/mux-uploader-astro';
---
@@ -331,7 +338,7 @@ Mux Uploader는 풍부한 기능과 미디어 업로드의 현재 상태에 따
이러한 이벤트를 수신 대기하고 Astro 컴포넌트의 [클라이언트 측 스크립트](/ko/guides/client-side-scripts/)에서 처리할 수 있습니다. `MuxUploaderElement` 타입도 사용할 수 있습니다.
-```astro
+```astro title="src/components/VideoUploader.astro"
---
import { MuxUploader } from '@mux/mux-uploader-astro';
---
From 8fa406ea415c41aa68067caa49a7d1a100e1eb06 Mon Sep 17 00:00:00 2001
From: Armand Philippot
Date: Thu, 17 Sep 2026 15:52:33 +0200
Subject: [PATCH 57/69] Update the Wrangler config to fix deploy previews
(#14574)
Co-authored-by: delucis <357379+delucis@users.noreply.github.com>
---
wrangler.jsonc | 1 +
wrangler.lunaria.jsonc | 1 +
2 files changed, 2 insertions(+)
diff --git a/wrangler.jsonc b/wrangler.jsonc
index bf35f3ad8926f..3b24286b8d08e 100644
--- a/wrangler.jsonc
+++ b/wrangler.jsonc
@@ -8,6 +8,7 @@
"binding": "ASSETS",
"not_found_handling": "none",
},
+ "previews": {},
"preview_urls": true,
"workers_dev": false,
}
diff --git a/wrangler.lunaria.jsonc b/wrangler.lunaria.jsonc
index ae5a60831786f..f55c6c0c638ad 100644
--- a/wrangler.lunaria.jsonc
+++ b/wrangler.lunaria.jsonc
@@ -6,4 +6,5 @@
"directory": "./dist/lunaria",
"html_handling": "auto-trailing-slash",
},
+ "previews": {},
}
From c151c7944176619ed4b4454725aa730b933ffd6d Mon Sep 17 00:00:00 2001
From: Tomoki Yamauchi <12196684+yamotech@users.noreply.github.com>
Date: Fri, 18 Sep 2026 03:17:03 +0900
Subject: [PATCH 58/69] i18n(ja): update `tutorial/6-islands/1.mdx` (#14575)
Co-authored-by: Yan <61414485+yanthomasdev@users.noreply.github.com>
---
src/content/docs/ja/tutorial/6-islands/1.mdx | 4 ++--
1 file changed, 2 insertions(+), 2 deletions(-)
diff --git a/src/content/docs/ja/tutorial/6-islands/1.mdx b/src/content/docs/ja/tutorial/6-islands/1.mdx
index ccd8050c9bc51..b545f5225627e 100644
--- a/src/content/docs/ja/tutorial/6-islands/1.mdx
+++ b/src/content/docs/ja/tutorial/6-islands/1.mdx
@@ -53,7 +53,7 @@ Preactコンポーネントを使い、ランダムに選択されたメッセ
## Preactの挨拶用バナーを追加する
-このコンポーネントは、挨拶用メッセージの配列をpropとして受け取り、その中からランダムに1つを選んでウェルカムメッセージとして表示します。ユーザーはボタンをクリックして新しいメッセージをランダムに受け取れます。
+このコンポーネントは、挨拶用メッセージの配列をpropとして受け取り、その最初の1つをウェルカムメッセージとして表示します。ユーザーはボタンをクリックして新しいメッセージをランダムに受け取れます。
1. `src/components/`に`Greeting.jsx`という名前の新しいファイルを作成します。
@@ -96,7 +96,7 @@ Preactコンポーネントを使い、ランダムに選択されたメッセ
```
- ブラウザのプレビューを確認すると、ランダムな挨拶が表示されますが、ボタンは機能していないはずです。
+ ブラウザのプレビューを確認すると、挨拶が表示されますが、ボタンは機能していないはずです。
4. `client:load`ディレクティブを使用して、2つ目の``コンポーネントを追加します。
From 0d4fc609b9f6d61ee232b1050b310889d64ab262 Mon Sep 17 00:00:00 2001
From: Tomoki Yamauchi <12196684+yamotech@users.noreply.github.com>
Date: Fri, 18 Sep 2026 03:26:29 +0900
Subject: [PATCH 59/69] i18n(ja): add sidebar labels to tutorial unit pages
(#14572)
Co-authored-by: Yan <61414485+yanthomasdev@users.noreply.github.com>
---
src/content/docs/ja/tutorial/0-introduction/index.mdx | 2 +-
src/content/docs/ja/tutorial/1-setup/index.mdx | 2 ++
src/content/docs/ja/tutorial/2-pages/index.mdx | 2 ++
src/content/docs/ja/tutorial/3-components/index.mdx | 2 ++
src/content/docs/ja/tutorial/4-layouts/index.mdx | 2 ++
src/content/docs/ja/tutorial/5-astro-api/index.mdx | 2 ++
src/content/docs/ja/tutorial/6-islands/index.mdx | 2 ++
7 files changed, 13 insertions(+), 1 deletion(-)
diff --git a/src/content/docs/ja/tutorial/0-introduction/index.mdx b/src/content/docs/ja/tutorial/0-introduction/index.mdx
index 97b96616ccd1b..8d4c24b4be98e 100644
--- a/src/content/docs/ja/tutorial/0-introduction/index.mdx
+++ b/src/content/docs/ja/tutorial/0-introduction/index.mdx
@@ -3,7 +3,7 @@ type: tutorial
unitTitle: 'ようこそ、世界！'
title: 初めてのAstroブログ
sidebar:
- label: チュートリアル：ブログを作る
+ label: 'イントロダクション'
description: >-
プロジェクトベースのチュートリアルでAstroの基本を学びましょう。始めるために必要なすべての前提知識をお届けします！
i18nReady: true
diff --git a/src/content/docs/ja/tutorial/1-setup/index.mdx b/src/content/docs/ja/tutorial/1-setup/index.mdx
index ce9351d8bd8e6..6fb3c4c179026 100644
--- a/src/content/docs/ja/tutorial/1-setup/index.mdx
+++ b/src/content/docs/ja/tutorial/1-setup/index.mdx
@@ -2,6 +2,8 @@
type: tutorial
unitTitle: 初めてのAstroサイトの作成とデプロイ
title: 'ユニット1の導入 - 準備'
+sidebar:
+ label: 'ユニット1 - 準備'
description: >-
「初めてのAstroブログ」チュートリアル -
diff --git a/src/content/docs/ja/tutorial/2-pages/index.mdx b/src/content/docs/ja/tutorial/2-pages/index.mdx
index fc54ec58111e2..fcff401fef5ef 100644
--- a/src/content/docs/ja/tutorial/2-pages/index.mdx
+++ b/src/content/docs/ja/tutorial/2-pages/index.mdx
@@ -2,6 +2,8 @@
type: tutorial
unitTitle: 'サイトのページの作成、スタイルの適用、リンクの追加'
title: 'ユニット2の導入 - ページ'
+sidebar:
+ label: 'ユニット2 - ページ'
description: |-
「初めてのAstroブログ」チュートリアル -
サイトのページや投稿を作成し、スタイルを適用し、リンクを追加する
diff --git a/src/content/docs/ja/tutorial/3-components/index.mdx b/src/content/docs/ja/tutorial/3-components/index.mdx
index 513e8d0809769..e38b45018a276 100644
--- a/src/content/docs/ja/tutorial/3-components/index.mdx
+++ b/src/content/docs/ja/tutorial/3-components/index.mdx
@@ -2,6 +2,8 @@
type: tutorial
unitTitle: Astro UIコンポーネントの作成と設計
title: 'ユニット3の導入 - コンポーネント'
+sidebar:
+ label: 'ユニット3 - コンポーネント'
description: |-
「初めてのAstroブログ」チュートリアル -
ウェブサイト全体で共通する要素のコードを再利用するために、Astroコンポーネントを作成する
diff --git a/src/content/docs/ja/tutorial/4-layouts/index.mdx b/src/content/docs/ja/tutorial/4-layouts/index.mdx
index b0a6d77b6a921..b8e7f64c8bbf3 100644
--- a/src/content/docs/ja/tutorial/4-layouts/index.mdx
+++ b/src/content/docs/ja/tutorial/4-layouts/index.mdx
@@ -2,6 +2,8 @@
type: tutorial
unitTitle: 再利用可能なページレイアウトによる時間とエネルギーの節約
title: 'ユニット4の導入 - レイアウト'
+sidebar:
+ label: 'ユニット4 - レイアウト'
description: >-
「初めてのAstroブログ」チュートリアル -
Astroレイアウトを使用して、ページとブログ投稿で共通の要素とスタイルを共有する
diff --git a/src/content/docs/ja/tutorial/5-astro-api/index.mdx b/src/content/docs/ja/tutorial/5-astro-api/index.mdx
index e29114d8409e9..d38fab6483688 100644
--- a/src/content/docs/ja/tutorial/5-astro-api/index.mdx
+++ b/src/content/docs/ja/tutorial/5-astro-api/index.mdx
@@ -2,6 +2,8 @@
type: tutorial
unitTitle: ブログの強化
title: 'ユニット5の導入 - Astro API'
+sidebar:
+ label: 'ユニット5 - Astro API'
description: >-
「初めてのAstroブログ」チュートリアル -
プロジェクトファイルからデータを取得して、ページのコンテンツとルートを動的に生成する
diff --git a/src/content/docs/ja/tutorial/6-islands/index.mdx b/src/content/docs/ja/tutorial/6-islands/index.mdx
index 5b3ae21d75e84..01bc35a1e2887 100644
--- a/src/content/docs/ja/tutorial/6-islands/index.mdx
+++ b/src/content/docs/ja/tutorial/6-islands/index.mdx
@@ -2,6 +2,8 @@
type: tutorial
unitTitle: Astroアイランドへの出航
title: 'ユニット6の導入 - Astroアイランド'
+sidebar:
+ label: 'ユニット6 - Astroアイランド'
description: |-
「初めてのAstroブログ」チュートリアル -
Astroアイランドを使用して、フロントエンドフレームワークのコンポーネントをAstroサイトに組み込む
From 9e6e2c639932b3dc27d277ab3ae4d1e16e111fb2 Mon Sep 17 00:00:00 2001
From: Tomoki Yamauchi <12196684+yamotech@users.noreply.github.com>
Date: Fri, 18 Sep 2026 03:37:14 +0900
Subject: [PATCH 60/69] i18n(ja): update tutorial (#14571)
Co-authored-by: Yan <61414485+yanthomasdev@users.noreply.github.com>
---
src/content/docs/ja/tutorial/1-setup/3.mdx | 2 +-
src/content/docs/ja/tutorial/3-components/3.mdx | 6 +++---
src/content/docs/ja/tutorial/4-layouts/1.mdx | 2 +-
src/content/docs/ja/tutorial/5-astro-api/1.mdx | 12 ++++++------
src/content/docs/ja/tutorial/6-islands/1.mdx | 6 +++---
src/content/docs/ja/tutorial/6-islands/4.mdx | 4 ++--
6 files changed, 16 insertions(+), 16 deletions(-)
diff --git a/src/content/docs/ja/tutorial/1-setup/3.mdx b/src/content/docs/ja/tutorial/1-setup/3.mdx
index 16c8d6a8a26b4..3059e16deb4f2 100644
--- a/src/content/docs/ja/tutorial/1-setup/3.mdx
+++ b/src/content/docs/ja/tutorial/1-setup/3.mdx
@@ -29,7 +29,7 @@ import { Steps } from '@astrojs/starlight/components';
---
---
-
+
diff --git a/src/content/docs/ja/tutorial/3-components/3.mdx b/src/content/docs/ja/tutorial/3-components/3.mdx
index 20a86283b8387..67516cdc475a8 100644
--- a/src/content/docs/ja/tutorial/3-components/3.mdx
+++ b/src/content/docs/ja/tutorial/3-components/3.mdx
@@ -97,9 +97,9 @@ import Badge from "~/components/Badge.astro"
---
---
{
allPosts.map((post) => (
- )}
+
))
}
From 3144d71513d20dd3d53eee7198f12456be696d7f Mon Sep 17 00:00:00 2001
From: Yusaku Nagatani <64152685+Yusaku01@users.noreply.github.com>
Date: Fri, 18 Sep 2026 21:11:01 +0900
Subject: [PATCH 61/69] fix(ja): improve prefetch strategy introduction
---
src/content/docs/ja/guides/prefetch.mdx | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/src/content/docs/ja/guides/prefetch.mdx b/src/content/docs/ja/guides/prefetch.mdx
index 214db11af03c3..156c22f4d4cb5 100644
--- a/src/content/docs/ja/guides/prefetch.mdx
+++ b/src/content/docs/ja/guides/prefetch.mdx
@@ -48,7 +48,7 @@ Astroは、さまざまなユースケースのために、以下の4種類の
About
```
-各戦略はファインチューニングされており、必要なときにのみプリフェッチしてユーザーの帯域を節約します。たとえば、
+各戦略は、必要なときにのみプリフェッチしてユーザーの帯域幅を節約するよう、細かく調整されています。たとえば、次のように動作します。
- 訪問者が[データ節約モード](https://developer.mozilla.org/ja/docs/Web/API/NetworkInformation/saveData)や[低速なコネクション](https://developer.mozilla.org/ja/docs/Web/API/NetworkInformation/effectiveType)を使っている場合、プリフェッチは`tap`戦略にフォールバックします。
- リンク上にすばやくホバーやスクロールした場合はプリフェッチしません。
From d6a8ff2d060630043dbbd8a1acb66b73a5576089 Mon Sep 17 00:00:00 2001
From: Armand Philippot
Date: Fri, 18 Sep 2026 17:06:58 +0200
Subject: [PATCH 62/69] Fix some code snippets in the astro:assets and renderer
references (#14578)
Co-authored-by: Yan <61414485+yanthomasdev@users.noreply.github.com>
---
.../en/reference/modules/astro-assets.mdx | 20 +++++++++++++------
.../docs/en/reference/renderer-reference.mdx | 12 +++++++++--
2 files changed, 24 insertions(+), 8 deletions(-)
diff --git a/src/content/docs/en/reference/modules/astro-assets.mdx b/src/content/docs/en/reference/modules/astro-assets.mdx
index 21a41dfcbedb6..52de5ee406d98 100644
--- a/src/content/docs/en/reference/modules/astro-assets.mdx
+++ b/src/content/docs/en/reference/modules/astro-assets.mdx
@@ -453,6 +453,11 @@ The background color to use when flattening an image to transform it into the re
By default, Sharp uses a black background when flattening an image. Specifying a different background color is especially useful when transforming images with transparent backgrounds to a format that does not support transparency (e.g. `.jpeg`):
```astro title="src/components/MyComponent.astro" "background"
+---
+import { Image } from 'astro:assets';
+import myImage from '../assets/my_image.png';
+---
+
{
// ...
+ const fontPath = fontData["--font-roboto"][0]?.src[0]?.url;
const url = experimental_getFontFileURL(fontPath, context.url);
// ...
};
@@ -859,11 +865,13 @@ The following example reuses the `baseService` to create a new image service:
import { baseService } from "astro/assets";
const newImageService = {
- getURL: baseService.getURL,
- parseURL: baseService.parseURL,
- getHTMLAttributes: baseService.getHTMLAttributes,
- async transform(inputBuffer, transformOptions) {...}
-}
+ getURL: baseService.getURL,
+ parseURL: baseService.parseURL,
+ getHTMLAttributes: baseService.getHTMLAttributes,
+ async transform(inputBuffer, transformOptions) {
+ /* ... */
+ },
+};
```
### `getConfiguredImageService()`
diff --git a/src/content/docs/en/reference/renderer-reference.mdx b/src/content/docs/en/reference/renderer-reference.mdx
index ac0b478b38163..a52142f7c8142 100644
--- a/src/content/docs/en/reference/renderer-reference.mdx
+++ b/src/content/docs/en/reference/renderer-reference.mdx
@@ -151,8 +151,16 @@ Defines the [client directive](/en/reference/directives-reference/#client-direct
Renderers can use this value to conditionally include client-side hydration state. For example, a renderer can skip serializing transfer state for components that will not be hydrated:
-```ts
-async function renderToStaticMarkup(Component, props, children, metadata) {
+```ts title="my-renderer/server.ts"
+import type { AstroComponentMetadata } from 'astro';
+import { render } from './custom-render';
+
+async function renderToStaticMarkup(
+ Component: any,
+ props: Record,
+ slots: Record,
+ metadata?: AstroComponentMetadata,
+) {
const willHydrate = !!metadata?.hydrate;
// Skip serializing hydration state if the component won't be hydrated
return render(Component, props, { includeTransferState: willHydrate });
From 78841c565cfc1f21fb55e4da64bc03519486f433 Mon Sep 17 00:00:00 2001
From: Tomoki Yamauchi <12196684+yamotech@users.noreply.github.com>
Date: Sat, 19 Sep 2026 00:26:29 +0900
Subject: [PATCH 63/69] i18n(ja): update
`guides/migrate-to-astro/from-hugo.mdx` (#14577)
Co-authored-by: Yan <61414485+yanthomasdev@users.noreply.github.com>
---
src/content/docs/ja/guides/migrate-to-astro/from-hugo.mdx | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/src/content/docs/ja/guides/migrate-to-astro/from-hugo.mdx b/src/content/docs/ja/guides/migrate-to-astro/from-hugo.mdx
index f979564715f56..5f618fd1423a9 100644
--- a/src/content/docs/ja/guides/migrate-to-astro/from-hugo.mdx
+++ b/src/content/docs/ja/guides/migrate-to-astro/from-hugo.mdx
@@ -63,7 +63,7 @@ Markdownファイル内で変数や表現、UIコンポーネントなど動的
-
+
:::note[共有したいリソースがありますか？]
From 5202440e48f79ca8e9668148ace5a2e98375ae9d Mon Sep 17 00:00:00 2001
From: Tomoki Yamauchi <12196684+yamotech@users.noreply.github.com>
Date: Sat, 19 Sep 2026 00:31:38 +0900
Subject: [PATCH 64/69] i18n(ja): update `guides/backend/firebase.mdx` (#14579)
Co-authored-by: Yan <61414485+yanthomasdev@users.noreply.github.com>
---
src/content/docs/ja/guides/backend/firebase.mdx | 1 +
1 file changed, 1 insertion(+)
diff --git a/src/content/docs/ja/guides/backend/firebase.mdx b/src/content/docs/ja/guides/backend/firebase.mdx
index 8e32b76c1f3bd..2b0e09bc97581 100644
--- a/src/content/docs/ja/guides/backend/firebase.mdx
+++ b/src/content/docs/ja/guides/backend/firebase.mdx
@@ -233,6 +233,7 @@ export const GET: APIRoute = async ({ request, cookies, redirect }) => {
cookies.set("__session", sessionCookie, {
path: "/",
+ maxAge: fiveDays / 1000,
});
return redirect("/dashboard");
From 16fe0736aa4dc53b5b7e40acf3a2527e09106141 Mon Sep 17 00:00:00 2001
From: Armand Philippot
Date: Fri, 18 Sep 2026 17:53:27 +0200
Subject: [PATCH 65/69] Fix code snippets in the CMS guides (#14570)
Co-authored-by: Yan <61414485+yanthomasdev@users.noreply.github.com>
---
.../docs/en/guides/cms/apostrophecms.mdx | 14 +++---
src/content/docs/en/guides/cms/builderio.mdx | 23 ++++-----
src/content/docs/en/guides/cms/buttercms.mdx | 34 ++++++++-----
.../docs/en/guides/cms/cloudcannon.mdx | 7 ++-
src/content/docs/en/guides/cms/cosmic.mdx | 5 +-
src/content/docs/en/guides/cms/drupal.mdx | 4 +-
src/content/docs/en/guides/cms/ghost.mdx | 8 +--
src/content/docs/en/guides/cms/keystatic.mdx | 18 ++++---
src/content/docs/en/guides/cms/kontent-ai.mdx | 3 ++
src/content/docs/en/guides/cms/preprcms.mdx | 50 ++++++++-----------
src/content/docs/en/guides/cms/statamic.mdx | 8 +--
src/content/docs/en/guides/cms/storyblok.mdx | 47 +++++++++--------
src/content/docs/en/guides/cms/strapi.mdx | 13 +++--
src/content/docs/en/guides/cms/tina-cms.mdx | 4 +-
src/content/docs/en/guides/cms/umbraco.mdx | 4 +-
src/content/docs/en/guides/cms/wordpress.mdx | 10 ++--
16 files changed, 137 insertions(+), 115 deletions(-)
diff --git a/src/content/docs/en/guides/cms/apostrophecms.mdx b/src/content/docs/en/guides/cms/apostrophecms.mdx
index 614d7ecc64a07..0543c7f873ed9 100644
--- a/src/content/docs/en/guides/cms/apostrophecms.mdx
+++ b/src/content/docs/en/guides/cms/apostrophecms.mdx
@@ -391,24 +391,24 @@ const { page, pieces } = Astro.props.aposData;
To display individual blog posts, create a `BlogShow.astro` file in the Astro project `src/templates` folder with the following code:
-This component uses the `` component to display any widgets added to the `content` area and the `authorName` and `publicationDate` content entered into the fields of the same names.
+This component uses the `` component to display any widgets added to the `main` area and the `authorName` and `publicationDate` content entered into the fields of the same names.
```js title="src/templates/BlogShow.astro"
---
-import AposArea from '@apostrophecms/apostrophe-astro/components/AposArea.astro';
-import dayjs from 'dayjs';
+import AposArea from "@apostrophecms/apostrophe-astro/components/AposArea.astro";
+import dayjs from "dayjs";
const { page, piece } = Astro.props.aposData;
const { main } = piece;
---
-
{ piece.title }
-
Created by: { piece.authorName }
+
{piece.title}
+
Created by: {piece.authorName}
- Released On { dayjs(piece.publicationDate).format('MMMM D, YYYY') }
+ Released On {dayjs(piece.publicationDate).format("MMMM D, YYYY")}
-
+
```
diff --git a/src/content/docs/en/guides/cms/builderio.mdx b/src/content/docs/en/guides/cms/builderio.mdx
index 24202be12d448..e00f9d7a2635e 100644
--- a/src/content/docs/en/guides/cms/builderio.mdx
+++ b/src/content/docs/en/guides/cms/builderio.mdx
@@ -199,9 +199,8 @@ For more ideas, read [Builder's troubleshooting guide](https://www.builder.io/c/
Add the following content to `src/pages/index.astro` in order to fetch and display a list of all post titles, each linking to its own page:
-```astro title="src/pages/index.astro" {9}
+```astro title="src/pages/index.astro" {8}
---
-
const builderAPIpublicKey = import.meta.env.BUILDER_API_PUBLIC_KEY;
const builderModel = import.meta.env.BUILDER_BLOGPOST_MODEL;
@@ -223,16 +222,15 @@ const { results: posts } = await fetch(
@@ -223,7 +223,7 @@ export async function getStaticPaths() {
console.error(err);
});
- return posts.map((post) => {
+ return posts?.map((post) => {
return {
params: {
slug: post.slug,
@@ -252,7 +252,7 @@ export async function getStaticPaths() {
.catch((err) => {
console.error(err);
});
- return posts.map((post) => {
+ return posts?.map((post) => {
return {
params: {
slug: post.slug,
@@ -294,7 +294,7 @@ To deploy your site visit our [deployment guide](/en/guides/deploy/) and follow
-
+
diff --git a/src/content/docs/en/guides/cms/keystatic.mdx b/src/content/docs/en/guides/cms/keystatic.mdx
index c8fe130303978..7eb653de0397e 100644
--- a/src/content/docs/en/guides/cms/keystatic.mdx
+++ b/src/content/docs/en/guides/cms/keystatic.mdx
@@ -172,7 +172,7 @@ Visit `http://127.0.0.1:4321/keystatic` in the browser to see the Keystatic Admi
5. Navigate to that file in your code editor and verify that you can see the Markdown content you entered. For example:
- ```markdown
+ ```markdown title="src/content/posts/my-first-post.mdoc"
---
title: My First Post
---
@@ -189,7 +189,7 @@ Visit `http://127.0.0.1:4321/keystatic` in the browser to see the Keystatic Admi
The following example displays a list of each post title, with a link to an individual post page.
-```tsx {4}
+```astro title="src/pages/posts/index.astro" {4}
---
import { getCollection } from 'astro:content'
@@ -206,21 +206,23 @@ const posts = await getCollection('posts')
### Displaying a single entry
-To display content from an individual post, you can import and use the `` component to [render your content to HTML](/en/guides/content-collections/#rendering-body-content):
+To display content from an individual post, you can [`render()` your content to HTML](/en/guides/content-collections/#rendering-body-content) using the `` component:
-```tsx {4-5}
+```astro title="src/pages/posts/my-first-post.astro" {8,13} ", render"
---
-import { getEntry } from 'astro:content'
+import { getEntry, render } from "astro:content";
-const post = await getEntry('posts', 'my-first-post')
-const { Content } = await post.render()
+const post = await getEntry("posts", "my-first-post");
+if (!post) {
+ throw new Error("Post not found");
+}
+const { Content } = await render(post);
---
{post.data.title}
-
```
For more information on querying, filtering, displaying your collections content and more, see the full content [collections documentation](/en/guides/content-collections/).
diff --git a/src/content/docs/en/guides/cms/kontent-ai.mdx b/src/content/docs/en/guides/cms/kontent-ai.mdx
index c49b2145cc3fd..d375c3b3e2195 100644
--- a/src/content/docs/en/guides/cms/kontent-ai.mdx
+++ b/src/content/docs/en/guides/cms/kontent-ai.mdx
@@ -376,6 +376,7 @@ export async function getStaticPaths() {
.items()
.type(contentTypes.blog_post.codename)
.toPromise()
+}
---
```
@@ -437,6 +438,7 @@ const blogPost: BlogPost = Astro.props.blogPost
+
```
@@ -516,6 +518,7 @@ try {
+
```
diff --git a/src/content/docs/en/guides/cms/preprcms.mdx b/src/content/docs/en/guides/cms/preprcms.mdx
index 5b1a073509a2f..df29613e5f5fd 100644
--- a/src/content/docs/en/guides/cms/preprcms.mdx
+++ b/src/content/docs/en/guides/cms/preprcms.mdx
@@ -99,24 +99,22 @@ You will fetch your data from Prepr by writing queries to interact with its Grap
```
3. To display a linked list of your blog posts on a page, import and execute your query, including the necessary Prepr endpoint. You will then have access to all your posts titles and their slugs to render to the page. (In the next step, you will [create individual pages for your blog posts](#creating-individual-blog-post-pages).)
- ```astro title="src/pages/index.astro" ins={3-4, 6-8, 15-23}
+ ```astro title="src/pages/index.astro" ins={3-4, 6-8, 13-21}
---
- import Layout from '../layouts/Layout.astro';
- import { Prepr } from '../lib/prepr.js';
- import GetArticles from '../queries/get-articles.js';
+ import Layout from "../layouts/Layout.astro";
+ import { Prepr } from "../lib/prepr.js";
+ import GetArticles from "../queries/get-articles.js";
- const response = await Prepr(GetArticles)
- const { data } = await response.json()
- const articles = data.Articles
+ const response = await Prepr(GetArticles);
+ const { data } = await response.json();
+ const articles = data.Articles;
---
-
@@ -148,7 +146,7 @@ To create a page for each blog post, you will execute a new GraphQL query on a [
1. Create a file called `get-article-by-slug.js` in the `queries` folder and add the following to query a specific article by its slug and return data such as the article `title` and `content`:
- ```js title="src/lib/queries/get-article-by-slug.js"
+ ```js title="src/queries/get-article-by-slug.js"
const GetArticleBySlug = `
query ($slug: String) {
Article (slug: $slug) {
@@ -180,30 +178,26 @@ To create a page for each blog post, you will execute a new GraphQL query on a [
2. Inside the `src/pages` folder, create a file called `[…slug].astro`. Add the following code to import and execute the query from the previous step and display the retrieved article:
```astro title="src/pages/[...slug].astro"
---
- import Layout from '../layouts/Layout.astro';
- import {Prepr} from '../lib/prepr.js';
- import GetArticleBySlug from '../queries/get-article-by-slug.js';
+ import Layout from "../layouts/Layout.astro";
+ import { Prepr } from "../lib/prepr.js";
+ import GetArticleBySlug from "../queries/get-article-by-slug.js";
const { slug } = Astro.params;
- const response = await Prepr(GetArticleBySlug, {slug})
- const { data } = await response.json()
- const article = data.Article
+ const response = await Prepr(GetArticleBySlug, { slug });
+ const { data } = await response.json();
+ const article = data.Article;
---
```
@@ -405,8 +410,8 @@ Create a new directory `src/pages/blog/` and add a new file called `[...slug].as
```astro title="src/pages/blog/[...slug].astro"
---
-import { useStoryblokApi } from '@storyblok/astro'
-import StoryblokComponent from '@storyblok/astro/StoryblokComponent.astro'
+import { useStoryblokApi } from "@storyblok/astro";
+import StoryblokComponent from "@storyblok/astro/StoryblokComponent.astro";
export async function getStaticPaths() {
const sbApi = useStoryblokApi();
@@ -418,7 +423,7 @@ export async function getStaticPaths() {
const stories = Object.values(data.stories);
- return stories.map((story) => {
+ return stories.map((story: any) => {
return {
params: { slug: story.slug },
};
diff --git a/src/content/docs/en/guides/cms/strapi.mdx b/src/content/docs/en/guides/cms/strapi.mdx
index 5a83bc07714f9..bce096853f67d 100644
--- a/src/content/docs/en/guides/cms/strapi.mdx
+++ b/src/content/docs/en/guides/cms/strapi.mdx
@@ -128,6 +128,11 @@ export default interface Article {
createdAt: string;
updatedAt: string;
publishedAt: string;
+ image: {
+ data: {
+ url: string;
+ };
+ };
}
```
@@ -268,8 +273,9 @@ const article = Astro.props;
Create the template for each page using the properties of each post object.
-```astro title="src/pages/blog/[slug].astro" ins={21-43}
+```astro title="src/pages/blog/[slug].astro" ins={22-44}
---
+import MyMarkdownComponent from '../../components/MyMarkdownComponent.astro';
import fetchApi from '../../lib/strapi';
import type Article from '../../interfaces/article';
@@ -325,8 +331,9 @@ Create the `src/pages/blog/[slug].astro` file:
```astro title="src/pages/blog/[slug].astro"
---
-import fetchApi from '../../../lib/strapi';
-import type Article from '../../../interfaces/article';
+import MyMarkdownComponent from '../../components/MyMarkdownComponent.astro';
+import fetchApi from '../../lib/strapi';
+import type Article from '../../interfaces/article';
const { slug } = Astro.params;
diff --git a/src/content/docs/en/guides/cms/tina-cms.mdx b/src/content/docs/en/guides/cms/tina-cms.mdx
index 06a70801dbaad..a2aa7acb07b2a 100644
--- a/src/content/docs/en/guides/cms/tina-cms.mdx
+++ b/src/content/docs/en/guides/cms/tina-cms.mdx
@@ -86,11 +86,11 @@ To get started, you'll need an existing Astro project.
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`.
+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}
+ ```js title="tina/config.ts" ins={35-40}
import { defineConfig } from "tinacms";
// Your hosting provider likely exposes this as an environment variable
diff --git a/src/content/docs/en/guides/cms/umbraco.mdx b/src/content/docs/en/guides/cms/umbraco.mdx
index 91f7910b4bfdb..f54a30d9ede6c 100644
--- a/src/content/docs/en/guides/cms/umbraco.mdx
+++ b/src/content/docs/en/guides/cms/umbraco.mdx
@@ -57,7 +57,7 @@ const articles = await res.json();
---
@@ -158,7 +158,7 @@ Note that the `params` property, which generates the URL path of the page, conta
Add the following code to `[...slug].astro` which will create your individual blog post pages:
-```astro title="[...slug].astro"
+```astro title="src/pages/[...slug].astro"
---
import Layout from '../layouts/Layout.astro';
diff --git a/src/content/docs/en/guides/cms/wordpress.mdx b/src/content/docs/en/guides/cms/wordpress.mdx
index b56aac9bf72ca..8bc76efceb249 100644
--- a/src/content/docs/en/guides/cms/wordpress.mdx
+++ b/src/content/docs/en/guides/cms/wordpress.mdx
@@ -43,7 +43,7 @@ const posts = await res.json();
---
Astro + WordPress 🚀
{
- posts.map((post) => (
+ posts.map((post: any) => (
))
@@ -95,11 +95,12 @@ import Layout from "../layouts/Layout.astro";
let res = await fetch("https://norian.studio/wp-json/wp/v2/dinos");
let posts = await res.json();
---
+
- }
- {
- content.__typename === 'Text' &&
-
- }
+ {content.__typename === "Assets" && (
+