JSOL Replit
  • ホーム
  • 特徴
  • できること
  • 料金・プラン
  • マニュアル
  • 事例・トピックス
  • お問い合わせ

ホーム > Replit > 複雑なシステムを開発する際の工夫 —仕様書「README」の活用

マニュアルReplit

2026年07月30日

複雑なシステムを開発する際の工夫
—仕様書「README」の活用

Replit は、簡単なアプリであればチャットだけでも開発を進められます。
しかし、画面数や機能が増えてくると、チャットでのやり取りだけでは細かな仕様を伝えきれず、意図しない実装になってしまうことがあります。こちらの要望を正しく理解してもらうために、何度もチャットで修正依頼を繰り返すケースもあります。
そこでおすすめなのが、アプリの仕様や画面構成、データ構造などを README.md にドキュメントとして整理したうえで、エージェントに参照させながら実装を進める方法です。
README.md に情報を整理しておくことで、エージェントがプロジェクト全体を理解しやすくなり、実装内容のブレを減らせます。

  • 著者情報

    JSOL Replit担当

ドキュメント(README.md)を作成する

まずは、今回作成するアプリケーションの仕様を README.md に整理していきます。
たとえば、以下のような内容を README.md に記載します。
● サービス概要
● 課題の背景と解決アプローチ
● 機能一覧
● 画面一覧
● 画面遷移図
● ユーザー権限
● データ構造
● APIエンドポイント設計
以下では各項目の一例を紹介します。

サービス概要

まずは、どのようなアプリケーションを作成するのかを整理します。
サービス名、ターゲット、解決したい課題などを記載します。


| 項目 | 内容 |
| ----- | ----- |
| サービス名 | 製造日報アプリ GENBA NOTE |
| ターゲット | 製造ラインの作業員(入力者)・現場リーダー・管理職(承認者) |
| 解決課題 | 紙日報→Excelへの転記による二重手間・集計遅延・承認フローの不透明さ |
| デモの見せ所 | 作業員が入力した瞬間に工数が自動集計され、上長承認もワンクリックで完結 |[


課題の背景と解決アプローチ

このアプリケーションを作成する背景や、どのような方法で課題を解決するのかを記載します。


#### 現状の課題
* 1日の終わりに紙の日報に記入し、翌朝リーダーが確認・押印するフローが主流
* Excelへの転記は月次集計のためだけに行われ、1回あたり1〜2時間を消費
* 差戻しが発生すると紙の修正・再提出が必要で、履歴管理が困難
* 目標工数との対比や作業効率のトレンドを可視化する手段がない
#### 解決アプローチ
* ブラウザベースのフォームで日報を入力し、リアルタイムで工数を自動計算・集計
* 承認フローをデジタル化し、「承認待ち」状態をリスト管理
* 週次・月次レポートをワンクリックで生成し、Excelエクスポートも可能に



機能一覧

アプリケーションに必要な機能を一覧形式で整理します。
※ 実際の README.md では、このほかにも一覧検索・CSV出力・集計レポートなどの機能を定義しています。


| 機能ID | 機能名 | 優先度 | 概要 | 補足 |
| ----- | ----- | ----- | ----- | ----- |
| F01 | 日報入力(マルチ行) | 必須 | 工程・作業種別・工数・生産数量を複数行(最大10行)で入力 | 行の追加・削除が可能 |
| F02 | 工数リアルタイム集計 | 必須 | 入力値から合計工数・工程別工数を即時計算・表示 | 8時間超過時に警告表示 |
| F03 | 下書き保存 | 必須 | 途中まで入力した状態でブラウザを閉じても復元できる | ローカルストレージに一時保存 |
| F04 | 承認依頼送信 | 必須 | 日報確定後にリーダーへ承認依頼を送信しステータスを「承認待ち」に変更 | 送信前に入力内容の確認ダイアログを表示 |
| F05 | 承認ワークフロー | 必須 | リーダーが承認待ち一覧を確認し、承認または差戻し(理由付き)を実施 | 差戻し時は理由テキストが入力者に表示される |



画面一覧

画面イメージや画面構成を記載します。
ここでは、画面例として1画面を抜粋して紹介します。


┌──────────────────────────────────────────────────────┐
│ 📋 日報入力 │
│ 2024年3月1日(金) 担当: 山田 太郎 │
│ ────────────────────────────────────────────────── │
│ │
│ 作業記録 │
│ ┌──────────┬──────────┬────────┬────────┬──────────┐ │
│ │ 工程 │ 作業種別 │ 工数(h)│ 生産数 │ 操作 │ │
│ ├──────────┼──────────┼────────┼────────┼──────────┤ │
│ │[▼組立L3 ]│[▼組立作業]│[ 2.0 ]│[ 150 ]│[削除 ✕] │ │
│ │[▼出荷検査]│[▼外観検査]│[ 1.5 ]│[ 80 ]│[削除 ✕] │ │
│ │[▼ ]│[▼ ]│[ ]│[ ]│[削除 ✕] │ │
│ └──────────┴──────────┴────────┴────────┴──────────┘ │
│ [+ 行を追加] │
│ │
│ ───────────────────────────────────────────────── │
│ 合計工数: 3.5h / 目標: 8.0h ⚠ 残 4.5h │
│ ───────────────────────────────────────────────── │
│ │
│ 特記事項・申し送り │
│ ┌────────────────────────────────────────────────┐ │
│ │ 部品Aの在庫が残り20個。明日の午前中に補充依頼を │ │
│ │ お願いします。 │ │
│ └────────────────────────────────────────────────┘ │
│ │
│ [一時保存] [承認依頼を送信] │
└──────────────────────────────────────────────────────┘



入力項目仕様(作業記録行)

フォームの入力項目やバリデーションを記載します。


| フィールド名 | 入力型 | 必須 | バリデーション | 備考 |
| ----- | ----- | ----- | ----- | ----- |
| 工程 | select | ○(行に1つ以上) | 未選択は保存不可 | マスタから動的生成 |
| 作業種別 | select | ○ | 工程に紐づく作業種別のみ表示 | 工程選択後に動的フィルタ |
| 工数(h) | number | ○ | 0.5刻み、0.5〜16の範囲 | 入力と同時に合計工数を再計算 |
| 生産数量 | number | \- | 0以上の整数 | 任意入力 |



作業マスタ(デモ初期値)

フォーム内で使用する選択肢データを記載します。


| 工程 | 作業種別 |
| ----- | ----- |
| 組立ライン1/2/3 | 組立作業 / 部品仮組み / 締め付け作業 |
| 溶接工程 | 溶接作業 / 溶接後処理 |
| 塗装工程 | 下地処理 / 塗装作業 / 乾燥・検査 |
| 出荷検査 | 外観検査 / 寸法測定 / 梱包作業 |



画面遷移図

画面の遷移やユーザー操作の流れを整理します。


[ログイン]
│
├── [作業員ロール]
│ │
│ ├→ [日報入力フォーム(新規)]
│ │ │
│ │ ├→ [一時保存] → 入力継続
│ │ └→ [承認依頼送信] → [送信完了ページ]
│ │
│ └→ [自分の日報一覧]
│ │
│ ├→ [詳細表示]
│ └→ [差戻し分の修正・再提出]
│
└── [管理者/リーダーロール]
│
├→ [承認待ち一覧]
│ └→ [日報詳細確認] → [承認 or 差戻し]
│
├→ [日報一覧(全員分)]
│
├→ [集計レポート]
│
└→ [マスタ管理(工程・作業種別)]



ユーザー権限

ロールごとの閲覧範囲や操作権限を記載します。


| ロール | 閲覧範囲 | 操作権限 |
| ----- | ----- | ----- |
| 作業員 | 自分の日報のみ | 新規入力・一時保存・承認依頼送信・差戻し分修正 |
| リーダー | 担当チームの日報 | 承認・差戻し(理由付き)・集計レポート閲覧 |
| 管理者 | 全員の日報 | リーダー権限に加え、マスタ管理・CSVエクスポート・目標設定 |



データ構造

データ構造(データモデル定義)も重要です。
データ構造を定義しておくことで、エージェントがフィールド名や型を理解しやすくなり、実装時の認識のズレを減らせます。


{
"report_id": "string (UUID)",
"date": "date (YYYY-MM-DD)",
"worker_id": "string",
"status": "draft | pending | approved | rejected",
"total_hours": "number"
}



APIエンドポイント設計

API仕様も README.md に整理しておきます。


| メソッド | パス | 説明 |
| ----- | ----- | ----- |
| GET | /api/daily-reports | 日報一覧(クエリ: worker\_id, status, from, to) |
| POST | /api/daily-reports | 日報新規作成 |
| GET | /api/daily-reports/:id | 日報詳細取得 |
| PUT | /api/daily-reports/:id | 日報更新(差戻し後修正) |



プロジェクトフォルダに README.md を格納する

README.md を作成したら、アプリケーションのプロジェクトフォルダへ配置します。

/daily-production-report-app3/
└── README.md

エージェントに指示を出す

README.md を配置したら、エージェントへ実装を依頼します。
まずは plan モードで、「artifacts/daily-production-report-app-3/README.md を確認し、その内容に沿って製造日報アプリを作成してください」と依頼します。

エージェントが作業計画を作成してくれるので、「View」ボタンから内容を確認します。
問題がなければ「Build here」ボタンをクリックして実装を開始します。

アプリを確認する

アプリが作成されたら、実際に操作して意図通りになっているか確認しましょう。

もし修正したい箇所がある場合は、いきなりコード修正を依頼するのではなく、先に README.md を更新してから、エージェントへ修正依頼を出すことをおすすめします。
また、プロジェクトが大きくなってきた場合は、README.md に全てを書くのではなく、docs/ フォルダに画面仕様や API 定義を分割して管理する方法もあります。


docs/
├── screens/
├── api/
├── data/
└── flows/



エージェントに指示を出す際も、
● docs/screens/report-form.md
● docs/api/daily-report.md
のように参照先を明示すると、より意図が伝わりやすくなります。


思いついたアイデアをそのままプロダクトへ

Replitに関するご相談はこちら

Replitの導入についてご不明な点は お気軽にお問い合わせください

お問い合わせ
JSOL
  • サイトポリシー
  • 個人情報保護方針
  • 会社概要

Copyright © JSOL Corporation