김덕환
감동과 사랑을 전하는 '기술 번역가'
사용자의 감정과 니즈를 이해하고, 진정한 가치를 전달하는 개발자입니다.
Contact
Profile
저는 '신뢰할 수 있는 기술 번역가'로서 사용자의 감정과 니즈를 이해하고, 이를 기술로 번역하여 진정한 가치를 전달하는 것을 목표로 합니다. 단순히 기능을 구현하는 것을 넘어, 사용자에게 감동과 사랑을 전하는 서비스를 만들고 싶습니다.
호기심으로 살아갑니다. 예전에는 궁금한 것을 해결하는 데 많은 시간과 노력이 들었지만, 지금은 AI 덕분에 레버리지를 활용하여 '내가 이렇게 많이 알아도 되나?'싶을 정도로 다양한 분야의 지식을 빠르게 습득하고 실험하고 있습니다.
Tech Stack
Languages
Frontend
Backend
Deployment
CI/CD & DevOps
Collaboration
AI Tools
Projects
BE Lead로 GCP 인프라 구축 및 팀 코드 리뷰 문화 정착
Finders - 필름 현상소 연결 플랫폼
"뷰파인더 너머, 취향을 찾다" - 필름 카메라 사용자들이 현상소를 찾고, 예약하고, 사진을 공유할 수 있는 플랫폼입니다. UMC 9기에서 11명의 팀원(BE 5, FE 4, PM 1, 디자인 1)과 함께 진행하며, BE Lead로서 아키텍처 설계와 코드 리뷰 문화를 정착시키고 있습니다.
기술적 도전
AI 활용
- Stable Diffusion Inpainting API 연동 - 필름 빛번짐(Light Leak) 복원 기능
- GCP VPC 네트워크 설계, IAP SSH 터널링으로 보안 DB 접속 환경 구축
- 포트원(PortOne) 결제 시스템 연동 - 예약 → 결제 → 확정 플로우 설계
- Claude Code로 기존 ThreadPool 코드를 Java 21 Virtual Threads로 마이그레이션
GCP 인프라 아키텍처
flowchart TB
subgraph Client["클라이언트"]
A[Next.js App]
end
subgraph GCP["Google Cloud Platform"]
subgraph Compute["Compute Engine"]
B1[Main Instance]
B2[Dev Instance]
end
C[(Cloud SQL - MySQL)]
D[Cloud Storage]
E[Cloud Vision AI]
end
subgraph External["외부 서비스"]
F[Stable Diffusion API]
G[PortOne 결제]
end
A --> B1
A --> B2
B1 --> C
B2 --> C
B1 --> D
B1 --> E
B1 --> F
B1 --> G
- 필름 현상소 검색 및 예약 시스템
- AI 기반 필름 빛번짐 복원 기능
- 포트원 결제 API 연동
- 사용자 갤러리 및 커뮤니티
- BE Lead로서 전체 백엔드 아키텍처 설계 및 코드 리뷰 주도
- GCP 인프라 구축 (Compute Engine, Cloud SQL, Cloud Storage)
- CODE_STYLE.md, CONVENTIONS.md 문서화로 일관된 코드 품질 유지
- v0.4.2 릴리즈 달성 (555 commits)
BE Lead로서 단순히 코드를 작성하는 것을 넘어, 팀의 코드 품질을 관리하고 협업 문화를 만들어가는 경험을 했습니다. 특히 5명의 백엔드 개발자가 일관된 코드 스타일을 유지하도록 문서화와 코드 리뷰를 통해 가이드하며, 기술적 리더십의 중요성을 깨달았습니다.
AI 벡터 매칭으로 1인 풀스택 소개팅 서비스 구축
덕친소 - 김덕환 친구 소개팅 서비스
"김덕환 친구 소개" - 주변 친구들의 소개팅 요청이 늘어나면서, 수동 매칭의 한계를 느끼고 AI 기반 자동 추천 시스템으로 발전시켰습니다. 벡터 DB를 활용한 유사도 기반 매칭과 AI가 "왜 이 사람을 추천했는지" 설명까지 생성하는 서비스입니다.
기술적 도전
AI 활용
- pgvector를 활용한 이상형 데이터 벡터화 및 유사도 기반 매칭
- AI가 "왜 이 사람을 추천했는지" 설명 생성
- Claude Code로 Cloudflare Tunnel 설정, Docker Compose 구성, SSL 자동 갱신 구현
시스템 아키텍처
flowchart TB
subgraph Client["클라이언트"]
A[Next.js App - Vercel]
end
subgraph Server["Mac Mini M2 서버"]
B[Spring Boot API]
C[(PostgreSQL + pgvector)]
D[Docker Compose]
end
subgraph External["외부 서비스"]
E[Cloudflare Tunnel]
F[PortOne 결제]
G[Solapi SMS]
end
A --> E
E --> B
B --> C
D --> B
D --> C
B --> F
B --> G
- AI 기반 이상형 매칭 추천 시스템
- 벡터 유사도 기반 자동 매칭
- 매칭 성사 시 SMS 알림
- 포트원 결제 시스템 연동
- 1인 풀스택으로 기획부터 배포, 운영까지 전 과정 담당
- Mac Mini M2를 Cloudflare Tunnel로 서버화하여 비용 절감
- 벡터 DB 기반 "설명 가능한 매칭"의 가능성 검증
- 실제 서비스 운영 중, 지인 대상 매칭 진행
혼자서 프론트엔드, 백엔드, 인프라, 결제 시스템까지 모든 영역을 담당하며 풀스택 개발의 전체적인 흐름을 경험했습니다. 특히 AI와의 협업으로 복잡한 서버 배포 과정을 빠르게 해결할 수 있었고, "혼자서는 며칠 걸렸을 작업을 몇 시간 만에 완료"하는 AI 활용의 레버리지를 체감했습니다.
40명 인터뷰로 검증, 창업 프로그램 최우수상 수상
MathFigure - 수학 콘텐츠 제작 SaaS
고3 수능 콘텐츠를 제작하는 선생님들이 기존 도구의 복잡성 때문에 어려움을 겪고 있었습니다. 40명의 타겟 유저 심층 인터뷰를 통해 "도구의 복잡성"이라는 핵심 Pain Point를 발견하고, 직관적인 UX로 제작 시간을 1/10로 단축하는 서비스를 개발했습니다.
기술적 도전
AI 활용
- MathJson 스펙 학습 및 수식 파싱 로직 개발에 AI 활용
- JSXGraph API 탐색 및 최적화된 그래프 렌더링 구현
- 40명 인터뷰 결과 분석 및 Pain Point 도출에 AI 활용
수식 처리 파이프라인
flowchart LR
A[LaTeX 입력] --> B[MathJson 파싱]
B --> C[Compute-engine 계산]
C --> D[시각화 타입]
D -->|수식| E[MathLive 렌더링]
D -->|도형| F[Konva 캔버스]
D -->|그래프| G[JSXGraph]
E --> H[PNG/SVG 내보내기]
F --> H
G --> H
- LaTeX 수식 입력 및 실시간 미리보기
- 수학 도형 드래그앤드롭 편집
- 함수 그래프 자동 생성
- PNG/SVG 내보내기
- 중앙대 ICAN-LABs 창업 탐색 프로그램 최우수상 수상
- 40명 이상의 타겟 유저 심층 인터뷰 진행
- 기존 도구 대비 제작 시간 1/10로 단축
- 현재 서비스 배포 및 운영 중
"막연한 추측이 아닌 데이터로 개발합니다." 40명의 인터뷰를 통해 개발자의 직관이 아닌 사용자가 느끼는 '진짜 불편함'을 발견하는 경험을 했습니다. 기술적으로 완벽한 제품보다 시장이 원하는 제품을 만들기 위해 발로 뛰는 것의 중요성을 체득했습니다.
JWT 인증 단일화로 API 응답속도 50% 개선
오메추 - AI 기반 메뉴 추천 서비스
"오늘 메뉴 뭐 먹을까?" 고민을 해결하기 위한 AI 기반 맞춤형 메뉴 추천 서비스입니다. 사용자의 취향, 위치 정보를 고려하여 최적의 메뉴를 추천합니다.
기술적 도전
AI 활용
- Claude에게 "JWT와 세션 방식의 차이점, 각각의 장단점" 학습
- Access/Refresh 토큰 관리 best practice 탐색
- 카카오 소셜 로그인 + JWT 통합 아키텍처 설계
인증 플로우
sequenceDiagram
participant U as User
participant C as Client
participant S as Server
participant DB as Database
U->>C: 로그인 요청
C->>S: POST /auth/login
S->>DB: 사용자 검증
DB-->>S: 사용자 정보
S-->>C: Access Token + Refresh Token
C->>C: 토큰 저장 (메모리/쿠키)
Note over C,S: API 요청 시
C->>S: API 요청 + Access Token
S-->>C: 응답 데이터
Note over C,S: 토큰 만료 시
C->>S: Refresh Token으로 갱신
S-->>C: 새 Access Token
- AI 기반 개인화 메뉴 추천
- 위치 정보 연동
- 사용자 선호도 학습 시스템
- 실시간 메뉴 공유 기능
- UMC 8기 데모데이 장려상 수상
- 현장 투표 1위 달성
- 인증 파트 담당 (로그인, 회원가입, 온보딩)
- 쿠키 세션 방식을 JWT 인증 방식으로 단일화하여 API 응답속도 420ms → 210ms로 50% 개선
- KPT 회고 방법론 도입을 통한 팀 협업 효율성 향상
프론트엔드 담당이었지만, 팀 전체의 성공을 위해 백엔드 영역까지 파고들었습니다. 원인 불명의 인증 오류로 팀 전체 개발이 2주간 중단되었을 때, "내 업무가 아니다"라고 선을 긋지 않고 직접 백엔드 로그를 분석하여 문제를 해결했습니다. 쿠키 세션과 JWT가 혼재된 구조를 발견하고, JWT 기반 통합 인증 방식을 제안하여 팀을 설득했습니다.
3주 만에 MVP 개발, 주간 활성 사용자 100명 달성
Starterm - 스타트업 학생을 위한 단어 학습 플랫폼
한양대학교 창업학 수업에서 예창패, MVP 등의 스타트업에 진입하려는 학생들을 위한 맞춤형 단어 학습 플랫폼입니다. 3명의 팀원과 함께 3주 만에 개발 및 배포하여 주간 활성 사용자 100명을 달성했습니다.
기술적 도전
AI 활용
- Claude에게 "Supabase로 인증 + 실시간 기능을 빠르게 구현하는 방법" 학습
- Framer Motion 공식 문서 기반 최적화된 애니메이션 코드 제안
- 3주 내 MVP 개발을 위한 핵심 기능 우선순위 결정
시스템 아키텍처
flowchart TB
subgraph Client["클라이언트"]
A[Next.js App]
B[Framer Motion UI]
end
subgraph Backend["백엔드 (Supabase)"]
C[(PostgreSQL)]
D[Auth Service]
E[Real-time Subscriptions]
end
subgraph Deploy["배포"]
F[Vercel]
end
A --> D
A --> C
A --> E
B --> A
F --> A
- 스타트업 관련 핵심 단어 학습 시스템
- 학습 진도 및 성취도 추적
- 반복 학습 알고리즘 기반 복습 기능
- 사용자별 맞춤형 학습 경로 제공
- 3주 만에 기획부터 배포까지 완료하는 빠른 개발 사이클 경험
- 주간 활성 사용자 100명 달성
- 3명 팀에서 Full-Stack 개발 (Next.js, Supabase) 담당
- Framer Motion을 활용한 인터랙티브 UI/UX 구현
짧은 기간 내에 실제 사용자에게 가치를 전달하는 MVP 개발의 중요성을 체감했습니다. 3주라는 제한된 시간 안에 핵심 기능에 집중하고, Supabase로 빠르게 백엔드를 구축하며, Framer Motion으로 사용자 경험을 향상시키는 과정에서 린 스타트업 방법론을 실천적으로 학습했습니다. 특히 주간 활성 사용자 100명을 달성하며 사용자 피드백을 기반으로 한 빠른 개선 사이클의 가치를 깨달았습니다.
AI와 페어 프로그래밍으로 Feature-First 아키텍처 구축
log8 - 이 블로그 자체, AI와 함께 운영하는 개인 기술 블로그
"개발자에게 글쓰기가 왜 중요한가?"라는 질문에서 시작된 프로젝트입니다. 학습한 내용을 정리하고, 문제 해결 과정을 기록하며, 이를 다른 개발자들과 공유하기 위해 Obsidian과 연동되는 개인 기술 블로그를 구축했습니다. 지금 보고 계신 이 사이트가 바로 log8입니다.
기술적 도전
AI 활용
- Claude Code로 Feature-First Architecture 리팩토링 설계 및 구현
- AST-grep 활용 TailwindCSS v4 일괄 마이그레이션 (bg-gradient → bg-linear 등)
- Oh My OpenCode 오케스트레이션 에이전트로 복잡한 작업 자동화
- SEO/AEO 최적화 - GPTBot, ClaudeBot 등 AI 크롤러 명시적 허용
블로그 워크플로우
flowchart LR
subgraph Writing["글쓰기"]
A[Obsidian 작성]
B[publish: true 설정]
end
subgraph Build["빌드"]
C[Astro Content Collections]
D[MDX 렌더링]
end
subgraph Deploy["배포"]
E[GitHub Actions]
F[Cloudflare Pages]
end
subgraph Result["결과"]
G[log8.kr]
end
A --> B
B --> C
C --> D
D --> E
E --> F
F --> G
- Obsidian 직접 연동 - vault에서 바로 블로그 발행
- Feature-First Architecture 적용
- 다크 모드, 반응형 디자인
- Mermaid 다이어그램, Expressive Code 지원
- 40개 이상의 기술 포스트 작성 및 운영
- Lighthouse 성능 90+ 달성
- Google AdSense 승인 획득
- AI와의 협업으로 Feature-First Architecture 리팩토링 완료
이 프로젝트에서 가장 특별한 점은 AI를 "도구"가 아닌 "페어 프로그래밍 파트너"로 활용했다는 것입니다. 복잡한 리팩토링, 아키텍처 설계, 마이그레이션 과정에서 AI와 대화하며 더 나은 구조를 찾아갔습니다. "완벽한 코드"보다 "실행과 개선"의 사이클이 중요하다는 것을 체득했고, 혼자서는 생각하지 못했을 아키텍처 개선 아이디어를 AI와의 협업에서 얻을 수 있었습니다.
Experience
UMC 8기/9기 Web Part
2025.03 - 현재9기 웹 파트장 | 9기 Spring Boot 챌린저
IT 연합 동아리 UMC에서 웹 개발을 학습하고, 팀 프로젝트를 진행하며 실무 경험을 쌓고 있습니다. 9기에서는 웹 파트장으로서 파트원들의 학습을 지원하고, Spring Boot 챌린저로 백엔드 개발 역량을 확장하고 있습니다.
- 8기: 팀 프로젝트 '오메추'에서 인증 파트 담당, 데모데이 장려상 수상
- 9기: 웹 파트장으로 파트원 학습 지원 및 코드 리뷰
- 9기: Spring Boot 챌린저로 백엔드 개발 학습 중
반포4동 성당 중고등부 교사
2019.09 - 2024.12중고등부 교사 (5년)
중학생 30명을 대상으로 교리 프로그램을 진행하며 소통과 공감 능력을 키웠습니다.
AI 활용 강연
2025.05, 07, 09연사
시니어 소상공인을 위한 AI 활용법 강연을 총 3회 진행했습니다. (한국시니어교류협회 1회, 리피움 2회)
- ChatGPT Custom Instructions, Gemini Gems, NotebookLM 활용법 소개
- 소상공인을 위한 실전 AI 도구 활용 사례
- MCP(Model Context Protocol) 개념 및 활용법 (리피움)
Awards & Certifications
Awards
Certifications
Education
중앙대학교
2020.03 - 2026.02 (졸업예정)수학과 (Mathematics)
수학적 사고력과 논리적 문제 해결 능력을 바탕으로 개발 분야에 도전하고 있습니다.
마지막 학기 16학점을 이수 중이며, 2026년 2월 졸업 예정입니다.
이 포트폴리오는 웹에서 확인하실 수 있습니다.
최종 업데이트: 2026년 1월 25일