← 포트폴리오 목록

친환경 교구 견적·발급 플랫폼

친환경 업사이클 교육 프로그램에 참여하는 교사를 위해 회원가입부터 고유번호증 인증, 관리자 승인, 견적 계산, 직인 합성 PDF 자동 발행, 마이페이지 재발행 이력 관리까지 이어지는 핵심 플로우를 React + Node.js 기반으로 설계·구현합니다.

직인 합성 PDF 발행 파이프라인 구현PDFKit 템플릿 렌더링에 직인 좌표 합성, PostgreSQL 시퀀스로 문서번호를 중복 없이 채번하는 구조를 설계합니다.
버전 보존형 재발행 이력 테이블 설계덮어쓰기 없이 버전 컬럼으로 전 이력을 보존하는 스키마를 구현, master-detail UI로 즉시 조회 가능하게 합니다.
규칙 기반 견적 계산 엔진 구축수량×인원구간×강사비 3차원 매트릭스 계산 로직을 서비스 레이어로 분리 설계합니다.
서비스 타입Web
업종교육 플랫폼
기술 스택
React 18TypeScriptTailwind CSSNode.jsExpressPrismaPostgreSQLPDFKitAWS S3
주요 기능
  • 발급 이력 통합 관리
  • 견적 계산 엔진
  • 관리자 승인 워크플로우
  • 직인 합성 PDF 자동 발행
Overview

프로젝트 개요

범위: 개발, 디자인, 기획
친환경 업사이클 교육 프로그램에 참여하는 교사를 위해 회원가입부터 고유번호증 인증, 관리자 승인, 견적 계산, 직인 합성 PDF 자동 발행, 마이페이지 재발행 이력 관리까지 이어지는 핵심 플로우를 React + Node.js 기반으로 설계·구현합니다. notion 스타일 문서 트리와 master-detail 컴포지션으로 발급 이력을 구조화된 문서처럼 관리하는 화면을 구현합니다.
친환경 교구 견적·발급 플랫폼
요구사항 정의

프로젝트 핵심 과제

프로젝트 진행 시 해결한 핵심 기술 과제입니다.

고유번호증 이미지와 개인정보를 안전하게 보관하기 위한 S3 비공개 저장 및 서명 URL 만료 정책 설계

동시 발행 요청 시 문서번호 중복을 막는 원자적 채번 전략 설계

견적 재발행 시 과거 버전 단가 스냅샷을 보존하면서 최신 단가 기준과 분리 조회하는 구조 설계

다중 선택 일괄 승인 처리 중 일부 항목만 실패하는 상황을 방지하는 트랜잭션 격리 수준 설계

핵심 기능 1

발급 이력 통합 관리

교사가 마이페이지에서 자신의 전체 발급 이력을 좌측 리스트에서 확인하고, 선택한 견적서의 버전별 상세·재발행 상태·다운로드를 우측 패널에서 바로 확인합니다
발급 이력 통합 관리
핵심 기능 2

견적 계산 엔진

교구 수량과 참여 인원 구간별 강사비를 조합한 복합 규칙으로 실시간 견적 금액을 계산합니다
견적 계산 엔진
핵심 기능 3

관리자 승인 워크플로우

관리자가 고유번호증 첨부 회원가입 신청을 검토해 승인 또는 반려 처리하고, 사유를 남깁니다. 상태 머신 기반 승인 큐를 구현하고, 반려 시 사유 입력을 강제하는 폼 검증을 적용합니다
관리자 승인 워크플로우
핵심 기능 4

직인 합성 PDF 자동 발행

승인된 견적을 서버사이드에서 PDF로 생성하고 직인 이미지를 합성해 문서번호·발행일시를 자동 부여합니다
직인 합성 PDF 자동 발행
구현 과정

프로젝트 진행 단계

STEP 1

요구사항 분석 및 승인 상태머신 설계

교사 승인 워크플로우 상태 전이 정의, PostgreSQL 테이블 18개 설계 및 관계 매핑

STEP 2

견적 계산 엔진 및 PDF 발행 API 개발

Express 기반 견적 계산·PDF 생성 API 28개 구현, 문서번호 채번 로직 적용

STEP 3

교사 마이페이지 UI 개발

React 기반 master-detail 발급 이력 화면 구현, 재발행 요청 폼 개발

STEP 4

관리자 승인 콘솔 및 통합 테스트

승인 큐 UI 구현, 일괄 승인 트랜잭션 검증, API 통합 테스트 진행

프로젝트 성과
직인 합성 PDF 발행 파이프라인 구현PDFKit 템플릿 렌더링에 직인 좌표 합성, PostgreSQL 시퀀스로 문서번호를 중복 없이 채번하는 구조를 설계합니다.
버전 보존형 재발행 이력 테이블 설계덮어쓰기 없이 버전 컬럼으로 전 이력을 보존하는 스키마를 구현, master-detail UI로 즉시 조회 가능하게 합니다.
규칙 기반 견적 계산 엔진 구축수량×인원구간×강사비 3차원 매트릭스 계산 로직을 서비스 레이어로 분리 설계합니다.
다중 선택 일괄 승인 트랜잭션 설계Prisma 트랜잭션으로 다중 승인 요청을 원자적으로 처리해 부분 실패를 방지하는 구조를 구현합니다.
Review

기술적 주안점

  • master-detail 패턴으로 리스트 선택과 상세 조회를 하나의 화면에서 처리하는 인라인 상세 뷰를 구현합니다
  • 관리자가 조정한 단가 기준을 실시간 반영하는 규칙 기반 견적 계산 엔진을 구현합니다
  • 승인 대기 큐에서 다중 선택 일괄 승인·반려를 트랜잭션 단위로 처리하는 워크플로우를 구현합니다

유사한 프로젝트를 기획하고 계신가요?

FIRSTPIP이 개발 범위와 로드맵을 함께 정리해드립니다

무료 상담 시작하기