LEVEL 60 QUEST

문서 자동 생성 시스템 - 계약서, 보고서

문서 자동 생성 시스템 - 계약서, 보고서 — DevFoil 바이브코딩 Stage 13, Lv.60

문서 자동 생성이 필요한 이유

반복되는 문서 작업을 자동화하기

비즈니스에서 반복적으로 만드는 문서들이 있습니다: 계약서, 견적서, 청구서, 보고서, 증명서 등.

이런 문서는 형식은 같고 데이터만 달라집니다. 템플릿에 데이터를 자동으로 채워넣으면 문서 작성 시간을 90% 이상 절약할 수 있습니다.

문서 자동화 시스템 구조

[문서 자동 생성 흐름]

데이터 입력 (폼/API/DB)
    │
    ▼
템플릿 엔진 (Handlebars/EJS)
    │  ├── HTML 템플릿에 데이터 삽입
    │  └── 동적 표/목록 생성
    │
    ▼
PDF 변환 (Puppeteer/jsPDF)
    │
    ▼
저장 + 전송
    ├── 파일 저장 (S3/Supabase Storage)
    ├── 이메일 첨부 발송
    └── 전자 서명 요청 (선택)

HTML 템플릿 엔진 활용

Handlebars로 문서 템플릿 만들기

// npm install handlebars

// templates/invoice.hbs - 청구서 템플릿
<!DOCTYPE html>
<html>
<head>
  <style>
    body { font-family: 'Noto Sans KR', sans-serif; padding: 40px; }
    .header { display: flex; justify-content: space-between; }
    .company { font-size: 24px; font-weight: bold; }
    .invoice-no { color: #666; }
    table { width: 100%; border-collapse: collapse; margin: 20px 0; }
    th, td { padding: 12px; border-bottom: 1px solid #eee; }
    th { background: #f5f5f5; text-align: left; }
    .total { font-size: 20px; font-weight: bold; text-align: right; }
  </style>
</head>
<body>
  <div class="header">
    <div class="company">{{companyName}}</div>
    <div class="invoice-no">청구서 #{{invoiceNumber}}</div>
  </div>

  <p>수신: {{clientName}} ({{clientEmail}})</p>
  <p>발행일: {{issueDate}} | 마감일: {{dueDate}}</p>

  <table>
    <thead>
      <tr><th>항목</th><th>수량</th><th>단가</th><th>금액</th></tr>
    </thead>
    <tbody>
      {{#each items}}
      <tr>
        <td>{{this.name}}</td>
        <td>{{this.quantity}}</td>
        <td>{{formatCurrency this.price}}</td>
        <td>{{formatCurrency this.total}}</td>
      </tr>
      {{/each}}
    </tbody>
  </table>

  <div class="total">합계: {{formatCurrency totalAmount}}원</div>
</body>
</html>

템플릿에 데이터 삽입

// lib/document-generator.ts
import Handlebars from 'handlebars';
import fs from 'fs';

// 커스텀 헬퍼 등록
Handlebars.registerHelper('formatCurrency', (value: number) => {
  return value.toLocaleString('ko-KR');
});

export function generateHTML(templateName: string, data: any) {
  const templatePath = `templates/${templateName}.hbs`;
  const templateSource = fs.readFileSync(templatePath, 'utf-8');
  const template = Handlebars.compile(templateSource);
  return template(data);
}

// 사용 예시
const html = generateHTML('invoice', {
  companyName: '마이서비스',
  invoiceNumber: 'INV-2026-001',
  clientName: '김민수',
  clientEmail: 'minsu@example.com',
  issueDate: '2026-04-01',
  dueDate: '2026-04-30',
  items: [
    { name: '웹사이트 개발', quantity: 1, price: 3000000, total: 3000000 },
    { name: '유지보수 (3개월)', quantity: 3, price: 300000, total: 900000 },
  ],
  totalAmount: 3900000,
});

🔒

여기까지는 미리보기입니다

문서 자동 생성 시스템 - 계약서, 보고서
무료 가입하면 이어서 볼 수 있고, 강의를 완료할 때마다 XP와 레벨이 쌓입니다.

Google로 3초 만에 시작 →🧵 Threads로 시작 무료 공개 강의 둘러보기 (Lv.1~3)