AI/Claude Code 실패도 캐싱하라: API 클라이언트 회복력을 위한 TypeScript 패턴 (negative caching + discriminated union) API hammering을 막으려면 실패도 캐시해야 합니다. 30초 negative caching, 1시간 stale fallback, 그리고 TypeScript discriminated union으로 "데이터 또는 에러" 불변식을 타입에 박아 넣는 세 단계 패턴을 정리합니다.
AI/Claude Code 터미널 상태줄을 클릭 가능하게: OSC8 하이퍼링크와 두 가지 보안 함정 OSC8은 9줄짜리 함수로 터미널 텍스트를 클릭 가능한 링크로 만들어 줍니다. 단, segment 단위 URL 인코딩과 git remote URL의 자격증명 stripping이라는 두 가지 함정을 미리 잡지 않으면 토큰을 escape sequence 안에 그대로 노출시킬 수 있습니다.
AI/Claude Code claude-dashboard v1.14~v1.24: stdin 우선, OSC8 링크, 그리고 파서를 한 번 더 100배 빠르게 claude-dashboard v1.14~v1.24의 변화를 정리합니다. Claude Code stdin이 새 필드를 추가하면서 API 호출을 0으로 줄였고, 트랜스크립트 파서를 두 번 더 100배 빠르게 만들었으며, lastPrompt 위젯의 데이터 소스를 history.jsonl로 옮겼습니다.
인프라/Docker Docker Desktop, 아직도 쓰세요? 2026년 컨테이너 런타임 완벽 비교 가이드 16GB Mac에서 Docker Desktop이 8GB를 잡아먹고 있었습니다. OrbStack으로 전환하자 634MB로 줄었습니다. 2026년 현재 사용 가능한 5가지 대안을 실측 벤치마크와 함께 비교합니다.
AI/Claude Code 터미널 다크/라이트 모드 자동 감지: COLORFGBG 환경 변수의 조용한 진실 브라우저엔 `prefers-color-scheme`가 있는데 터미널엔 뭐가 있을까? COLORFGBG 환경 변수, OSC 11 이스케이프 쿼리, TERM_PROGRAM 휴리스틱을 비교하고, Rust TUI 프로젝트에서 쓴 12줄짜리 디텍터와 그 한계를 정리합니다.
AI/Claude Code Ratatui로 Miller Columns 3-Pane 파일 탐색 UI 만들기: Finder 스타일 TUI 설계 가이드 ratatui 튜토리얼은 대부분 단일 리스트에서 멈춥니다. Finder 스타일 3-pane 네비게이션을 만들기 위한 레이아웃 설계, pane 팩토리, 포커스 관리, 캐스케이딩 리셋 패턴을 Rosé Pine 테마와 함께 정리합니다.
AI/Claude Code Claude Code 프로젝트 폴더명 디코딩: `~/.claude/projects/`의 손실 인코딩 복원기 `~/.claude/projects/`의 이상한 폴더 이름을 사람이 읽을 수 있는 프로젝트명으로 되돌리는 알고리즘. 손실 인코딩 복원, greedy 파일시스템 매칭, 중복 제거까지 duru의 scan.rs가 세 번의 리팩토링을 거치는 과정을 정리합니다.
프론트엔드/React 한 기능을 수직으로 덮는 테스트 피라미드: Weekly Report 기능의 50+ 테스트 사례 연구 주간 리포트 하나를 출시하는 데 유닛 41개 + E2E 10개 = 51개 테스트가 필요했다. 같은 기능을 왜 여러 층위에서 반복 검증하는가? 피라미드 각 층의 역할과 '어떤 테스트를 어디에 둘지'의 구체적 선택.
프론트엔드/Next.js URL 쿼리로 토글하는 인라인 전체화면: Next.js App Router + useRouter().replace() 패턴 '별도 /fullscreen 라우트 만들지 말고, 같은 페이지에서 ?panel=full 쿼리로 토글합시다.' PR 리뷰 코멘트 하나로 페이지 전체가 단순해졌다. URL을 상태로 삼는 패턴과 그 한계.
백엔드/API설계 UI는 좁게, API는 넓게: 타임존 설정의 두 단계 검증 전략 조직별 타임존 설정에서 드롭다운은 6개만 보여주지만 API는 IANA 전체를 받습니다. 이 '좁은 UI, 넓은 API' 패턴이 왜 단순 화이트리스트보다 나은지, 그리고 Intl.DateTimeFormat으로 어떻게 구현하는지.
백엔드/API설계 메모 한 통에 10MB? API 입력 길이 제한으로 무제한 텍스트 남용 막기 리포트 메모 필드에 아무 제한 없이 문자열을 받고 있었다. 악의든 실수든 누군가 MB 단위 텍스트를 넣으면 DB와 네트워크가 먼저 비명을 지른다. 5분이면 추가할 수 있는 방어선을 PR 리뷰에서 발견한 기록.
백엔드/API설계 new Date(2026, 3, 6)의 9시간 드리프트: 테스트 픽스처는 왜 반드시 Date.UTC()여야 하는가 CI는 초록불인데 로컬에선 빨간불이 떴다. 원인은 테스트 픽스처의 new Date(2026, 3, 6) 한 줄. 로컬 타임존 생성자는 개발자 KST와 CI UTC 사이에서 9시간 어긋나고, 주차 경계 테스트를 조용히 깨뜨렸다.
백엔드/Prisma Prisma $extends 테넌트 격리와 $transaction 사이의 타협: 수동 orgId 주입 전략 SaaS 모드에서 Project 쿼리에 organizationId를 자동 주입하던 $extends 확장이 $transaction 콜백 안에서는 동작하지 않았다. 테넌트 격리를 포기할 수도, 트랜잭션을 포기할 수도 없어서 '수동 orgId 주입' 패턴으로 절충한 기록.
백엔드/API설계 Active, Ongoing, Completed: 주차 기반 태스크 상태 쿼리의 3가지 의미론과 그 함정 '이번 주 진행중인 태스크'를 쿼리하는 방법이 세 가지나 있었다. '주 중에 전환된', '주 동안 어느 시점이라도', '주 시작 시점에'. 말로는 비슷하지만 SQL은 전혀 다르고, 틀리면 이전 주부터 계속 진행되던 태스크가 리포트에서 사라진다.
백엔드/API설계 과거 주차 조회에서 '그 당시 최신 스프린트'는 뭐였나: weekEnd 기준 latest sprint 설계 주간 리포트 API가 '이번 주의 latest sprint' 개념으로 태스크를 골라왔는데, 과거 주차를 조회하면 '그 당시'가 아닌 '지금의' latest sprint가 튀어나왔다. carry-over 없이 버려진 태스크까지 리포트에 다시 나타나는 버그였다.
백엔드/Prisma 순차 루프를 10배 빠르게: Promise.all 병렬화 + findMany distinct 배치화로 API 응답 시간 잡기 주간 리포트 API가 과제 수에 비례하여 느려졌다. for 루프의 sprint+task 쿼리를 Promise.all로 병렬화해 10배, findFirst N회를 findMany(distinct) + createMany 2쿼리로 바꿔 50배. 두 최적화를 한 커밋에 담은 기록.
백엔드/Prisma 과거의 진실을 기록하는 법: Append-only ProjectStatusLog로 구현한 historical 주간 리포트 이번 주 주간 리포트를 보는데, 지난 달에 완료된 과제가 목록에서 사라졌다. 현재 상태(status=완료)로 필터하면 과거 주차 리포트가 오염된다 — 이 문제를 append-only 로그로 해결한 방법.
백엔드/Prisma findUnique → create의 함정: Prisma get-or-create 패턴의 P2002 레이스 컨디션과 3줄짜리 해법 '없으면 만들어'는 간단해 보이지만 동시 요청 2개가 들어오면 둘 다 'findUnique가 없다'를 거쳐 둘 다 create를 호출합니다. unique constraint에 걸려 P2002가 터지는 전형적인 get-or-create 레이스. try/catch 3줄로 우아하게 풀었습니다.
백엔드/API설계 Docker는 UTC, 사용자는 KST: Intl.DateTimeFormat만으로 만든 tz-aware ISO Week 유틸리티 주간 리포트의 주차 경계가 서버 컨테이너(UTC)와 사용자(KST) 사이에서 어긋났다. date-fns-tz나 luxon을 도입하는 대신, Node 22의 full-ICU Intl.DateTimeFormat만으로 IANA 타임존 ISO week 유틸리티를 구현한 기록.
도구/GitHub Git from Hell 탈출기: checkout 버리고, 좀비 브랜치 자동 청소까지 아직 git checkout 쓰시나요? 현대적 Git 명령어와 좀비 브랜치 자동 청소 alias를 실전 경험 기반으로 정리했습니다.
AI/Claude Code Rust TUI 스크린샷과 데모 GIF 만들기: ratatui와 Alternate Screen의 함정 Rust TUI 앱의 스크린샷과 데모 GIF를 만들려다 vhs와 asciinema가 모두 먹통이 되는 경험. 원인은 alternate screen buffer였고, TestBackend로 SVG를 직접 생성하는 접근과 alternate screen을 끄는 모드를 추가해 GIF 녹화를 살리는 두 가지 해결책을 정리합니다.
백엔드/인증-보안 Next.js에서 2FA/TOTP 인증 구현하기: 라이브러리 없이 RFC 6238 표준 준수 외부 라이브러리 없이 RFC 6238 TOTP 표준을 직접 구현했습니다. Dynamic Truncation 알고리즘 동작 원리와 Next.js 미들웨어에서 2FA를 강제하는 방법을 공유합니다.
백엔드/인증-보안 Next.js App Router에서 CSRF 토큰 관리하기: Double Submit Cookie 패턴 CSRF 공격을 방어하기 위해 Double Submit Cookie 패턴을 구현했습니다. Edge Runtime 호환, 타이밍 공격 방지, 그리고 useCsrfToken 훅까지의 경험을 공유합니다.
프론트엔드/크롬확장 크롬 확장 보안 강화: CSP와 최소 권한 원칙 크롬 확장은 강력한 권한을 가지므로 보안이 중요합니다. CSP로 인라인 스크립트와 동적 코드 실행을 차단하고, 불필요한 권한과 리소스 노출을 제거하여 공격 표면을 최소화했습니다.
프론트엔드/크롬확장 Chrome Alarms API로 자동 잠금 타이머 구현하기 Service Worker가 종료되면 setTimeout도 사라집니다. chrome.alarms API로 Service Worker 수명과 독립적인 자동 잠금 타이머를 구현했습니다.
