가장 사용하기 좋은 Astro 블로그 테마 5선과 상세 설치·설정 가이드

처음 블로그를 만들려고 했을 때 저도 꽤 막막했습니다. 처음부터 테마를 직접 만들자니 시간이 너무 많이 들었고, 페이지 디자인만으로도 주말 몇 번을 써야 했습니다. 그렇다고 기존 테마를 찾으면 검색 결과가 너무 많아 무엇을 선택해야 할지 알기 어려웠습니다. 어렵게 하나를 내려받아도 설정 문서가 모호해 한참 씨름한 끝에 실행조차 못 한 적도 있었습니다.

결국 마음먹고 2주 동안 Astro 블로그 테마 십여 개를 직접 시험해 봤습니다. 보기에는 화려하지만 너무 무거운 테마도 있었고, 기본 기능조차 없을 만큼 단순한 테마도 있었으며, 설정 과정이 악몽 같은 테마도 있었습니다. 그래도 시간은 헛되지 않았습니다. 마침내 실제로 사용하기 좋은 테마 5개를 추려 냈고, 직접 사용하며 겪은 시행착오까지 정리했습니다.

이 글에서는 이 5개 테마의 특징과 적합한 사용자, 상세 설치·설정 방법을 설명합니다. 그대로 따라 하면 30분 만에 자신만의 블로그를 완성할 수 있어 제가 처음 시작했을 때보다 훨씬 수월할 것입니다.

블로그에 Astro를 선택하는 이유

구체적인 테마를 살펴보기 전에 이런 질문이 들 수 있습니다. 왜 Astro를 써야 할까요? Next.js나 Gatsby를 사용하면 안 될까요?

Astro의 가장 큰 장점은 바로 속도입니다. 기본적으로 정적 페이지를 생성하므로 다른 프레임워크처럼 많은 JS 코드를 주입하지 않습니다. 덕분에 블로그 로딩 속도가 매우 빠르고 PageSpeed 점수 90+를 쉽게 달성할 수 있습니다. SEO에도 특히 유리하며 검색 엔진 크롤러도 이런 간결한 페이지 구조를 선호합니다.

개발 경험도 정말 좋습니다. React, Vue, Svelte 중 원하는 프레임워크로 컴포넌트를 작성할 수 있고, Markdown/MDX로 바로 글을 쓸 수도 있습니다. 타입 안전성, RSS와 sitemap 자동 생성 같은 기능이 기본 제공되어 수고를 크게 줄여 줍니다.

현재 Astro 커뮤니티도 상당히 활발합니다. 공식 테마 라이브러리에는 375개 이상의 테마가 있고 매주 새로운 테마가 공개됩니다. 일부 소규모 프레임워크보다 이 점이 훨씬 낫고, 문제가 생겨도 대부분 해결 방법을 찾을 수 있습니다.

최고의 Astro 블로그 테마 5선

이제 핵심 내용을 살펴보겠습니다. 서로 다른 요구 사항에 맞춰 직접 시험해 보고 만족한 테마 5개를 추천합니다. 먼저 빠른 비교표를 확인해 보세요.

AstroPaper - 미니멀리스트를 위한 첫 번째 선택

저처럼 간결한 스타일을 좋아한다면 AstroPaper가 단연 첫 번째 선택입니다. GitHub에서 별 3.5k+를 받은, 현재 가장 인기 있는 Astro 블로그 테마 중 하나입니다.

가장 인상적이었던 기능은 퍼지 검색입니다. 키워드만 입력하면 글을 빠르게 찾을 수 있어 사용감이 매우 매끄럽습니다. 초안 기능도 실용적이라 작성 중인 글이 실수로 공개되는 일을 막아 줍니다. 반응형 디자인도 잘 구현되어 모바일에서 전혀 불편하지 않습니다. 라이트·다크 모드 전환도 부드럽고 눈이 편안합니다.

기술 블로거와 긴 글을 즐겨 쓰는 사람에게 적합합니다. 주로 튜토리얼이나 기술 분석을 작성한다면 화려한 디자인으로 시선을 분산시키지 않고 독자가 글에 집중하도록 도와줍니다.

핵심 기능:

• 퍼지 검색(정말 유용합니다)
• 초안 기능과 페이지네이션
• RSS와 sitemap 자동 생성
• SEO와 접근성 최적화
• 타입 안전한 Markdown

공식 사이트: https://astro-paper.pages.dev/

Astro Air Blog - 우아하고 간결한 개인 블로그

Astro Air 역시 미니멀리즘 스타일의 테마이지만 AstroPaper보다 개인적인 개성을 드러내는 데 더 중점을 둡니다. 저는 특히 부드러우면서도 어지럽지 않은 페이지 로딩 애니메이션이 마음에 들었습니다.

이 테마의 설정 파일은 사용하기 편리하게 설계되어 있습니다. about.mdx, intro.mdx, links.mdx 파일을 직접 편집해 페이지 콘텐츠를 맞춤 설정할 수 있으므로 설정 항목을 여기저기 찾아다닐 필요가 없습니다. 태그 시스템도 잘 만들어져 있어 콘텐츠를 분류하기 좋습니다.

개인 포트폴리오 블로그를 만들거나 자신의 창작물을 보여 주고 싶다면 Astro Air가 좋은 선택입니다. ‘뉴스 사이트’보다 ‘나만의 공간’에 가까운 느낌을 줍니다.

핵심 기능:

Railway - 현대적인 배포 플랫폼, 번거로운 운영 없이 몇 분 만에 라이브

지금 시작 →광고

• 미니멀하고 우아한 디자인
• 유연한 맞춤 페이지(소개, 자기소개, 링크)
• 태그 분류 시스템
• MDX 지원
• 소셜 미디어 공유

GitHub 주소: https://github.com/sun0225SUN/astro-air

Bookworm Light - 다중 작성자 블로그를 위한 강력한 도구

팀 블로그나 콘텐츠 플랫폼을 만들 계획이라면 Bookworm Light가 제가 시험한 테마 중 기능이 가장 풍부합니다. 다중 작성자 시스템을 기본 지원하여 각 글에 작성자 정보를 표시하고 작성자별로 글을 필터링할 수 있습니다.

맞춤 설정 기능이 매우 강력해 음식 블로그, 사진 공유, 여행 일기 등 어떤 유형이든 알맞게 조정할 수 있습니다. 다크 모드도 지원하고 전환도 매우 부드럽습니다.

이 테마로 테스트 사이트를 만들어 봤는데 설정 과정은 생각보다 간단했고 문서도 비교적 명확했습니다. 다만 기능이 많은 만큼 설정 항목도 많아서 처음 사용할 때는 익숙해지는 데 시간이 조금 필요할 수 있습니다.

핵심 기능:

• 다중 작성자 지원(핵심 기능)
• 풍부한 카테고리와 태그 시스템
• 높은 맞춤 설정 자유도
• 다크 모드
• 다양한 블로그 유형 지원(음식, 사진, 여행 등)

적합한 용도: 팀 블로그, 콘텐츠 플랫폼, 전문 분야 블로그

AstroWind - 가장 폭넓은 기능을 갖춘 선택

AstroWind는 ‘블로그를 빠르게 출시하고 싶다’는 상황에 적합합니다. Tailwind CSS 기반이라 Tailwind를 사용해 봤다면 금방 익숙해집니다. 가장 큰 장점은 설치 후 바로 사용할 수 있다는 점입니다. 다양한 최적화가 이미 적용되어 있어 처음부터 높은 PageSpeed 점수를 얻을 수 있습니다.

이미지 최적화, 자동 RSS, 소셜 공유 기능이 모두 내장되어 있어 플러그인을 직접 추가할 필요가 없습니다. RTL(오른쪽에서 왼쪽) 언어도 지원하므로 해외 사용자를 대상으로 하는 블로그에 특히 유용합니다.

필요한 요소가 모두 준비되어 있고 콘텐츠 작성에만 집중할 수 있으므로 기업 블로그나 빠르게 출시해야 하는 프로젝트에 더 적합하다고 생각합니다.

핵심 기능:

• Astro 4.0 + Tailwind CSS
• 높은 PageSpeed 점수를 위한 최적화
• 내장 이미지 최적화
• 자동 RSS 구독
• RTL 언어 지원
• 다크 모드

적합한 용도: 기업 블로그, 빠른 출시 프로젝트, 국제화가 필요한 프로젝트

Astro Cactus - 간단하고 명확한 원칙을 가진 선택

Astro Cactus는 명확한 관점을 가진 테마입니다. 색상이나 레이아웃 같은 디자인 결정을 대부분 대신 내려 주기 때문에 사용자가 고민할 필요가 없습니다. 선택이 어려운 사람에게는 오히려 장점입니다.

Astro 4.0과 Tailwind CSS를 사용하며 코드가 깔끔하고 시맨틱 HTML도 잘 구현되어 있습니다. 이 테마를 바탕으로 추가 개발을 하려는 경우에도 코드 가독성이 좋습니다.

간결함을 추구하고 디자인에 너무 많은 시간을 쓰고 싶지 않은 개인 블로거에게 적합합니다. 바로 사용할 수 있어 편리합니다.

핵심 기능:

• Astro 4.0 + Tailwind CSS
• 시맨틱 HTML 마크업
• SEO 친화적 디자인
• 반응형 레이아웃
• 라이트·다크 모드 전환
• 명확한 디자인 원칙(결정 비용 절감)

적합한 용도: 개인 블로그, 빠른 시작, 디자인 세부 사항을 고민하고 싶지 않은 경우

상세 설치·설정 가이드(AstroPaper 예시)

각 테마의 특징을 살펴봤으니 이제 설치 방법을 알아보겠습니다. AstroPaper를 예로 들지만 다른 테마도 과정은 비슷합니다.

1단계: 테마 설치

가장 간단한 방법은 패키지 관리자를 사용하는 것입니다. 빠르고 디스크 공간도 절약하는 pnpm을 권합니다. 물론 npm이나 yarn을 사용해도 됩니다.

# pnpm 사용(권장)
pnpm create astro@latest --template satnaing/astro-paper

# 또는 npm 사용
npm create astro@latest -- --template satnaing/astro-paper

# 또는 yarn 사용
yarn create astro --template satnaing/astro-paper

명령을 실행하면 프로젝트 이름을 묻는데 원하는 이름을 입력하면 됩니다. 이후 의존성 설치가 끝날 때까지 잠시 기다리면 됩니다.

Docker를 사용한다면 다음과 같이 실행할 수도 있습니다.

docker build -t astropaper .
docker run -p 4321:80 astropaper

다만 개발 환경이 특별히 복잡하지 않다면 일반적으로 Docker까지 사용할 필요는 없습니다.

2단계: 개발 서버 시작

설치가 끝나면 프로젝트 디렉터리로 이동해 개발 서버를 시작합니다.

# 앞 단계에서 자동 설치되지 않았다면 먼저 의존성 설치
pnpm install

# 개발 서버 시작
pnpm run dev

그런 다음 브라우저에서 http://localhost:4321을 열면 블로그를 확인할 수 있습니다. 아주 빠르죠?

3단계: 핵심 설정

주요 설정은 src/config.ts 파일에 있습니다. 편집기로 열면 대략 다음과 같은 SITE 객체가 보입니다.

export const SITE = {
  website: "https://your-domain.com", // 프로덕션 환경에서는 필수이며 개발 중에는 비워 둘 수 있음
  title: "블로그 이름",
  desc: "한두 문장으로 블로그의 주제를 설명하는 소개",
  author: "작성자 이름",
  // 기타 설정...
}

개발 단계에서는 website를 비워 두었다가 배포 준비가 끝나면 실제 도메인으로 바꿔도 됩니다. 이 값은 sitemap과 소셜 공유 카드의 URL을 생성하는 데 사용되므로 매우 중요합니다.

astro.config.mjs는 Astro 프레임워크 자체의 설정 파일입니다. 플러그인을 추가하거나 포트를 변경하지 않는 한 기본 설정만으로 충분합니다.

Vultr - 고성능 NVMe 클라우드 서버, 전 세계 32개 노드, Docker 원클릭 배포

요금 보기 →광고

4단계: 첫 글 작성

글은 src/content/posts/ 디렉터리에 저장합니다. my-first-post.md 같은 Markdown 파일을 새로 만들고 다음과 같이 frontmatter를 작성합니다.

---

title: "첫 번째 글"
description: "이 글에서 다루는 내용을 간단히 소개합니다"
pubDate: 2025-12-02
tags: ["Astro", "블로그"]

---

# 본문 시작

여기에 Markdown 형식으로 글 내용을 작성합니다.

파일을 저장하면 페이지가 자동으로 새로고침되고 홈페이지에서 글을 확인할 수 있습니다. 간단하죠?

주의할 점은 다음과 같습니다.

• pubDate는 필수이며 형식은 YYYY-MM-DD입니다.
• tags는 선택 사항이지만 분류하기 쉽도록 입력하는 것을 권합니다.
• ogImage로 소셜 공유 시 표시할 표지 이미지를 지정할 수 있습니다. 입력하지 않으면 기본 이미지가 사용됩니다.

테마 색상 변경(선택 사항)

테마 색상을 바꾸고 싶다면 공식 색상 맞춤 설정 문서를 참고하세요. AstroPaper는 여러 색상 조합을 지원하며 변경도 어렵지 않습니다.

솔직히 기본 색상도 충분히 보기 좋아서 저는 거의 바꾸지 않았습니다.

자주 발생하는 문제 해결

제가 겪었던 문제와 해결 방법을 정리했습니다. 같은 시행착오를 피하는 데 도움이 되길 바랍니다.

설치 관련

문제 1: yarn 설치 후 sharp 모듈을 찾을 수 없다는 오류가 발생함

yarn 1의 알려진 문제입니다. 해결 방법은 간단합니다. sharp를 직접 설치하세요.

yarn add sharp

설치가 끝나면 개발 서버를 다시 시작하면 됩니다.

문제 2: Windows PowerShell에서 진단 명령을 실행하면 오류가 발생함

Windows PowerShell에서 astro check --watch & astro dev를 실행하면 오류가 날 수 있습니다. PowerShell이 & 백그라운드 실행 문법을 지원하지 않기 때문입니다.

concurrently 패키지를 설치하거나 두 명령을 따로 실행하면 해결됩니다.

문제 3: 4321 포트가 이미 사용 중임

다른 프로그램이 포트를 사용 중이면 서버 시작에 실패할 수 있습니다. astro.config.mjs에서 포트를 변경하세요.

export default defineConfig({
  server: {
    port: 3000 // 원하는 포트로 변경
  }
})

설정 관련

문제 1: 설정 변경이 적용되지 않음

저도 여러 번 겪었던 문제입니다. 설정 파일을 수정한 뒤 개발 서버를 다시 시작해야 변경 내용이 적용됩니다. 재시작하지 않은 채 30분이나 씨름하고 나서야 원인을 깨달은 적도 있습니다.

Ctrl+C로 서버를 중지한 뒤 pnpm run dev를 다시 실행하면 됩니다.

문제 2: 이미지가 표시되지 않음

이미지를 public 폴더에 넣고 /image-name.jpg처럼 경로를 지정하면 됩니다. 맨 앞의 슬래시를 빠뜨리지 않도록 주의하세요.

또는 이미지를 src/assets에 넣고 Markdown에서 상대 경로로 참조할 수도 있습니다. 두 방법 모두 가능하므로 익숙한 방식을 선택하면 됩니다.

문제 3: 다크 모드 전환에 버그가 있음

라이트·다크 모드 전환 시 스타일이 깨진다면 맞춤 CSS를 작성할 때 다크 모드를 고려했는지 확인하세요. 테마 색상 설정 파일에는 대응하는 다크 모드 변수가 있어야 하므로 색상을 바꿀 때 두 모드를 모두 수정해야 합니다.

배포 관련

문제 1: Vercel 또는 Netlify 배포가 실패함

KiloClaw - 기업용 매니지드 OpenClaw, AI Agent 오케스트레이션 및 스마트 라우팅

시작하기 →광고

빌드 명령이 astro build이고 출력 디렉터리가 dist인지 확인하세요. 둘 중 하나라도 잘못 설정하면 배포가 실패합니다.

Node.js 버전도 확인해야 합니다. Astro 4.0은 Node 18+가 필요하므로 버전이 너무 낮으면 오류가 발생합니다.

문제 2: 배포 후 CSS 스타일이 사라짐

대개 base 경로 설정 문제입니다. 블로그를 루트 디렉터리가 아닌 곳에 배포한다면(예: your-domain.com/blog/) astro.config.mjs에 base를 설정해야 합니다.

export default defineConfig({
  base: '/blog'
})

그렇지 않으면 CSS와 JS 파일 경로를 찾지 못합니다.

고급 맞춤 설정 제안

기본 설정을 마친 뒤 개성 있는 기능을 더하고 싶을 수 있습니다. 몇 가지 방향을 간단히 소개하겠습니다.

댓글 시스템 추가

댓글 기능을 추가하면 블로그에서 독자와 더 활발하게 소통할 수 있습니다. Giscus(GitHub Discussions 기반) 또는 Waline(가벼운 독립형 댓글 시스템)을 권합니다. 공식 문서를 따르면 어렵지 않게 통합할 수 있습니다.

Giscus는 완전히 무료이고 데이터가 GitHub에 저장되어 유실을 걱정할 필요가 없습니다. Waline은 기능이 더 풍부하지만 서버를 직접 배포해야 합니다.

방문 통계 추가

블로그 방문자 수가 궁금하다면 Google Analytics가 가장 널리 쓰이는 선택입니다. 개인정보 보호가 중요하다면 개인정보 보호 중심의 통계 도구인 Plausible이나 Umami를 사용해 볼 수 있습니다.

HTML 템플릿에 통계 코드 한 부분만 추가하면 되므로 통합 방법도 간단합니다.

이미지 로딩 최적화

글에 이미지가 많다면 지연 로딩을 활성화하는 것이 좋습니다. Astro에는 이미지 최적화 기능이 내장되어 있어 일반 <img> 태그 대신 <Image> 컴포넌트를 사용하면 자동으로 최적화됩니다.

Cloudinary나 Cloudflare Images 같은 서비스에 이미지를 올리고 CDN으로 가속하면 로딩 속도를 더 높일 수도 있습니다.

다국어 지원

해외 사용자를 대상으로 하는 블로그라면 언어 전환 기능을 추가할 수 있습니다. Astro는 국제화를 지원하고 설정도 어렵지 않습니다. 다만 글마다 여러 언어 버전을 번역해야 하므로 작업량이 상당히 늘어난다는 점에 주의하세요.

결론

지금까지 많은 내용을 살펴봤지만 테마 선택의 핵심은 결국 자신의 요구 사항입니다.

• 미니멀한 디자인과 읽기 집중도를 원하나요? AstroPaper를 선택하세요. 검색과 초안 기능이 정말 유용합니다.
• 개성 있는 스타일을 보여 주고 싶나요? 설정이 간단하면서 우아한 Astro Air Blog를 사용해 보세요.
• 팀 블로그나 콘텐츠 플랫폼을 만드나요? Bookworm Light의 다중 작성자 지원이 잘 맞습니다.
• 빠르게 출시해야 하나요? AstroWind는 기능이 풍부하고 바로 사용할 수 있어 편리합니다.
• 디자인 세부 사항을 고민하고 싶지 않나요? Astro Cactus가 결정을 대신 내려 주므로 바로 사용할 수 있습니다.

먼저 요구 사항에 가장 가까운 테마를 골라 설치해 보기를 권합니다. 실행한 뒤 사용하면서 원하는 모습으로 조금씩 조정하세요. 처음부터 완벽하게 만들 필요는 없습니다. 블로그에서 가장 중요한 것은 콘텐츠이고 테마는 그 가치를 더해 주는 요소입니다.

30분이면 블로그를 만들 수 있습니다. 남은 시간에는 첫 글을 작성해 보세요. 문제가 생겨도 당황하지 말고 문서와 GitHub Issues를 검색하면 대부분 해결 방법을 찾을 수 있습니다. 그래도 해결되지 않는다면 댓글을 남겨 주세요. 가능한 한 도와드리겠습니다.

Astro 공식 테마 라이브러리(https://astro.build/themes/)에는 새 테마가 정기적으로 추가됩니다. 즐겨찾기에 저장해 두고 가끔 살펴보면 자신에게 더 잘 맞는 테마를 발견할 수 있습니다.

이제 테마 하나를 골라 직접 시작해 보세요!