프롬프트 2개와 스크린샷 1장: AI 에이전트와 블로그 CSS 라이브러리 마이그레이션

Perplexity Discover 피드를 스크롤하다가 눈에 들어온 게 있었어요. oat.ink — 8KB짜리 시맨틱 CSS 라이브러리. 의존성 없고, 빌드 스텝도 없고, 다크모드 내장.

스크린샷을 찍어서 Hermione한테 보냈습니다. 질문은 하나.

“우리 블로그 이걸로 마이그레이션 할 수 있을까?”

Hermione는 우리 코드베이스를 읽고, oat의 CSS를 받아서 분석하고, 컴포넌트별 매핑 결과를 정리해서 돌려줬어요. 블로그는 Astro 파일 5개에 수작업 CSS 약 240줄. oat가 거의 다 커버하는 구조였습니다.

두 번째 프롬프트:

“하자.”

3분 후: 빌드 통과, 커밋, 푸시, Vercel 배포 중.

끝이에요.

실제로 바뀐 것

마이그레이션 자체는 솔직히 대단한 게 아닙니다.

  • 수작업 CSS 약 260줄 삭제
  • oat.min.css + oat.min.js 추가 (gzip 기준 8KB)
  • 보너스: 다크모드 토글, 태그를 뱃지 스타일로 변경
  • 순감소: 코드 170줄

글 4개, 레이아웃 2개짜리 작은 블로그예요. 영웅적 리팩터링은 아닙니다.

근데 프로세스가 인상적이었어요.

내가 한 것 vs. Hermione가 한 것

나:

  1. Perplexity에서 스크린샷 봤다
  2. 전달했다
  3. “마이그레이션 가능한지 봐줘” 라고 했다
  4. “하자” 라고 했다
  5. 배포 결과를 확인했다

Hermione:

  1. Astro 레이아웃/페이지 파일 5개 읽음
  2. oat.ink 접속, CSS 다운로드, 커버리지 분석
  3. 기존 커스텀 스타일 → oat 대응 항목 매핑
  4. 바로 매핑되는 것, 수정 필요한 것, 삭제 가능한 것 정리
  5. 파악 결과를 테이블로 정리해서 제시
  6. 템플릿 파일 3개 전부 재작성
  7. oat.min.css + oat.min.js를 public/에 다운로드
  8. 다크모드 토글 + localStorage 연동 추가
  9. 빌드, 확인, 커밋, 푸시

나한테서 나온 프롬프트: 2개. Hermione가 실행한 단계: 9개.

프로젝트가 작으니까 가능한 거다

여기서 정직해야 해요. 저는 낮에 대규모 엔터프라이즈 코드베이스를 다룹니다. 브라운필드, 수년간 쌓인 복잡도, 어딘가에 숨어있는 암묵적 컨벤션.

그 세계에서는 에이전트에 싱글 샷 프롬프팅이 아직 안정적으로 안 돌아가요. 컨텍스트 윈도우가 차고, 에이전트가 세 폴더 안에 묻힌 컨벤션을 놓치고, 안전해 보이는 변경이 잊고 있던 통합 테스트를 깨트립니다.

하지만 그린필드 개인 프로젝트 — 파일 5개, 명확한 구조, 한 사람의 컨벤션 — 에서는 이 워크플로우가 진짜로 게임 체인저예요.

“이거 해볼까?”에서 “배포 완료”까지의 거리가 문장 두 개 치는 시간으로 줄었습니다.

생각하게 만드는 부분

저는 직원을 둬본 적이 없어요. 사람에게 일을 맡기고 결과를 받아보는 게 어떤 느낌인지 모릅니다.

근데 이게 그런 느낌이었을 것 같아요. 뭔가를 가리키고, “이게 우리한테 맞는지 확인해줘”라고 하고, 구조화된 분석을 받고, “해”라고 하고, 배포된 결과를 받았으니까.

그리고 좀 씁쓸한 부분이 있어요. 이걸 무한정 계속할 수가 없다는 것. 토큰은 돈이고, 모든 대화에는 예산 한계가 있어요. 만약 Hermione를 더 긴 작업에 계속 돌릴 수 있다면 — 몇 시간짜리 리팩터링, 며칠짜리 문서화 프로젝트 — 결과물이 의미 있게 달라질 것 같습니다.

지금은 에이전트 싱글 샷에 깔끔하게 들어가는 작업 크기가 작아요. CSS 마이그레이션에는 충분하지만, “40개 마이크로서비스에 걸친 인증 레이어 재구성”에는 아직이죠.

하지만 방향은 분명합니다. 그리고 솔직히, 작은 것도 쌓이면 큽니다.

머리에서 안 떠나는 것

에이전트가 “예상 시간 단위” 작업을 안정적으로 처리할 수 있게 되면 어떻게 될까?

“함수 하나 만들어줘”가 아니라, “테스트 하나 써줘”도 아니라: “여기 코드베이스. 여기 설계 문서. 구현해서 스테이징에 올려줘. 끝나면 알려줘.”

아직 거기는 아닙니다. 하지만 오늘 저는 스크린샷 하나와 문장 두 개로 CSS 라이브러리를 마이그레이션했어요. 1년 전이었으면 데모 슬라이드처럼 들렸을 거예요. 지금은 그냥… 월요일 오후입니다.

그 사이에 Harry도 같은 걸 했다

웃긴 건 이 부분이에요.

Hermione가 블로그를 oat.ink로 마이그레이션하는 동안, 같은 스크린샷을 Harry한테도 보냈습니다 — AI SOTA Feed Bot을 만들고 유지하는 다른 AI 에이전트요.

Harry도 같은 오후에 피드봇 웹 UI 전체를 oat.ink로 마이그레이션했어요. CSS 기본 적용부터 시작해서, 시맨틱 HTML 재구성, 다크모드 토글, 빈 상태/에러 상태 처리 + 뱃지까지 단계별로. 거기서 멈추지 않고 피드 히스토리 누적, 날짜/시간 기반 필터링, from/to 쿼리 파라미터가 있는 API까지 추가했습니다.

에이전트 2개. 프로젝트 2개. 같은 스크린샷 트리거. 같은 오후.

블로그 마이그레이션은 프롬프트 2개. Harry 쪽은 피드봇이 더 복잡해서 몇 개 더 들었지만, 패턴은 동일했어요. 뭔가를 가리키고, “이거 해”라고 하고, 결과를 확인한다.

오늘 CSS를 한 줄도 직접 안 썼습니다. 배포된 프로젝트 2개가 더 나아졌어요.

이 모든 걸 시작한 스크린샷

Perplexity Discover 피드에서 oat.ink 카드를 본 게 전부였어요. 카드 하나. 스크린샷 하나. 마이그레이션이 노력 대비 가치가 있는지 따져보는 데 쓴 시간: 제로.

왜냐면 노력이 프롬프트 2개였으니까.

이게 진짜 변화예요. 마이그레이션이 어려웠는데 AI가 쉽게 만들어준 게 아닙니다. 예전 노력 기준으로는 생각할 가치도 없었던 개선이, 이제는 해볼 만해진 거예요.

“이 개선이 내 시간을 들일 만한가?”의 계산이 바뀌었습니다. 내가 빨라져서가 아니라, 시도의 비용이 거의 0에 가까워졌기 때문에.