このリポジトリについて

勤務先の見積業務を効率化するために、個人で開発したアプリケーションです。 社内の情報を外部に持ち出さない方針で運用しているため、公開版は 社内固有の設定・データを含まない構成で用意しています。 そのため、コミット履歴は公開時点(2026年9月)からとなっています。

開発着手	2025年12月
社内環境での稼働開始	2026年1月末(社内LAN上のDocker)

見積作成システム (Quotation Management System)

Spring Boot (Backend) と React (Frontend) で構築された Web 見積作成アプリケーションです。 見積の作成、PDF プレビュー、履歴管理、および Gemini API を使用した OCR 自動読取機能 を備えています。

Excel での見積の個別管理と、過去見積の参照しづらさという業務上の課題を解決するために個人で開発し、実際の業務で運用しているアプリケーションを、ポートフォリオ用に匿名化して公開したものです。そのため、コミット履歴は公開時点から始まっています。開発の経緯は docs/specs/ の仕様書に記録しています。

要求・設計判断・動作確認・最終承認は作者が担当し、設計書・指示書の起案、コード生成、レビューに AI コーディングエージェント(Claude Code / Codex)を活用しています。

機能概要

• ログイン認証: ユーザー情報に基づいたアクセス制御
• 見積作成・編集:
  • 明細行の追加・削除、並び替え
  • 計算ロジック（小計、消費税、粗利率）の自動計算
  • プレビュー画面のリアルタイム表示・ズーム機能
• OCR 自動読取 (AI 機能):
  • PDF や画像の見積書をアップロードし、Google Gemini API を使用して品名・数量・単価を自動抽出
• 見積検索: 顧客名、案件名、営業所などでの絞り込み
• 見積コピー: 過去の見積を複製して新規作成（枝番管理）

技術スタック

Backend

• Language: Java 17+
• Framework: Spring Boot 3.x
• Database Access: MyBatis
• Database: MySQL 8.0 (Dev), H2 (Test)
• Build Tool: Gradle
• AI Integration: Google Gemini API (via HTTP Client)

Frontend

• Language: TypeScript
• Framework: React 18 (Vite)
• Styling: CSS Modules (Custom CSS)

セットアップ手順

前提条件

• JDK 17 以上
• Node.js 18 以上
• MySQL 8.0

1. データベース設定

MySQL にデータベースを作成し、docs/DATABASE.md のテーブル定義を参考にテーブルを作成します（backend/src/test/resources/schema.sql にも同等の CREATE TABLE 文があります）。

CREATE DATABASE quotation_db CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci;

マスタデータ（営業所・営業担当・顧客）や見積データは環境ごとに用意してください。本リポジトリには実データは含まれていません。

2. Backend 起動

DB 接続情報と Gemini API キーは環境変数で渡します（application.properties にハードコードしないでください）。

export DB_USERNAME=root
export DB_PASSWORD=your_password
export GEMINI_API_KEY=your_gemini_api_key

起動コマンド:

cd backend
./gradlew bootRun

サーバーは http://localhost:8080 で起動します。

3. Frontend 起動

cd frontend
npm install
npm run dev

ブラウザで http://localhost:5173 (Vite のデフォルト) にアクセスします。 ※ vite.config.ts で /api へのプロキシ設定が正しく行われていることを確認してください。

OCR 機能について

編集画面の「📎 仕入見積添付」ボタンからファイルをアップロードした後、「🤖 自動読取」ボタンをクリックすると、Gemini API を経由して明細行が自動入力されます。

• 対応ファイル: PDF, 画像 (PNG, JPEG 等)
• GEMINI_API_KEY 環境変数の設定が必要です。

ドキュメント

• docs/REQUIREMENTS.md — 要件定義書（機能一覧・データ要件・既知の制限事項）
• docs/DATABASE.md — データベース設計書（ER図・テーブル定義）
• docs/DEVELOPMENT.md — 開発プロセス（役割分担・仕様書運用ルール・TDDルール）
• docs/specs/ — 個別課題の仕様書
• CLAUDE.md / AGENTS.md — 各AIコーディングエージェント向けの指示（起動時に自動で読み込まれる）

ディレクトリ構成

.
├── docs/                           # ドキュメント（要件定義・DB設計）
├── backend/                        # Spring Boot ソースコード
│   └── src/main/java/com/quotationapp/backend/
│       ├── controller/             # APIエンドポイント
│       ├── dto/                    # データ転送オブジェクト
│       ├── entity/                 # DBエンティティ
│       ├── repository/             # MyBatis Mapperインターフェース
│       └── service/                # ビジネスロジック (OcrService含む)
│   └── src/main/resources/mappers/ # MyBatis XMLマッパー
└── frontend/                       # React ソースコード
    └── src/
        ├── components/             # UIコンポーネント (EditScreen, QuotationList)
        └── types.ts                 # TypeScript型定義

License

MIT