이종관
프로젝트 목록으로

StudyHelper — AI 간격 반복 학습 도구

AI 기반 적응형 학습/퀴즈/복습 웹 애플리케이션

·2026.03·1인 풀스택 설계 및 개발
Next.js
React
Prisma
SQLite
Claude API
Tailwind CSS
Zod
Zustand

배경

CS 면접 준비를 위한 체계적 학습 도구가 필요했지만, 기존 플래시카드 도구들은 마크다운 학습 자료의 구조적 분석, AI 기반 개념 추출, 적응형 복습을 통합적으로 제공하지 못했습니다. 복수의 마크다운 파일을 한 번의 LLM 호출로 구조화하면 토픽 누락, 파일 분류 오류, 비논리적 순서 문제가 발생했고, LLM이 생성한 개념 목록에도 품질 문제가 빈번했습니다.

해결 과정

4일 MVP + 클린 아키텍처: "먼저 동작하게 만들고, 그 다음 제대로 만든다"는 전략으로 Day 1에 MVP를 단일 커밋으로 구현한 뒤, 같은 날 바로 app/application/infrastructure/core/workflows 5개 레이어로 리팩토링했습니다. API 라우트를 얇은 HTTP 핸들러로 축소하고, 7개 Prisma 리포지토리와 워크플로우 엔진을 독립 모듈로 분리했습니다.

4단계 프롬프트 체이닝: 하나의 복잡한 판단을 토픽 추출 → 파일 분류 → 챕터 구성 → 검증 4단계로 분리하여 각 단계가 이전 단계의 구조화된 출력을 입력으로 받는 구조로 LLM 응답 신뢰성을 확보했습니다. 멀티파일 챕터에는 2단계 개념 분석 체인을 추가하고, 전체 과정에 폴백 캐스케이드를 구축했습니다.

LLM Gateway 패턴: Claude API/CLI 프로바이더를 런타임 전환 가능하게 추상화하고, generateAndValidate<T>()에서 Zod 스키마 검증 + 자동 재시도를 내장하여 호출부가 타입 안전한 결과만 받도록 했습니다.

개념 품질 자동 보증: 자동 스코어링(총 개수, 보조 비율, Bloom 균일도 등 5개 지표) → 조건부 LLM 수리 패스 → 헤딩 폴백과의 품질 비교 선택이라는 3단계 품질 보증 파이프라인을 구축하여 LLM 출력 품질의 하한선을 보장했습니다.

백그라운드 콘텐츠 프리페칭: DB 기반 잡 큐(LearnJob 테이블)와 인프로세스 백그라운드 워커로 사용자가 첫 개념을 학습하는 동안 나머지 개념의 콘텐츠를 미리 생성하여, 캐시 히트 시 즉시 로딩을 달성했습니다.

어노테이션 시스템: 텍스트 선택 기반 인라인 하이라이트/메모, 색상 코딩, 필터링/정렬, 챕터별 노트북 뷰를 구축하여 학습과 정리를 하나의 인터페이스에 통합했습니다.

성과

  • 4일간 9개 티켓 전량 완료, 10개 DB 모델, 클린 아키텍처 5개 레이어 구성
  • Day 1에 MVP 구현과 클린 아키텍처 전환을 동일 일에 완료
  • 4단계 프롬프트 체이닝 + 개념 품질 자동 스코어링/수리로 LLM 출력 품질 하한선 보장
  • 백그라운드 프리페칭으로 캐시된 개념은 즉시 로딩, 학습 몰입도 유지
  • 하이라이트/메모/필터/노트북 뷰 어노테이션 시스템으로 학습-정리 통합