← back to notes

DEVELOP / ASTRO / 2026.08

Astro 블로그를 검은 노트처럼 만들기

웹 UI처럼 보이던 첫 화면을 검은 노트에 흰 펜으로 적은 기록처럼 낮추는 과정입니다. 색을 줄이고, 카드 대신 줄과 여백으로 구조를 잡았습니다.

1. 시작점

처음 버전은 검은 배경과 큰 타이포를 쓰긴 했지만, 버튼과 카드가 강해서 블로그보다 대시보드처럼 보였습니다. 그래서 장식 색을 걷어내고 흰색, 회색, 희미한 줄만 남겼습니다.

2. 구조

홈은 글 목록과 프로젝트 설명을 보여주고, 상세 페이지는 하나의 노트 페이지처럼 본문이 이어지도록 구성합니다. 분석 글은 나중에 Quarto 결과물과 연결할 수 있고, 개발 글은 Astro 파일 하나로 바로 추가할 수 있습니다.

src/pages/index.astro
src/pages/posts/astro-notebook.astro
src/pages/posts/samsung-lineup.astro

3. 다음 수정 포인트

글이 늘어나면 `posts` 배열을 분리하거나 Astro Content Collections로 옮기는 게 좋습니다. 지금은 빠르게 실험하기 위해 홈의 배열과 상세 페이지 파일을 직접 수정하는 방식으로 남겨두었습니다.