Portfolio, 2026 edition

수학을 전공하고, 9년간 강의해왔습니다. 현재는 AI 기술에 집중하고 있습니다.

지식의 최첨단을 탐색하는 탐험가, Jason입니다.

근황

  1. AICE 자격증 관련 회사에서 일하기 시작했습니다. 머신러닝, 딥러닝 자격증 강의에도 출강합니다.

  2. 팀장을 맡은 베어러블 PoC를 마쳤습니다. 과정의 최우수 교육생 2명이 모두 우리 팀에서 나왔습니다.

  3. 앱인토스 미니앱 2개를 정식 출시했습니다.

Chapter I

Publium

PubMed 논문을 모아 두고, 질문하면 모은 논문을 검색해 답하면서 근거 논문의 PMID를 붙이는 서비스

기간
2026.07, 8일 개발
규모
2인 팀
역할
백엔드, 에이전트, 배포
상태
배포 후 운영 중
Publium 검색과 답변 화면. 왼쪽에 PubMed 검색 조건, 가운데에 논문 채팅방 목록, 오른쪽에 선택한 논문을 근거로 한 AI 답변이 있다.
검색과 답변 화면, 현재 운영 버전

문제와 접근

논문 탐색에는 반복 검색과 출처 확인이 필요합니다. 사용자가 수집한 논문을 검색하는 도구를 연결하고, 검색 결과를 근거로 답변하도록 지시했습니다. 답변 끝에는 사용한 PMID를 표시합니다.

github.com/hansol-dev/team-pubmed team-pubmed.vercel.app

직접 구현한 것

FastAPI 백엔드와 데이터 계층
PubMed E-utilities 수집, 논문 목록과 채팅 기록 저장, 삭제 API. Supabase Postgres 연결과 구글 로그인.
툴콜링 에이전트
LangChain create_agent에 수집 논문 검색 툴을 연결. 근거가 필요한 질문에는 검색을 먼저 하도록 프롬프트로 지시하고, 사용한 PMID를 표시.
서버 측 가드
진단, 처방, 복용량 같은 의료 조언 요청은 LLM에 보내기 전에 정규식으로 차단하고 고정 안내문을 반환.
스트리밍과 응답성
토큰 단위 스트리밍 응답. 동기 DB와 PubMed 호출은 스레드로 분리해 이벤트 루프가 멈추지 않게 함.
배포
Render에서 Supabase Postgres 기반 무료 배포. 이후 리뉴얼(pgvector, 그래프 RAG)은 팀원 담당.

기술 선택

답변 구조

선택LangChain 툴콜링 에이전트. 모델이 검색 여부와 검색어를 정함

대안검색 결과를 프롬프트에 붙이는 고정 파이프라인

이유후속 질문이면 대화 기록의 PMID나 키워드로 다시 검색해야 했습니다. 검색어를 코드로 정하지 않아도 되는 대신, 찾지 못하면 없다고 답하도록 프롬프트로 순서를 잡았습니다.

블로킹 I/O

선택asyncio.to_thread로 동기 호출만 스레드로 분리

대안DB 드라이버와 HTTP 클라이언트를 전부 비동기로 교체

이유기존 동기 코드가 이미 동작하고 있었고 기간이 짧았습니다. 문제는 async 핸들러 안의 동기 호출이었으므로 호출 지점만 넘기는 쪽이 변경 범위가 가장 작았습니다.

의료 조언 차단

선택서버 정규식 가드와 고정 응답

대안시스템 프롬프트로만 금지

이유프롬프트 지시는 우회될 수 있고, 차단할 때 반환하는 문구는 항상 같아야 했습니다. LLM 호출 전에 서버에서 끊으면 비용도 들지 않습니다.

트러블슈팅

논문 수집 요청이 길어지면 서버 전체가 응답하지 않았습니다.

  1. 증상PubMed 수집 요청이 진행되는 동안 다른 요청과 상태 확인까지 전부 대기.
  2. 원인async def 핸들러 안에서 동기 PubMed, DB 호출을 그대로 실행해 이벤트 루프 전체가 막힘.
  3. 조치동기 호출을 asyncio.to_thread로 스레드풀에 넘기고, 동시 수집은 세마포어로 2개까지 제한. 수집 중에도 /health가 응답하는지 확인하는 테스트 추가.
  4. 다시 한다면처음부터 async 드라이버를 쓰거나, 동기 라이브러리를 쓰는 핸들러는 def로 선언해 FastAPI가 스레드풀에서 돌리게 함.
Chapter II

버리미 (Beorimi)

사진 한 장에서 여러 대형폐기물을 나누어 보고, 강남구 공식 수수료 기준과 신고 경로까지 연결한 서비스

기간
2026.08, 28시간 MVP
규모
3인 팀
역할
팀장, 백엔드, 워커
스택
Next.js, Supabase, OpenAI
버리미 첫 화면. 이거 어떻게 버려야 할까요라는 문구 아래 사진 찍기 버튼이 있다.
사진 촬영, 업로드
판별 결과 화면. 사진 속 의자와 서랍장 4개 품목에 번호가 붙은 상자가 그려져 있다.
다중 품목 인식 결과와 신고 준비

사진 한 장에서 예상 수수료까지

사진 속 여러 폐기물을 품목별로 분리한 뒤 행정 기준과 연결했습니다. VLM의 추정값을 그대로 노출하지 않고 고정 스키마로 받은 뒤, 강남구 공식 수수료 카탈로그와 다시 매칭했습니다.

  1. 사진 촬영여러 품목이 한 프레임에 있어도 그대로 촬영.
  2. 다중 품목 인식의자, 서랍장 등을 각각 분리 인식하고 규격을 추정.
  3. 사용자 확인잘못 인식된 품목은 사용자가 직접 고칠 수 있게 설계.
  4. 수수료 산출강남구 수수료 기준표와 매칭해 품목별, 합계 금액 안내.
github.com/TrinityBalance/beorimi

기술 선택

인프라

선택

Supabase 하나로 Auth, Storage, Postgres, 큐, 워커까지

대안

AWS Cognito, S3, DynamoDB, SQS, Lambda 조합 (첫날 설계)

이유

28시간 안에 구현과 배포를 마치기 위해, 사용 경험이 있는 Supabase로 전환했습니다. SQS가 맡을 큐는 Postgres 행과 pg_net으로 구현해 인프라 설정 범위를 줄였습니다.

분석 처리

선택

202 반환 후 Postgres 큐와 워커, 브라우저는 폴링

대안

요청 핸들러에서 VLM 응답까지 동기로 대기

이유

동기로 붙였을 때 로딩만 걸리고, 요청이 서버에 닿았는지 VLM이 실패했는지 화면에서 알 수 없었습니다. 작업을 행으로 남기면 어느 단계에서 멈췄는지 상태와 오류 메시지가 남습니다.

VLM 출력

선택

Structured Outputs strict JSON Schema, guardrail 필드 포함

대안

자유 텍스트 응답을 서버에서 파싱

이유

수수료 매칭에 필요한 입력을 strict JSON Schema로 고정했습니다. 모델이 반환한 guardrail 필드에 프롬프트 인젝션 신호가 있으면 결과를 저장하지 않고 실패 처리합니다.

비동기 분석 흐름

  1. 사진 업로드
  2. 작업 등록, 202 반환
  3. 워커의 VLM 분석
  4. 출력 검증, 수수료 매칭
  5. 상태와 결과 조회
Chapter III

베어러블 PoC

스타트업 베어러블과 진행한 PoC로, 대학 정보와 고교학점제 화면을 베어러블의 마이폴리오에 연결했습니다.

기간
2026.08 시작, 완료
규모
5인, 개발 2와 기획 3
역할
팀장, 화면 구현, 배포
출처
강남구 혁신인재육성 아카데미

개발 2인과 기획 3인으로 구성된 팀을 이끌며 화면 구현과 요구사항 조율, 배포를 맡았습니다.

대학 정보

  • 학교 기본 정보
  • 학과별 정보
  • 입시 전형 정보

고교학점제

  • 주간 시간표
  • 개설 과목
  • 진로 과목 추천
화면 구현과 배포
React와 Vite로 두 화면을 구현하고 Vercel에 배포했습니다.
요구사항 조율
기업 담당 개발자와 매주 요구사항을 조율하며 스프린트를 진행했습니다.
팀 운영과 협업 기준
개발 2인, 기획 3인의 역할을 나누고 GitHub 저장소와 브랜치 운영 규칙을 정했습니다.
고2 학생 인터뷰
과외 중인 고2 학생을 인터뷰해 화면과 다음 기능의 방향을 잡았습니다.

기업 연계 프로젝트라 저장소는 비공개입니다.

Chapter IV

앱인토스 미니앱 2종

두 앱을 토스 앱인토스에 정식 출시했습니다. 나의 여름방학 일기는 기획을 주도했고, 별일에서는 팀장을 맡았습니다.

기간
2026.07, 08
상태
앱인토스 정식 출시 2건
역할
기획, 팀장, 화면 구현
스택
React, TypeScript, Supabase Edge Function

나의 여름방학 일기

사진과 짧은 글을 올리면 AI가 문장을 다듬고 크레파스 그림일기로 바꿔 주는 미니앱

2026.07기획 주도, 작성부 구현

일기 쓰기 화면. 제목, 날씨, 일기 내용을 손글씨처럼 입력한다.
작성 화면
변환 결과. 크레파스로 그린 폭포 그림과 원고지 칸에 쓴 일기, 선생님 도장이 있다.
변환 결과
팀 구성과 조율
필요한 팀원을 직접 영입하고 의견을 조율해 방향을 정했습니다.
작성부 구현
일기 입력, 미리보기, 공유 모달과 이미지 처리 유틸을 React와 TypeScript로 구현했습니다.
금칙어와 프롬프트
본문의 금칙어를 감지해 표시하는 로직을 만들고, 분석 프롬프트의 강조어와 금칙어 규칙을 다듬었습니다.
출시와 홍보
앱인토스 심사를 거쳐 출시하고, 완성된 그림일기를 SNS에 공유하기 쉬운 형태로 만들어 홍보했습니다.
github.com/TossHackathonTMD/SummerVacationDiary

별일 (Byeolil)

사소한 하루를 진지하게 관측하고 시상하는 운세 기록 미니앱

2026.08팀장, 3D와 기록 흐름 구현React 19, TypeScript, three.js

별일 관측국 메인 화면. 어두운 우주 배경에 주황색 구슬이 떠 있고, 왁뿌볼 안에 든 운세를 꺼내보세요라고 적혀 있다.
별일 메인 화면
나의 여름방학 일기 첫 화면. 크레파스 바닷가 그림 위에 제목이 있다.
나의 여름방학 일기 첫 화면
역할 분배와 온보딩
입문자 팀원의 숙련도에 맞춰 작업을 나누고 구현 기준을 설명했습니다.
작업 규칙
AGENTS.md와 CLAUDE.md를 공통 규칙으로 관리해 AI 코딩 도구의 작업 기준을 맞췄습니다.
직접 구현
3D 오브젝트 파괴 상호작용, 기록과 보관함 흐름, 숨은 카드와 사운드를 구현했습니다.
출시
앱인토스 심사 대응을 거쳐 개발 시작부터 한 달 안에 정식 출시했습니다.
github.com/TrivialOkay/TrivialOkay_toss

개인 프로젝트

직접 만든 Agent와 도구를 사용하여 AI 자동화를 실생활에 접목하여 사용 중입니다.

cogito

개인 AI 에이전트. 반복 작업을 에이전트에 맡길지 코드로 고정할지 실험하는 기반.

AND

Autonomous Neuro Drive. 활동과 대화를 넣어 장기 지식으로 쌓는 local-first LLM 위키.

galpi

코딩 에이전트가 코드베이스의 의도와 주의점을 찾도록 만든 코드 탐색, 맥락 규약.

나비서

휴대폰과 데스크톱을 연결해 배달 주문을 결제 직전 화면까지 자동으로 진행하는 MCP 기반 자동화 도구. LifeTrace(활동 기록)와 연동.

FAPA

개인 재무 에이전트. Playwright MCP로 카드 사용 내역을 수집해 지출을 정리하고 소비를 관리. 나비서와 연동.

Momento

과외 일정을 강사, 학생, 보호자가 역할별로 나눠 보는 PWA. 기획, 개발, 배포, 운영을 혼자 맡았고, 실사용자 피드백으로 기능을 고치고 있습니다.

연락처

jae1450@naver.com
github.com/jasonwpgml
Portfolio, 2026 edition 제목 마루 부리, 본문 Wanted Sans © 2026 Jason