Eleventy에서 Astro로 마이그레이션 | 마이그레이션 서비스
당신의 Eleventy 사이트는 작동합니다 — 컴포넌트, 타입, 또는 확장이 필요할 때까지
Why leave Eleventy (11ty)?
- Community plateaued while Astro's Discord hit 25,000 active developers
- Nunjucks templates break when your team tries to pass typed props
- Framework components require custom shortcodes and brittle passthrough
- Data cascade complexity spirals once you exceed 200 pages
- TypeScript support stops at config files — templates stay untyped
- Plugin ecosystem stalled with 90% of packages unmaintained since 2023
What you gain
- Component boundaries with full TypeScript inference across props and slots
- Islands architecture drops React calendar into static pages without hydrating the rest
- Content Collections enforce Zod schemas on every Markdown file at build time
- Astro's community ships 40+ official integrations maintained by core team
- Image optimization, sitemap, RSS built-in — no hunting for working plugins
- Zero-JS output preserved by default while opt-in hydration stays scoped per component
Eleventy와 Astro는 정신적 동반자입니다. 둘 다 기본적으로 zero JavaScript 출력을 제공합니다. 둘 다 콘텐츠를 우선시합니다. 둘 다 자신의 템플릿 언어를 가져올 수 있습니다. 차이점은 Astro가 컴포넌트 아키텍처, TypeScript 지원, 프레임워크 통합(React, Vue, Svelte), 그리고 Eleventy의 더 작은 커뮤니티가 따라올 수 없는 빠르게 성장하는 생태계를 추가한다는 것입니다.
마이그레이션을 순조롭게 만드는 것
Eleventy는 Nunjucks, Liquid 또는 Markdown 템플릿을 사용합니다. Astro 컴포넌트는 로직을 위한 스크립트 섹션이 있는 HTML 우선입니다. 개념적 매핑은 직접적입니다: Eleventy 템플릿은 Astro 컴포넌트가 되고, Eleventy 데이터 파일은 콘텐츠 컬렉션이 되며, Eleventy 필터는 유틸리티 함수가 됩니다. 당신의 Markdown 콘텐츠는 변경 없이 마이그레이션됩니다.
생태계 이점
Astro는 Tailwind, MDX, 사이트맵, RSS, 이미지 최적화 및 수십 개의 공식 통합을 보유하고 있습니다. npm 생태계는 완전히 사용 가능합니다. React, Vue 및 Svelte 컴포넌트는 islands를 통해 Astro 페이지 내에서 작동합니다. 이 생태계 접근은 Eleventy 사용자가 마이그레이션하는 주된 이유입니다 — 철학은 같지만 도구는 더 풍부합니다.
The migration process
Discovery & Audit
We map every page, post, media file, redirect, and plugin. Nothing gets missed.
Architecture Plan
New stack designed for your content structure, SEO requirements, and performance targets.
Staged Migration
Content migrated in batches. Each batch verified before the next begins.
SEO Preservation
301 redirects, canonical tags, sitemap, robots.txt — every ranking signal carried over.
Launch & Monitor
DNS cutover with zero downtime. 30-day monitoring period included.
Eleventy (11ty) vs Astro
| Metric | Eleventy (11ty) | Astro |
|---|---|---|
| JavaScript shipped | Zero by default | Zero by default |
| Component system | Partials/includes | Full component architecture |
| TypeScript | Limited | First-class |
| Framework components | Not supported | React, Vue, Svelte via islands |
| Content typing | Untyped data cascade | Typed content collections |
| Community size | Smaller | Larger and growing |
Common questions
Zero JavaScript도 제공하는데 왜 Eleventy를 떠나나요?
Eleventy와 Astro는 zero-JS 철학을 공유합니다. 마이그레이션의 이유는 생태계 접근(npm 패키지, 프레임워크 컴포넌트), TypeScript 지원, 타입 안전성이 있는 콘텐츠 컬렉션, 그리고 더 큰 커뮤니티입니다. Eleventy가 당신의 필요를 완벽하게 충족한다면 마이그레이션할 긴급한 이유는 없습니다.
Eleventy와 Astro는 얼마나 유사한가요?
철학상 매우 유사합니다. 둘 다 zero JavaScript를 기본값으로 하고, 둘 다 콘텐츠 우선이며, 둘 다 Markdown을 지원합니다. 주요 차이점은 Astro의 컴포넌트 아키텍처, TypeScript 지원, 그리고 islands를 통해 React/Vue/Svelte 컴포넌트를 포함할 수 있는 능력입니다.
Nunjucks 템플릿이 Astro로 변환되나요?
Nunjucks 템플릿은 Astro 컴포넌트로 변환됩니다. 구문은 다르지만 개념은 직접 매핑됩니다: Nunjucks extends는 Astro layouts가 되고, Nunjucks include는 컴포넌트 imports가 되며, Nunjucks macros는 props를 가진 Astro 컴포넌트가 됩니다. 마이그레이션의 일부로 변환을 처리합니다.
Markdown 콘텐츠를 유지할 수 있나요?
네. Markdown 파일은 Astro의 콘텐츠 컬렉션으로 직접 마이그레이션됩니다. Front matter는 타입된 스키마로 매핑됩니다. 콘텐츠는 Astro의 Markdown 파이프라인을 통해 렌더링됩니다. 콘텐츠 변경이 필요하지 않습니다.
Eleventy의 데이터 캐스케이드는 어떻게 되나요?
Eleventy의 데이터 캐스케이드(글로벌 데이터, 디렉토리 데이터, 템플릿 데이터)는 Astro의 콘텐츠 컬렉션 및 컴포넌트 props로 대체됩니다. 접근 방식은 다르지만 동일한 결과를 달성합니다. 콘텐츠 컬렉션은 Eleventy의 데이터 캐스케이드가 제공하지 않는 타입 안전성을 추가합니다.
Eleventy에서 Astro로의 마이그레이션은 얼마나 걸리나요?
10-30개 페이지가 있는 사이트는 2-3주가 소요됩니다. 100개 이상의 게시물이 있는 블로그는 3-4주가 소요됩니다. 두 도구 간의 철학적 정렬로 인해 마이그레이션은 더 순조로운 SSG 마이그레이션 중 하나입니다.
Ready to migrate?
Free assessment. We'll audit your current site and give you a clear migration plan — no commitment.
Let's build
something together.
Whether it's a migration, a new build, or an SEO challenge — the Social Animal team would love to hear from you.