Portfolio
비즈니스 문제를 기술로 해결한 경험들입니다.
작은 토이 프로젝트부터 실무 레벨의 서비스까지 다양한 결과물을 확인해보세요.
언커버 (Uncover)
저작권 문제없는 음원을 찾고 영상과 미리 매칭해보는 스트리밍 플랫폼. Recoil 상태 관리와 Audio/Video 동기화 로직 구현.
AI 협업 포트폴리오 (subeom.dev)
Next.js 14와 FSD 아키텍처, Supabase로 구축하고 AI와 협업하여 완성한 나만의 포트폴리오 플랫폼
항해플러스 아카이빙
LMS 과제 제출 이력 영구 보존 서비스. 결함 허용 PR 매칭 알고리즘 설계 및 4-Layer Fallback 로직 구현.
Claude Code Skills Panel
Claude Code 슬래시 커맨드를 한 번의 클릭으로 실행하는 VS Code 확장. Open VSX 6,942 다운로드 · 평점 5.0, 7일 만에 v0.44.6, 4개 IDE · 4개 언어 배포.
claude-distill
Claude를 매일 새로 출근하는 알바생이라고 생각해보세요 — 어제 가르친 요령을 오늘 또 설명하지 않게, 인수인계 노트를 자동으로 적어두는 Stop hook 기반 npm CLI.
bumpist-code
npx 한 번으로 Vue·React·Next.js 프로젝트에 통일된 컨벤션·디자인 시스템·Claude Code 스킬 14종을 세팅하는 프론트엔드 표준 배포 CLI. FSD 아키텍처 · WCAG AA 기본 준수.
애니스쿨 (Anyschool)
얼굴 공개 부담 없이 개성을 표현할 수 있는 랜덤 동물 캐릭터 생성 서비스. AWS Lambda를 활용한 이미지 처리 파이프라인 구축.
A11yGym: 웹 접근성(KWCAG 2.2) 실습 플랫폼
Monaco Editor와 axe-core를 iframe 내에서 연동하여 실시간 접근성 검증 시스템을 구축한 인터랙티브 학습 플랫폼
Latest Articles
지속적인 학습과 성장을 기록합니다. 최근 작성한 블로그 글들을 확인해보세요.
완성된 요리 말고 레시피만 보내자 — 학생 학습 기록 용량을 줄인 이야기
MathCanvas에서 학생의 조작 기록(런 히스토리)이 한 명당 3~5MB씩 서버로 나가고 있었다. 지금은 문제가 없지만 학급·학교가 겹치면 기가바이트가 될 수 있는 구조. 매번 전체를 복사하던 저장 방식을 '바뀐 것만 기록'으로 바꾸고, 3D 교구의 완성 데이터를 걷어내(레시피만 저장) 3.7MB를 9.3KB로 줄인 과정.
표준을 문서가 아니라 코드로 배포하기 — bumpist-code 개발기
규칙 문서는 아무도 안 읽는다. 그래서 프론트엔드 표준을 'Claude가 작업 전에 자동으로 읽고 실행하는 스킬'로 만들어 npx 한 줄로 배포했다. submodule → copy → npm CLI 로 세 번 갈아탄 배포 방식 고민과, E403·E404·E401 을 오가던 npm 인증 지옥까지.
Claude Code 슬래시 커맨드 30개를 외우다가 결국 도구를 만들었다 — Claude Code Skills Panel 개발기
기억할 커맨드가 30개를 넘어가면서 시작된 페인 포인트. 7일 만에 v0.20에서 v0.44.6까지 45개 릴리즈를 거치며 4개 IDE · 4개 언어로 배포한 1인 사이드 프로젝트의 압축 사이클.