Migrar desde Eleventy
Eleventy es un generador de sitios estáticos de código abierto que funciona con múltiples lenguajes de plantillas.
Similitudes clave entre Eleventy (11ty) y Astro
Sección titulada “Similitudes clave entre Eleventy (11ty) y Astro”Eleventy (11ty) y Astro comparten algunas similitudes que te ayudarán a migrar tu proyecto:
-
Tanto Astro como Eleventy son constructores de sitios modernos basados en JavaScript (Jamstack).
-
Tanto Astro como Eleventy te permiten usar un CMS headless, APIs o archivos Markdown para datos. Puedes continuar usando tu sistema de creación de contenido preferido, y podrás conservar tu contenido existente.
Diferencias clave entre Eleventy (11ty) y Astro
Sección titulada “Diferencias clave entre Eleventy (11ty) y Astro”Cuando reconstruyas tu sitio de Eleventy (11ty) en Astro, notarás algunas diferencias importantes:
-
Eleventy soporta una variedad de lenguajes de plantillas. Astro soporta incluir componentes de varios frameworks JS populares (p. ej. React, Svelte, Vue, Solid), pero usa layouts, páginas y componentes de Astro para la mayoría de las plantillas de página.
-
Astro usa un directorio
src/para todos los archivos, incluyendo metadatos del sitio, que están disponibles para consulta y procesamiento durante el build del sitio. Dentro de este hay una carpeta especialsrc/pages/para enrutamiento basado en archivos. -
Astro usa una carpeta
public/para assets estáticos que no necesitan ser procesados ni transformados durante el build. -
En Eleventy, el bundling de CSS, JavaScript, y otros assets necesita configurarse manualmente. Astro maneja esto por ti out-of-the-box.
Cambiar de Eleventy a Astro
Sección titulada “Cambiar de Eleventy a Astro”Para convertir un blog de Eleventy a Astro, comienza con nuestra plantilla de inicio del tema de blog, o explora más temas de blog de la comunidad en nuestro showcase de temas.
Puedes pasar un argumento --template al comando create astro para iniciar un nuevo proyecto de Astro con uno de nuestros starters oficiales. O, puedes iniciar un nuevo proyecto desde cualquier repositorio existente de Astro en GitHub.
npm create astro@latest -- --template blogpnpm create astro@latest --template blogyarn create astro --template blogTrae tus archivos Markdown (o MDX, con nuestra integración opcional) existentes como contenido para crear páginas Markdown o MDX.
Tu proyecto de Eleventy te permitía usar una variedad de lenguajes de plantillas para construir tu sitio. En un proyecto de Astro, tus plantillas de página se lograrán principalmente con componentes de Astro, que pueden usarse como elementos de UI, layouts e incluso páginas completas. Puede que quieras explorar la sintaxis de componentes de Astro para ver cómo hacer plantillas en Astro usando componentes.
Para convertir otros tipos de sitios, como un portafolio o sitio de documentación, consulta más plantillas oficiales de inicio en astro.new. Encontrarás un enlace al repositorio de GitHub de cada proyecto, así como enlaces de un clic para abrir un proyecto funcional en los entornos de desarrollo en línea StackBlitz y CodeSandbox.
