Astro x Cloudinary: Content Loader

Estamos encantados de anunciar a Cloudinary como launch partner para la Astro Content Layer API, nuestro nuevo enfoque para traer contenido externo a las content collections. Cloudinary es una plataforma de hosting para media assets que te permite transformar y optimizar tipos de media.

Las content collections son la respuesta de Astro al contenido organizado, gestionado y type-safe. Ahora con el content layer de Astro, puedes traer todo tipo de contenido y datos de fuentes externas durante el build. La Content Layer API sincroniza y cachea el contenido eficientemente, dándote una experiencia familiar y unificada para trabajar con cualquier fuente de datos.

Usando el Cloudinary loader

Para usar el nuevo loader, primero instala el paquete astro-cloudinary desde npm:

npm install astro-cloudinary

Después, necesitarás configurar tu environment con tu API key. Consulta la guía de configuración del Cloudinary loader para más detalles.

Luego importa y usa el loader dentro de tu archivo de configuración src/content/config.ts:

import { defineCollection } from 'astro:content'
import { cldAssetsLoader } from 'astro-cloudinary/loaders'

const samples = defineCollection({
  loader: cldAssetsLoader({
    limit: 4,
    folder: 'samples/food'
  })
})

export const collections = { assets }

¡Y eso es todo! A partir de aquí, puedes consultar y usar collections de la misma manera que lo harías con collections locales. Consulta la guía de content collections en los docs de Astro para saber más.

Para más lectura sobre el uso del Cloudinary loader, lee Source Cloudinary Assets in Astro With the Astro Content Layer que tiene detalles adicionales. También echa un vistazo al deep dive de ayer sobre la nueva Content Layer API para aprender cómo funcionan los loaders, y cómo puedes construir el tuyo propio.