프론트엔드/Next.js Next.js 로컬 개발 환경 HTTP → HTTPS 전환 완전 가이드: mkcert, NextAuth v5 쿠키 문제 해결까지 로컬 개발 환경에서 HTTPS가 필요할 때 — mkcert 인증서 생성부터 NextAuth v5의 쿠키 프리픽스 문제 해결까지, 실전에서 마주치는 모든 함정과 해결법을 정리합니다.
AI/Claude Code /last30days 플러그인 셋업부터 Reddit 댓글 무료 최적화까지 — Claude Code 리서치 자동화 Claude Code의 /last30days 스킬 셋업부터 코드 수정까지. 키체인 팝업 해결, NoneType 버그 수정, Reddit 댓글 무료 최적화 방법을 공유합니다.
프론트엔드/크롬확장 크롬 확장 다국어(i18n) 구현하기: 런타임 언어 전환까지 크롬 확장에서 다국어를 지원하려면 Chrome i18n API만으로는 부족합니다. 런타임 언어 전환, 선언적 번역 적용, 여러 페이지 동기화까지 지원하는 커스텀 i18n 모듈을 구현했습니다.
프론트엔드/크롬확장 Chrome Storage로 실시간 상태 동기화 구현하기 popup에서 잠금 해제했는데 options 페이지는 여전히 잠금 화면? chrome.storage.onChanged 이벤트로 여러 페이지 간 상태를 실시간 동기화하는 패턴을 정리했습니다.
AI/Claude Code Claude Code iMessage 채널 연동: 터미널 없이 핸드폰으로 AI 코딩 어시스턴트 사용하기 Claude Code에 iMessage 채널을 연동해서 터미널 없이 핸드폰으로 AI 코딩 어시스턴트를 사용하는 방법. 설정 과정에서 만나는 bun 미설치, FDA 권한 등 흔한 함정과 해결법을 정리했습니다.
인프라/네트워크 Tailscale VPN 적용 후 GitHub Actions SSH 배포 복구하기 Oracle Cloud 서버에 Tailscale SSH를 적용했더니 CI/CD 배포가 깨졌습니다. appleboy/ssh-action에서 tailscale ssh로 전환하여 SSH 키 없이 안전하게 배포하는 전체 과정을 공유합니다.
백엔드/API설계 API 에러 처리 표준화: withErrorHandler 패턴으로 중앙집중화하기 API 엔드포인트가 늘어나면서 에러 처리 코드가 중복되고 응답 형식도 제각각이었습니다. withErrorHandler 래퍼와 세분화된 에러 클래스로 문제를 해결한 경험을 공유합니다.
백엔드/API설계 TypeScript Branded Types로 타입 안전성 높이기 모든 ID가 string 타입이라 인자 순서를 바꿔도 컴파일 에러가 안 났습니다. Branded Types 패턴으로 런타임 오버헤드 없이 타입 안전성을 확보한 방법을 공유합니다.
인프라/Docker 폐쇄망에서 pip install 사용하기: pypiserver + Docker로 PyPI 미러 서버 구축 외부 인터넷이 차단된 폐쇄망 환경에서도 `pip install`로 Python 패키지를 설치할 수 있습니다. pypiserver + Docker를 활용한 PyPI 미러 서버 구축 방법을 단계별로 설명합니다.
백엔드/API설계 Promise.all vs Promise.allSettled: 부분 실패를 허용하는 벌크 처리 100명에 대해 데이터를 생성하는데 1명이 실패하면 전체 99명도 실패로 처리되었습니다. Promise.allSettled로 부분 실패를 허용하는 벌크 처리를 구현한 방법을 공유합니다.
AI/Claude Code Rust CLI 배포 자동화: Homebrew, Scoop, Shell Installer를 GitHub Actions로 한 번에 구축하기 Rust CLI 도구를 태그 하나로 6개 플랫폼에 자동 배포하는 방법. Homebrew tap, Scoop bucket, Shell installer를 GitHub Actions로 구축한 실전 경험을 공유합니다.
백엔드/API설계 API 에러 추적 개선하기: errorId 패턴으로 디버깅 시간 단축 "서버 오류가 발생했습니다" 메시지만으로는 어떤 에러인지 특정할 수 없었습니다. errorId 패턴으로 디버깅 시간을 90% 단축한 방법을 공유합니다.
백엔드/API설계 JavaScript 타임존 함정 피하기: UTC vs Local 날짜 처리 1월 31일을 선택했는데 1월 30일로 저장되는 버그를 발견했습니다. JavaScript Date 생성자의 타임존 해석 방식을 이해하고, 정오(12:00) 패턴으로 해결한 방법을 공유합니다.
백엔드/API설계 Next.js API에 Rate Limiting 구현하기 (메모리 기반) API 보안을 위해 Rate Limiting이 필요했습니다. Redis 없이 메모리 기반으로 구현하고 HTTP 429 표준을 준수한 방법을 공유합니다.
도구/GitHub GitHub Issues 완전 가이드: Epic, Sub-Issues, Labels로 프로젝트를 체계적으로 관리하는 법 GitHub Issues를 단순한 버그 트래커가 아닌, 프로젝트 전체 로드맵을 관리하는 도구로 활용하는 실전 가이드. 2025년 GA된 Sub-Issues를 포함해 Epic, Labels, Pin, Projects 통합까지 다룹니다.
백엔드/Prisma Prisma 일괄 업데이트에서 동시성 이슈 해결하기 ($transaction 활용) 두 사용자가 동시에 일괄 상태 변경을 실행했을 때 데이터가 꼬이는 버그를 발견했습니다. Prisma $transaction으로 TOCTOU 취약점을 해결한 방법을 공유합니다.
백엔드/Prisma Prisma Extension으로 민감 데이터 암호화 자동화하기 개인정보보호법 준수를 위해 DB 민감 데이터를 암호화해야 했습니다. Prisma Extension으로 투명한 암호화를 구현하고, Blind Index로 검색 문제까지 해결한 경험을 공유합니다.
프론트엔드/React Vitest와 MSW로 React Hook 테스트하기 (실전 가이드) Jest 테스트가 느려서 Vitest로 마이그레이션했습니다. MSW와 함께 Custom Hook을 테스트하는 실전 가이드를 공유합니다.
개발환경/Python pyenv rehash 락 파일 에러 해결: "couldn't acquire lock" 60초 멈춤 문제 pyenv rehash가 "couldn't acquire lock" 에러와 함께 60초 동안 멈추는 문제의 원인은 스테일 락 파일입니다. 소스 코드의 noclobber 메커니즘을 분석하고, 해결 방법과 --no-rehash를 활용한 예방법을 정리했습니다.
프론트엔드/크롬확장 크롬 확장 공유 모듈 설계: 중복 코드 450줄 제거기 popup, options, manager, onboarding 4개 페이지에 복사된 동일한 코드를 발견했습니다. shared/ 폴더에 기능별 모듈로 추출하여 총 215줄을 줄이고, DOM 메서드로 XSS를 방지하는 아이콘 팩토리까지 구현한 과정을 공유합니다.
프론트엔드/크롬확장 크롬 확장 프로젝트 구조 정리하기: popup, options 폴더 분리 크롬 확장 루트 디렉토리에 뒤섞인 파일들을 기능별 폴더로 정리했습니다. manifest.json 경로 업데이트, git mv로 히스토리 보존, 트러블슈팅 팁까지 리팩토링 전 과정을 공유합니다.
AI/Claude Code Astro Starlight + Vercel: 코드 없이 만드는 프로젝트 문서 사이트 실전 가이드 오픈소스 프로젝트 문서 사이트를 Astro Starlight로 구축하고 Vercel에 배포한 실전 가이드. 코드라고 할 만한 것이 거의 없이, 마크다운과 설정 파일 3개만으로 전문적인 다국어 문서 사이트를 완성한 경험을 공유합니다.
백엔드/Prisma Prisma N+1 쿼리 성능 문제 해결하기 (50% 속도 개선) API 응답이 느려서 쿼리 로그를 분석했더니 N+1 유사 패턴이 발견되었습니다. Prisma의 관계 중첩을 활용해 쿼리를 통합하고 50% 성능 개선을 달성한 방법을 소개합니다.
백엔드/Prisma Prisma Decimal to Number 변환 시 silent failure 방지하기 API에서 계산 결과가 NaN으로 표시되는 버그를 발견했습니다. Prisma Decimal 타입을 Number()로 변환하면서 발생한 silent failure를 safeNumber 패턴으로 해결한 방법을 공유합니다.
백엔드/인증-보안 Express 프록시 레이어에서 파일 다운로드 자동 암호화 구현하기 http-proxy-middleware의 selfHandleResponse 옵션을 활용해 파일 다운로드 응답을 가로채고 AES-256-GCM으로 암호화하는 방법. 전략 패턴으로 사내 API 연동도 준비.
