본문으로 건너뛰기

Blog

기술 기록

Frontend

CDN이 뭔지 모르는 프론트엔드 개발자를 위한 CDN 입문

CDN의 개념부터 이미지 최적화, JS 라이브러리 로딩까지. "대충 아는" 상태가 답답해서 한번 제대로 파봤다.

DevTools

Next.js 블로그에 Mermaid 다이어그램 도입기 (npm 없이 CDN으로)

블로그 다이어그램이 한국어 때문에 깨지는 문제를 발견하고, Mermaid를 CDN 방식으로 도입한 과정.

AWS

Presigned URL 완전 가이드

S3 Presigned URL의 동작 원리부터 서명, 업로드 흐름, 보안 모델까지 정리

DevTools

Claude Code는 앱이다 — Agentic Loop, 토큰 흐름, Hook의 동작 원리

Claude Code의 실체는 API를 반복 호출하는 Node.js 루프 프로그램. 턴별 토큰 흐름과 Hook의 개입 지점 정리

DevTools

Python vs 쉘 스크립트 — 자동화 도구를 선택하는 기준

Figma 퍼블리싱 파이프라인 포팅 경험을 바탕으로 쉘 스크립트와 Python의 선택 기준 정리

DevTools

Claude Code에서 반응형 퍼블리싱 자동화: Skill vs Agent 아키텍처

Figma 반응형 퍼블리싱 시 컨텍스트 한계로 AI가 추측하는 문제를, 섹션 분할과 Skill→Agent 위임 패턴으로 해결한 과정

DevTools

Claude Code의 AI 협업 패턴: Subagent vs Team

Claude Code에서 AI를 활용하는 두 가지 핵심 패턴을 실제 프로젝트 적용 사례와 함께 비교한다.

DevTools

Claude Code 토큰 최적화와 에이전트 전략

Claude Code의 턴별 토큰 누적 재전송 원리와 스킬/서브에이전트/팀 실행 환경 비교, 멀티 페이지 퍼블리싱 최적화 전략 정리

DevTools

Claude Code의 CLAUDE.md와 Memory 시스템 활용기

매 세션마다 같은 규칙을 반복 설명하는 대신, CLAUDE.md와 Memory 시스템으로 프로젝트 규칙을 자동화하는 방법을 정리했다.

Frontend

Next.js App Router에서 멀티스텝 폼의 뒤로가기 차단 구현하기

History API의 더미 entry 패턴과 popstate, beforeunload, requestLeave 콜백을 조합하여 멀티스텝 폼의 이탈을 방지하는 방법을 정리한다.