tag · 8 posts

#experience

  • experience
  • develop
  • devops
  • ai
  • claude-code
  • shell
  • jq
  • cli

VSCode에서 돌리는 Claude Code 세션은 왜 안 잡힐까 — ccwhere 구축기

병렬로 띄운 Claude Code 세션을 한눈에 보는 도구를 찾다 기존 도구들이 VSCode 확장의 세션을 못 잡는 이유를 추적했습니다. 해법은 프로세스 추적이 아니라 세션 로그 파일을 직접 읽는 것이었습니다. jq의 16진수 미지원, command substitution 안에서 죽는 tput, 셸 변수 확장이 삼킨 jq 변수까지, 작은 셸 스크립트 하나에 박힌 함정들을 정리합니다.

read →
  • experience
  • develop
  • backend
  • frontend
  • socketio
  • nextauth
  • nextjs
  • debugging

두 라이브러리의 req는 같은 req가 아니었다

채팅 기능을 구현하던 날 socket 레이어의 게이팅을 비워둔 익숙한 손버릇이, 보안 마이그레이션 시점에 정확히 같은 자리에서 청구서로 돌아왔습니다. NextAuth의 SessionStore가 req.cookies만 보고 req.headers.cookie 헤더 자체는 무시한다는 사실을 추적하기까지의 디버깅과, 끝내 root cause를 단정하지 못한 채 in-flight 가드로 봉합한 버그까지의 회고입니다.

read →
  • experience
  • design
  • develop
  • frontend
  • a11y
  • chart
  • react
  • d3
  • interactive

인터랙션과 접근성을 모두 고려한 차트 만들기

44개 차트 데모를 한 자리에 모았습니다. 시각 사용자·키보드 사용자·스크린리더 사용자가 모두 자연스럽도록 처음부터 설계했고, 그 과정에서 정착된 패턴들 — HTML overlay, roving tabindex, 호버와 키보드 포커스의 분리, 데이터 표 fallback — 을 함께 정리했습니다.

read →
  • experience
  • develop
  • frontend
  • backend
  • testing
  • jest
  • react
  • nextjs

테스트가 없던 두 레포에 단위·컴포넌트·통합 테스트를 들이며

사람 눈검토만으로 운영 VM에 배포되던 두 레포에 jest를 깔았습니다. 어드민에서 검증한 패턴을 서비스로 옮기는 미러링 전략으로 네 단계를 차례로 진행했고, 그 사이에 만난 함정과 결정 패턴을 정리합니다.

read →
  • experience
  • develop
  • frontend
  • react
  • nextjs
  • security
  • cve
  • rsc

React/Next.js CVE 6개월 정리

React 19와 Next.js의 6개월 동안 발견된 CVE들을 한 편에 정리합니다. 각 CVE의 문제, 재현 방식, 패치, 그리고 당장 올릴 수 없을 때의 대처법을 코드 예시와 함께 다룹니다.

read →
  • experience
  • develop
  • frontend
  • security
  • swiper
  • dependency
  • prototypepollution

같은 critical, 두 앱의 다른 선택

스와이퍼의 두 번째 prototype pollution은 5년 전 패치가 우회된 사례입니다. 같은 CVE를 공유하는 두 앱 중 하나는 제거를, 다른 하나는 메이저 업그레이드를 택했습니다. 의존성의 실효 위험은 advisory가 아니라 코드가 결정합니다.

read →
  • experience
  • develop
  • infra
  • devops
  • gce
  • centos
  • selinux
  • pm2
  • systemd

한 달간 1분 30초마다 죽고 있었던 서버

Next.js 서비스에서 시간을 두고 접속하면 가끔 503이 떨어지던 문제를 추적했습니다. 처음에는 MongoDB 유휴 커넥션을 의심해 옵션을 다듬었고, 다음으로 OOM을 의심했지만 둘 다 원인이 아니었습니다. 진짜 원인은 PM2 데몬 자체가 systemd에 의해 통째로 강제 종료되고 있다는 사실이었고, 그 뿌리에는 SELinux의 사용자 홈 파일 접근 차단이 있었습니다.

read →
Astro + Vercel로 구축하는 개인 기술 블로그 세팅 후기
  • experience
  • develop
  • frontend
  • astro
  • vercel
  • blog
  • ssg

Astro + Vercel로 구축하는 개인 기술 블로그 세팅 후기

플랫폼에 종속되지 않고, 내 도메인에서 글을 온전히 소유할 수 있는 기술 블로그를 구축하려 합니다. 주로 기술이나 디자인에 관한 실무적·교육적 콘텐츠를 다룰 예정이며, 코드 블록과 인터랙티브 데모를 자유롭게 삽입할 수 있는 환경이 필요합니다. 이 글에서는 기술 스택을 선정하기까지의 과정과, 최종 선택한 Astro + Vercel 조합의 구체적인 구현 방법을 정리합니다.

read →