【Cursor × kintoneMCP】AIエージェント丸投げで会話だけでアプリ開発

## 自己紹介

こんにちは👋

最近 [Crossfit](https://crossfit.ap-f.org/) にハマって毎日筋肉痛と戦ってるんですが、周りのライバルに負けて、サッカー現役時代の悔しい思いがフラッシュバックしている [@よしき](https://x.com/YoshikiSasajima/) です😭

「くそー、もっと強くなってやる！」という気持ちを今度は開発に向けてみました。
Cursor & kintone-mcp-server を触ってみたら面白かったので記事にしてみます！

https://www.cursor.com/ja

https://github.com/r3-yamauchi/kintone-mcp-server

## これ、魔法じゃない？

「交通費精算のフィールド追加して」
「はい、わかりました」
「ER図も作って」
「承知いたしました」

...なんじゃこりゃ！！😱

kintone MCP サーバーを使ったら、**普通に会話するだけ**でkintoneアプリ開発ができるようになりました。Web画面をポチポチする時代は終わったのかもしれません。

というわけで、今回は**AIとタッグを組んでkintone開発してみた**リアルな体験談をお届けします！🥊

https://kintone.cybozu.co.jp/what_is_kintone/

## 🎯 今回やったこと

- 交通費精算アプリをAIに触らせてみた
- 「レイアウト変えて」って言ったら本当に変わった
- 5つのアプリの関係性をER図にしてもらった
- 途中でAIと喧嘩した（色の話で）

## 🛠️ 設定方法
### ①kintone-mcp-serverの事前準備

https://github.com/r3-yamauchi/kintone-mcp-server



### ②CursorでMCP設定

https://docs.cursor.com/context/model-context-protocol

#### 1. Cursor設定画面を開く
1. Cursorを起動
2. **Cmd+Shift+P**でコマンドパレットを開く
3. **「Open MCP Settings」** と入力して選択
4. **「New MCP Server」** をクリック


または：
1. **Cmd+Shift+J**でCursor Settingsを開く
2. 左側のメニューから「**MCP Tools**」を選択


#### 2. 設定ファイルを編集
開いたJSONファイルに以下を追加します：

```json
{
  "mcpServers": {
    "kintone": {
      "command": "node",
      "env": {
        "KINTONE_DOMAIN": "[あなたが使用するサブドメイン].cybozu.com",
        "KINTONE_USERNAME": "MCP接続で使用するkintoneユーザー名",
        "KINTONE_PASSWORD": "kintoneユーザーのパスワード（平文）"
      },
      "args": [
        "[kintone-mcp-serverを配置したパス]/server.js"
      ]
    }
  }
}
```

#### 3. Cursorを再起動
設定を保存したら、Cursorを再起動してください。



## 第1章：「交通費精算アプリ、見つけて」→ 3秒で発見

**私**：「交通費精算関係のアプリある？」

**AI**：「はい、見つけました！」

え、もう見つかった？😲

```
アプリ名：交通費精算申請
フィールド：申請者、利用年月、交通費一覧、備考
```

こんな感じで一瞬で教えてくれました。しかも、「サンプルレコード作りますか？」とか提案してくる。

**私**：「じゃあ東京出張の例で作って」

**AI**：「承知いたしました」

そして本当にサンプルデータが出来上がる...

| 日付 | 出発地 | 到着地 | 交通手段 | 金額 |
|------|--------|--------|----------|------|
| 2024-01-15 | 新宿駅 | 東京駅 | JR | 200円 |
| 2024-01-15 | 東京駅 | 品川駅 | JR | 160円 |

**合計：1,120円**（往復含む）

これ、普通だったらkintoneへログインしてポータル画面からアプリを検索して、レコード一覧画面を開いて、レコード追加画面で入力して...

という作業が**会話だけで完了**しました。


## 第2章：「レイアウト変えて」

**私**：「備考フィールドを利用年月と申請者の間に移動して」

**AI**：「レイアウトを更新してデプロイします」

え、デプロイまでやってくれるの？！😳

しかも進捗報告までしてくる：
- リビジョン42で更新
- デプロイ実行中...
- デプロイ完了✅

変更内容も教えてくれる！
![スクリーンショット 2025-06-10 22.27.14.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1256101/ad71aa95-0fe9-4295-89a7-098b01867226.png)


**数秒後、kintoneにアクセス**

本当にレイアウトが変わってる！！
|Before|After|
|---|---|
|![](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1256101/d799ff64-7c1f-4ef9-b6b8-6342f9b0f159.png)|![](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1256101/c0b3f1b3-26e8-43b8-ae71-00d46e9d4000.png)|

これまでだったら：
1. アプリ設定画面を開く
3. フィールドをドラッグ&ドロップ
4. 保存
5. アプリを更新

このステップが **「レイアウト変えて」の一言**で完了。これはヤバい。


## 第3章：「案件管理のER図作って」→ AIとデザイン論争勃発

**私**：「案件管理関連のアプリでER図作れる？」

**AI**：「関連アプリを調査いたします」

そして出てきた結果：
![スクリーンショット 2025-06-10 22.44.46.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1256101/663e0bc4-78d3-4ef6-a6b2-ccd2cbc82775.png)


「おお、確かにこの5つが連携してるな」

AIは数分でアプリ間の関係性を分析して、きれいなER図を作成。

でも、ここから事件が...

**私**：「もっと見やすくして」
**AI**：「カラーテーマを適用します」
**私**：「文字色が背景と同化して見にくい」
**AI**：「申し訳ございません、調整いたします」
**私**：「文字が読みにくいから濃い色にして」
**AI**：「高コントラスト版を作成いたします」

こんな感じで、AIと**デザインについて真剣に議論**することになりました😅



## 🤔 これって何がすごいの？

### 1. **学習コストゼロ**
kintone APIの仕様を覚える必要なし。普通に話すだけ。

### 2. **爆速開発**
「○○して」と言えば、調査→実装→デプロイまで全自動。

### 3. **ミスが少ない**
人間だったら「あ、デプロイ忘れた」とかやりがち。AIは手順を守る。

### 4. **ドキュメント不要**
「どのフィールドがあるか教えて」と聞けば即答。

## 😱 作業時間

今回の作業、従来なら：
- サンプルデータ作成：7分
- レイアウト変更：3分
- ER図作成：1時間

**合計1時間10分**

AIとの会話では：
- 全部で**約10分**

**時間短縮率：約86%** 🚀


## 🚨 注意点

### AIも完璧じゃない
- 図の色のセンスは微妙（主観ですが😅）
- たまに「それできません」と言われる

### とはいえ、メリットの方がある
- 上手くいかなくても「別のアプローチでお願い」で即解決
- 24時間対応
- 疲れない、文句言わない（重要）


## まとめ

これからは単純作業に時間を取られず、「どんなアプリにしたいか」の設計に集中できるんだなぁと実感しました。
興味が湧いたら、ぜひ触ってみてください！！