Xata y Astro
Xata es una Plataforma de Datos sin Servidor que combina las características de una base de datos relacional, un motor de búsqueda y un motor de análisis al exponer una única API REST consistente.
Agregando una base de datos con Xata
Prerequisitos
- Una cuenta de Xata con una base de datos creada. (Puedes usar la base de datos de ejemplo desde la UI).
- Un Token de Accesos (
XATA_API_KEY
). - Tu URL de la base de datos.
Después de actualizar e inicializar la CLI de Xata, tendrás tu token de API en tu archivo .env
y la URL de la base de datos definida.
Al final de la configuración, deberías tener:
```ini title=".env"XATA_API_KEY=hash_key
# Una rama de Xata que será usada# Si no existe una rama de xata con# el mismo nombre que tu rama gitXATA_BRANCH=main
Y la databaseURL
definida:
{ "databaseUrl": "https://your-database-url"}
Configuración del entorno
Para habilitar IntelliSense y seguridad de tipos para tus variables de entorno, edita o crea el archivo env.d.ts
en tu directorio src/
:
interface ImportMetaEnv { readonly XATA_API_KEY: string; readonly XATA_BRANCH?: string;}
interface ImportMeta { readonly env: ImportMetaEnv;}
Lee más sobre variables de entorno y los archivos .env
en Astro.
Usando la generación de código desde la CLI de Xata y eligiendo la opción de TypeScript, se genera una instancia del SDK para ti, con tipos adaptados a tu esquema de base de datos. Además, @xata.io/client
se agregó a tu package.json
.
Tus variables de entorno de Xata y la URL de la base de datos fueron automáticamente extraídas por la instancia del SDK, así que no se requiere ningún trabajo adicional de configuración.
Ahora, tu proyecto debería tener la siguiente estructura:
Directoriosrc/
- xata.ts
- env.d.ts
- .env
- astro.config.mjs
- package.json
- .xatarc
Crea tus consultas
Para consultar tus posts, importa y usa la clase XataClient
en un archivo .astro
. El ejemplo de abajo consulta los primeros 50 posts de la base de datos de ejemplo de Xata.
---import { XataClient } from '../../xata';
const xata = new XataClient({ apiKey: import.meta.env.XATA_API_KEY, branch: import.meta.env.XATA_BRANCH});
const { records } = await xata.db.Posts.getPaginated({ pagination: { size: 50 }})---
<ul> {records.map((post) => ( <li>{post.title}</li> ))}</ul>
Es importante tener en cuenta que el SDK necesita ser generado cada vez que tu esquema cambie. Así que, evita hacer cambios a los archivos generados que crea la CLI de Xata porque una vez que el esquema se actualice, tus cambios se sobrescribirán.