Migrando de Eleventy

Eleventy é um gerador de sites estáticos de código aberto que trabalha com vários linguagens de modelo.

Principais Semelhanças entre Eleventy (11ty) e Astro

Eleventy (11ty) e Astro compartilham algumas semelhanças que facilitarão a migração do seu projeto:

Tanto Astro quanto Eleventy são construtores de sites modernos, baseados em JavaScript (Jamstack).
Ambos Astro e Eleventy permitem o uso de um CMS headless, APIs ou arquivos Markdown para dados. Você pode continuar a usar seu sistema de autoria de conteúdo preferido, e pode manter o conteúdo existente.

Principais Diferenças entre Eleventy (11ty) e Astro

Ao reconstruir seu site Eleventy (11ty) em Astro, você notará algumas diferenças importantes:

Eleventy suporta uma variedade de linguagens de modelo. Astro suporta inclusão de componentes de frameworks JS populares diversos (como React, Svelte, Vue, Solid), mas utiliza layouts, páginas e componentes Astro para a maioria dos modelos de página.
Astro usa um diretório src/ para todos os arquivos, incluindo metadados do site, que estão disponíveis para consulta e processamento durante a construção do site. Dentro deste diretório há uma pasta especial src/pages/ para roteamento baseado em arquivos.
Astro usa uma pasta public/ para ativos estáticos que não precisam ser processados ou transformados durante a construção.
No Eleventy, a configuração para empacotar CSS, JavaScript e outros ativos precisa ser feita manualmente. Astro gerencia isso para você automaticamente.

Migrando Eleventy para Astro

Para converter um blog Eleventy para Astro, comece com nosso modelo inicial para blogs, ou explore mais temas de blogs da comunidade em nossa vitrine de temas.

Você pode passar um argumento --template para o comando create astro para iniciar um novo projeto Astro com um dos nossos modelos oficiais. Ou você pode iniciar um novo projeto a partir de qualquer repositório Astro existente no GitHub.

npm create astro@latest -- --template blog

pnpm create astro@latest --template blog

yarn create astro --template blog

Traga seus arquivos Markdown (ou MDX, com nossa integração opcional) existentes como conteúdo para criar páginas Markdown ou MDX.

Seu projeto Eleventy permitia o uso de várias linguagens de modelo para construir seu site. Em um projeto Astro, a criação de modelos de página será feita principalmente com componentes Astro, que podem ser usados como elementos de interface, layouts e até páginas completas. Você pode explorar a sintaxe de componentes Astro para entender como fazer modelos com componentes no Astro.

Para converter outros tipos de sites, como um portfólio ou site de documentação, veja mais modelos oficiais em astro.new. Você encontrará um link do repositório no GitHub para cada projeto, assim como links de um clique para abrir um projeto funcional em ambientes de desenvolvimento online como StackBlitz, CodeSandbox e Gitpod.