Recetas de Astro

Mira ejemplos guiados de como agregar funcionalidades a tu proyecto Astro.

Recetas oficiales

Las recetas oficiales de Astro son guías prácticas breves y enfocadas que acompañan al lector para completar un ejemplo funcional de una tarea específica. ¡Las recetas son una excelente manera de añadir nuevas características o comportamientos a tu proyecto Astro siguiendo instrucciones paso a paso!

• Installing a Vite or Rollup plugin

  Learn how you can import YAML data by adding a Rollup plugin to your project.

• Analizar el tamaño del empaquetado

  Aprende cómo analizar el empaquetado generado por Astro usando `rollup-plugin-visualizer`.

• Build a custom image component

  Learn how to build a custom image component that supports media queries using the getImage function.

• Build HTML forms in Astro pages

  Learn how to build HTML forms and handle submissions in your frontmatter.

• Build forms with API routes

  Learn how to use JavaScript to send form submissions to an API Route.

• Usa Bun con Astro

  Aprende cómo usar Bun con tu sitio Astro.

• Llamar a los endpoints desde el servidor

  Aprende a realizar llamadas a endpoints desde el servidor en Astro.

• Verify a Captcha

  Learn how to create an API route and fetch it from the client.

• Personalizar los nombres de los archivos en el resultado de la compilación

  Aprende a cambiar el patrón de nomenclatura predeterminado para tus recursos compilados, como JavaScript, CSS e imágenes en Astro mediante las opciones de Rollup de Vite.

• Build your Astro site with Docker

  Learn how to build your Astro site using Docker.

• Importa imágenes dinámicamente

  Aprende a importar imágenes dinámicamente usando la función import.meta.glob de Vite.

• Añadir iconos a enlaces externos

  Aprende a instalar un plugin de rehype para añadir iconos a enlaces externos en tus archivos Markdown.

• Add i18n features

  Use dynamic routing and content collections to add internationalization support to your Astro site.

• Crear aplicaciones de barra de herramientas para desarrollo

  Aprende como crear una aplicación de barra de herramientas para desarrollo para tu sitio

• Add last modified time

  Build a remark plugin to add the last modified time to your Markdown and MDX.

• Add reading time

  Build a remark plugin to add reading time to your Markdown or MDX files.

• Agregar una fuente RSS

  Agrega una fuente RSS a tu sitio Astro para que los usuarios puedan suscribirse a tu contenido.

• Compartir estado entre componentes Astro

  Aprende a compartir estado entre componentes Astro con Nano Stores.

• Share state between islands

  Learn how to share state across framework components with Nano Stores.

• Usa la transmisión en continuo para mejorar el rendimiento de las páginas

  Aprende a usar la transmisión en continuo para mejorar el rendimiento de la página.

• Style rendered Markdown with Tailwind Typography

  Learn how to use @tailwind/typography to style your rendered Markdown.

Recursos de la comunidad

Encuentra más recetas escritas y enviadas por la comunidad en Astro Tips.