Roamlings 개발기 ② — 데스크탑 펫이 창 위를 걷기까지, koffi로 Win32 창 위치 읽기
Electron 데스크탑 펫이 열어 둔 창 위를 걷도록 koffi로 EnumWindows·DwmGetWindowAttribute를 불러 창 위치를 읽고, 최대화 창·가려진 창·모니터 경계 문제를 푼 과정입니다.
goodchuck 블로그
사이드 프로젝트를 만들며 부딪힌 문제와 풀어낸 방법을 기록해요.
글 34편 · 마지막 글 · 만든 것 · 소개
연재 중
먼저 읽어 볼 글
- 개발QueuePool limit of size 5 overflow 10 reached — FastAPI + SQLite API 가 20분 멈춘 이유와 NullPool 로 고친 기록FastAPI + SQLAlchemy + SQLite 서버가 QueuePool limit 에러로 20분 멈춘 원인과, 파일 SQLite 에 NullPool 을 쓴 이유. 헬스체크 HEAD 405 함정까지.
- 개발Next.js ISR 인데 매번 렌더된다면 — searchParams 하나가 페이지 전체를 동적으로 만든다Next.js 에서 revalidate 를 줬는데 x-vercel-cache 가 늘 MISS 라면. searchParams 가 경로 전체를 동적으로 만드는 이유와 rewrites 로 기본 주소만 캐시한 방법.
- 개발Vercel 무료 플랜으로 모노레포 앱 여러 개 배포하기 — 하루 배포 100번, 업로드 5,000개 한도를 피한 방법Vercel 무료 플랜에서 모노레포 앱 여러 개를 배포하다 하루 배포 100번 · 업로드 5,000개 한도에 걸렸습니다. 태그 배포와 --archive=tgz 로 둘 다 피한 과정.
- 개발Next.js 블로그에서 GA4 · 애드센스를 운영에서만 켜기 — 로컬 · 미리보기 · 운영 나누는 법Next.js 블로그에서 로컬·Vercel 미리보기 방문이 GA4 에 섞이지 않게, 애드센스와 검색 노출을 운영에서만 켜는 법. NODE_ENV · VERCEL_ENV 로 환경을 나누고 미리보기는 noindex.
Roamlings 개발기 ① — Shimeji 같은 데스크탑 펫 게임, Godot 대신 Electron으로 시작한 이유
Shimeji·꼬미처럼 바탕화면을 걸어 다니는 데스크탑 펫 게임 Roamlings를 시작하며, 비슷한 게임을 비교하고 Godot 대신 Electron을 고른 이유와 투명 오버레이 창 구조를 정리했습니다.
Next.js 캐시를 하루로 늘리고 revalidateTag 로 갱신하기 — 캐시가 두 겹이면 생기는 일
Next.js ISR 캐시를 하루로 늘리고 데이터가 바뀔 때 revalidateTag 로 갱신한 기록. 태그 설계, 'max' 와 expire 0 차이, API 캐시와 겹쳐 옛 값이 하루 굳던 버그까지.
모노레포 CI 에서 바뀐 앱만 검사하기 — turbo 필터, pnpm 필터와 무엇이 다른가
pnpm · turbo 모노레포에서 GitHub Actions 로 PR 마다 바뀐 앱만 린트 · 타입 · 테스트하는 법과, turbo · pnpm 필터 비교, 이미 깨진 앱을 다루는 법을 정리했습니다.
three.js 로 5천 명을 3D 은하로 — 첫 화면 사진 4MB 를 22KB 로 줄인 렌더링 기록
three.js 로 버튜버 5천여 명을 3D 은하로 그리며 InstancedMesh · 텍스처 아틀라스 · 보이는 사람만 사진 받기 · 화면 밖 멈춤으로 첫 화면 사진을 4MB 에서 22KB 로 줄인 기록입니다.
Open Graph 로 링크 미리보기 만들기 — 유튜브는 og 태그가 780KB 뒤에 있었다
Open Graph 태그가 무엇이고 미리보기 로봇이 어떻게 읽는지 정리하고, 직접 읽어 링크 미리보기를 만들며 겪은 문제와 성능 개선(읽을 양 · 그림 크기 · 요청 수)을 적었습니다.
AI 가 쓴 글에서 지어낸 숫자 걸러 내기 — 숫자 검사로 자동 게시까지 가 본 기록
LLM 이 쓴 통계 글에서 데이터에 없는 숫자를 코드로 잡아 숨기는 방법. 프롬프트 규칙, 입력 정리, 숫자 검사 코드와 실제 결과, 끝내 못 잡는 오류까지 정리했습니다.
AI 코딩 세션을 여러 개 돌리면 왜 꼬일까 — git worktree 로 폴더를 나누고 규칙으로 막은 것들
Claude Code 세션 여러 개를 한 모노레포에서 돌릴 때 생기는 충돌을 git worktree 와 역할 분담으로 막은 기록. stash 공유, env, 머지 사고, 30GB 까지 실제 운영 경험을 정리했습니다.
Lighthouse 성능 59점이 다시 재니 94점 — 점수가 흔들리는 이유와 애드센스가 권장 사항을 79점에 묶는 이유
같은 페이지의 Lighthouse 성능이 59점에서 94점으로 바뀐 이유와, 애드센스를 붙이면 권장 사항이 79점에 머무는 이유. 실제 측정값으로 고칠 것과 둘 것을 나눴습니다.
QueuePool limit of size 5 overflow 10 reached — FastAPI + SQLite API 가 20분 멈춘 이유와 NullPool 로 고친 기록
FastAPI + SQLAlchemy + SQLite 서버가 QueuePool limit 에러로 20분 멈춘 원인과, 파일 SQLite 에 NullPool 을 쓴 이유. 헬스체크 HEAD 405 함정까지.
Windows 용 Electron 앱을 맥에서 개발하다 겪은 것 — 창 끌기 · 키체인 · 빈 화면 고친 기록
Windows 용 Electron 앱을 맥에서 개발하다 보니 창이 안 끌리고, 켤 때마다 키체인 창이 뜨고, 개발 창이 about:blank 였습니다. 원인과 고친 코드, 두 OS 체크리스트.
치지직 순위 사이트를 사흘 동안 다시 그렸다 — Chzzk Watcher 화면 개편
치지직 순위 아카이브의 차트 · 홈 · 스트리머 페이지를 '방송 전광판' 기준 하나로 다시 그렸습니다. 순위 색을 금 · 은 · 동으로 줄이고 출석표 · 월간 달력을 만든 과정.
정적 블로그도 예외는 아니었다 — Next.js 취약점 41건을 2건으로 줄인 보안 점검
정적 Next.js 블로그도 pnpm audit 을 돌리니 치명 4건 포함 41건이 나왔습니다. 모노레포 결과를 내 앱 기준으로 읽고, Next 업그레이드와 보안 헤더로 2건까지 줄인 과정.
Vercel 무료 플랜으로 모노레포 앱 여러 개 배포하기 — 하루 배포 100번, 업로드 5,000개 한도를 피한 방법
Vercel 무료 플랜에서 모노레포 앱 여러 개를 배포하다 하루 배포 100번 · 업로드 5,000개 한도에 걸렸습니다. 태그 배포와 --archive=tgz 로 둘 다 피한 과정.
내가 만든 치지직 순위 사이트가 대만 야후 뉴스에 인용됐다
치지직 순위 아카이브 Chzzk Watcher 가 대만 야후 뉴스의 에일리 버튜버 데뷔 기사에 출처로 링크됐습니다. 애널리틱스로 발견한 과정과 일주일 방문자 변화, 매 정각 기록이 출처가 된 이야기.
그날의 치지직을 다시 보다 — 치지직 순위 아카이브, Chzzk Watcher
치지직은 지금 순위만 보여 줍니다. 매 정각 인기 스트리머 Top 20 을 기록해 그날 그 시간의 1등, 시청자 추이, 채팅까지 다시 볼 수 있게 만든 치지직 순위 아카이브 Chzzk Watcher 를 소개합니다.
그림 연습 앱에서 이미지 생성만 떼어 냈다 — NovelAI 생성 앱 gendesk
그림 연습 앱 artdesk 에 붙였던 NovelAI 이미지 생성 기능을 별도 앱 gendesk 로 떼어 낸 이유와, 프롬프트를 조각으로 나눠 쓰고 재료를 '더하기 · 바꾸기' 둘로 정리한 설계를 소개합니다.
그림 연습을 관리하는 데스크탑 앱, artdesk 를 만들었다
그림 파일은 쌓이는데 얼마나 연습했는지는 안 보였습니다. 라이브러리 · 구도 · 포즈 · 크로키 · 입체 · 3D 인형 · 연습 일지를 한 앱에 담은 그림 연습 앱 artdesk 소개.
사람보다 로봇이 먼저 왔다 — 크롤러가 몰려 서버가 죽은 날
버튜버 대시보드를 공개하고 며칠 만에 검색 크롤러가 몰려 서버가 죽었습니다. 원인이 된 주소 조합 함정과, 같은 계산은 한 번만 · robots.txt 길 안내 · 응답 다이어트로 푼 과정을 정리했습니다.
PC 폴더를 아이폰에서 바로 보기 — 와이파이로 띄우는 사진 갤러리, Folderbeam
클라우드 업로드도 앱 설치도 없이, PC 폴더의 사진 · 영상을 같은 와이파이 아이폰 Safari 에서 갤러리처럼 보는 앱 Folderbeam. 빠르고 안전하게 만든 방법을 정리했습니다.
지금 어떤 버튜버 방송에 사람이 모였을까 — 치지직 방송 지도 만들기
치지직 버튜버 방송을 시청자 수와 카테고리로 한 장에 그린 '지금 방송 지도'와, 시간마다 쌓은 사진으로 평소보다 터진 방송을 찾는 기능을 만든 과정을 정리했습니다.
치지직 클립은 모으지 않기로 했다 — 저장 대신 볼 때 가져오기
치지직 버튜버 클립과 다시보기를 DB 에 모으던 방식을 버리고, 누가 볼 때 치지직에서 바로 가져오게 바꾼 이유. 모으기 → 새로고침 버튼 → 저장 안 함까지 두 번 바꾼 과정을 정리했습니다.
다 모을 수는 없다 — 버튜버 대시보드가 무엇을 얼마나 자주 남기는지
치지직 버튜버의 팔로워는 하루 한 번, 방송은 한 시간에 한 장. 버튜버 대시보드가 무엇을 얼마나 자주, 누구 것을 남기기로 했는지와 그 이유를 정리했습니다.
치지직 버튜버 소식을 한곳에 — 버튜버 대시보드를 만들었습니다
치지직·유튜브·X 에 흩어진 버튜버 방송과 팔로워 흐름을 한 화면에 모은 사이드 프로젝트, 버튜버 대시보드를 화면 위주로 소개합니다.
AI 코딩, 결국 모델이 아니라 '컨텍스트'에서 갈렸다
AI 코딩 결과가 들쭉날쭉했던 이유와, ref/·docs/ 로 컨텍스트를 쌓아 Claude Code 같은 코딩 에이전트의 결과물 품질을 끌어올린 방법을 정리했습니다.
"슬랙 채널을 DB에 넣어줘" — 한 줄 요구사항의 진짜 무게
수년 치 슬랙 채널 메시지·스레드·이모지 반응을 Slack API로 DB에 백필한 회고. 어려운 건 코드가 아니라 권한·레이트리밋·데이터 매칭이었습니다.
새 글이 올라오면 RSS로 받아 보세요
RSS로 구독하기