왜 Astro로 MoodturnPost를 만들었나#

요약#

이 글의 핵심 3가지

운영비를 거의 0으로: 정적 생성(SSG) + Cloudflare Pages로 “서버 운영” 부담을 줄인다.

기본값이 가벼움: 블로그는 읽기가 대부분이라, JS는 꼭 필요한 곳에만 붙이고 싶었다.

글 쓰기 흐름이 단순: Markdown으로 쓰고 → 빌드하고 → 배포하면 끝.

읽는 시간: 6분 | 난이도: 초급

출처#

이 글은 다음 자료를 바탕으로 작성되었습니다.

Why Astro? - Astro를 선택해야 하는 이유
Astro Islands - Islands 아키텍처 개념
Build your first Astro Blog - Astro 튜토리얼 소개

우리가 원한 것#

MoodturnPost는 “웹앱”이 아니라 “글”이 중심입니다. 그래서 기술 스택도 이렇게 골랐습니다.

운영이 쉬울 것: 올리고 나면 유지보수가 쉬워야한다.
다양한 환경에서 읽힐 것: PC뿐만 아니라 모바일 등 다양한 환경에서 읽힐 수 있어야한다.
발행이 쉬울 것: 글을 쓰는 게 제일 중요하다.

왜 Astro가 맞았나#

우리 기준에서 Astro는 딱 “블로그스러운 기본값”이었습니다.

정적 생성이 자연스럽다: 빌드 결과물이 파일로 떨어지고, 그걸 그대로 배포하기 쉽다.
JS를 아끼기 쉽다: “기본은 HTML”이고, 필요한 곳만 인터랙션을 붙이는 흐름이 잘 맞는다.
배포가 단순하다: Markdown만 올리면 끝나는 구조가 좋았다.

콘텐츠 중심 설계#

Astro는 “블로그, 문서, 포트폴리오” 같은 콘텐츠 사이트를 위해 만들어졌습니다.
React나 Vue는 “웹앱”에 강하지만, 우리처럼 글이 중심이면 Astro가 더 맞습니다.

서버에서 HTML 생성: 방문자 브라우저 부담을 줄인다
JavaScript는 선택: 꼭 필요한 곳만 쓰면 된다
Markdown 기본 지원: 별도 플러그인 없이 .md 파일이 바로 페이지가 된다

실제로 같은 기능을 React로 만들면 40% 더 느리고, JS 용량은 90%나 더 크다고 합니다.
우리는 “빠르게 읽히는 블로그”가 목표였으니, 이게 결정적이었습니다.

Islands 아키텍처란#

Astro의 핵심 아이디어는 필요한 곳만 JS 붙이기입니다.

공식 문서는 이걸 “Islands Architecture”라고 부르는데,
섬처럼 독립된 인터랙션 영역만 JavaScript를 쓴다는 뜻입니다.

어떻게 작동하나#

페이지를 두 종류로 나눕니다.

정적 HTML: 헤더, 본문, 푸터 같은 고정 콘텐츠

Interactive Island: 댓글, 검색창, 이미지 슬라이더 같은 인터랙션

예를 들어 이 글 페이지는 이렇게 구성됩니다.

1
┌─────────────────────┐
2
│   헤더 (정적 HTML)   │
3
├─────────────────────┤
4
│   글 본문 (정적)     │
5
├─────────────────────┤
6
│ 🏝️ 댓글 (Island)   │  ← 여기만 JS 로드
7
├─────────────────────┤
8
│   푸터 (정적)       │
9
└─────────────────────┘

댓글 영역만 React 컴포넌트로 만들고, 나머지는 순수 HTML입니다.
그래서 페이지가 빠르게 뜨고, 댓글만 나중에 로드됩니다.

왜 빠른가#

필요한 것만 로드: 전체 페이지가 아니라 섬만 JS를 받는다
병렬 처리: 각 섬이 독립적이라 서로 기다리지 않는다
화면 밖은 안 받음: 스크롤 전까지 안 보이는 섬은 나중에 로드

블로그처럼 “읽기”가 대부분이면, 이 방식이 딱입니다. 글만 보고 가는 사람한테 불필요한 JS를 안 보내니까요.

마무리#

우리는 “빠르고, 싸게 운영되고, 글 쓰기에 집중할 수 있는” 블로그를 원했습니다.
Astro는 이 세 가지를 기본값으로 제공했습니다.

정적 생성(SSG) + Cloudflare Pages 조합으로 운영비 사실상 0원

Islands로 성능 확보

Markdown으로 단순한 발행 흐름

물론 모든 프로젝트에 맞는 건 아닙니다. 실시간 인터랙션이 많거나, SPA가 필요하면 다른 선택이 나을 수 있습니다. 하지만 “콘텐츠 중심 블로그”라면, Astro는 확실히 좋은 출발점입니다.

왜 Astro로 MoodturnPost를 만들었나