Welcome to Dev Blog
· meta
#astro#mdx#tailwind
블로그 소개
이 블로그는 제가 업무상 혹은 개인 개발 과정에서 얻게 된 지식을 문서로 정리하기 위해 만들어졌습니다. Astro + MDX를 기반으로 정적 사이트를 생성하고, GitHub Pages로 배포합니다.
기술 스택
| 기술 | 역할 |
|---|---|
| Astro | 정적 사이트 생성 |
| MDX | Markdown + JSX 컴포넌트 |
| Tailwind CSS v4 | 유틸리티 기반 스타일링 |
| GitHub Pages | 배포 |
기능
- 🌓 라이트/다크 테마 — 시스템 설정에 맞추어 자동 전환, 사용자 선택 저장
- 🔍 클라이언트 검색 — 빌드 시 JSON 인덱스 생성, 즉시 검색
- 📰 RSS 피드 —
/rss.xml - 🗺️ 사이트맵 — 자동 생성
- 🤖
llms.txt— LLM 친화적 사이트 설명
코드 블록 예시
import { defineConfig } from "astro/config";
import mdx from "@astrojs/mdx";
export default defineConfig({
integrations: [mdx()],
});
MDX를 사용하면 Markdown 안에서 React 컴포넌트를 사용할 수 있습니다.
따라해보고 싶다면
src/site.config.ts에서 블로그 제목과 작성자 이름을 수정합니다src/content/posts/디렉토리에 새 포스트를 추가합니다pnpm dev로 로컬에서 확인 후main브랜치에 push하면 자동 배포됩니다