Claude MCPで各業界の社内DXに寄与したい
2024.12.09こんにちは、こんばんわ。 「ゴルフバカエンジニアです。」 どうも、@札幌の hiro です。
「生成系AI(以後、Claude)」と「生成系AIとツールをうまく組み合わせてくれるもの(以後、MCP)」を使って、エクセル（csvデータ）から「売上・在庫管理WEBサイト」を作りました。
スーバーの売上・在庫など閲覧することを想定して、ダッシュボード画面で一覧で見れるようにしています。
はじめに
「Claude」というアメリカの企業「Anthropic」が開発した生成系AIモデルと、「Model Context Protocol(MCP)」というAI アシスタントと様々なデータソースやツールを安全かつ効率的に接続するためのオープンな標準規格を掛け合わせて、簡単なWEBサイトを構築しました。（見た目のみ）
様々な業界の方々にももし参考になればと思いブログを記述しています。
背景
「@qumainu」さんの投稿を見て、DXを小さな一歩は今や簡単に実現できるようになっていて、これを現場が求めているのであればこれが一つの正解なんだと学んだからです。
事前準備
概要
「Claude」と「MCP」の用意が必要です。
「Claude」をデスクトップにインストールが必要です。「MCP」を「Claude」が利用できるようにするために作業が必要です。
Macを利用されている方とWindowsを利用されている方で、詰まるところが異なるそうなので詳細は以下の内容のリンク記事から参照してください。
MCP公式もsqliteを利用してデータベースをPCで立ち上げて、おりますので、その流れに沿って、ローカルPCのcsvをデータベースに移動し、そのデータベース情報をもとにClaudeにWEBサイトを作ってもらっています。
流れ
- 「Claude」と「MCP」の用意
- ローカルPCのcsvをデータベースに移動
Claudeとは？必要準備は？
Claude
Claude（クロード）は、Anthropic社が開発した対話型の生成AIです。人間のように自然な文章を生成し、質問への回答や文章作成、翻訳、コード生成など、さまざまなタスクに対応します。特に日本語での応答品質が高く、最大約15万文字の長文を一度に処理できる能力を持っています。(参照)
必要準備
デスクトップにインストールして、アカウントを作成し、有料版に課金する必要があります。以下の記事を参考に作成。
MCPとは？必要準備は？
MCP
Model Context Protocol（MCP）は、Anthropic社が開発したAIアシスタントと外部データソースやツールを接続するためのオープンな標準プロトコルです。これにより、AIシステムはGoogle Drive、Slack、GitHub、PostgreSQLなどの多様なデータソースと統一された方法で連携でき、個別のAPI開発の手間を省きます。MCPは安全で双方向の接続を提供し、AIが必要なデータに効率的かつ信頼性高くアクセスできるよう設計されています。（参照）
必要準備
Macの方は以下で。
Windowsの方は以下で。
公式は以下です。
詰まった時に以下で解消。
ローカルPCのcsvをデータベースに移動
画像より、「これから添付する全てのエクセル情報からtest.dbのデータベースにテーブルを作成してください。全てのエクセス資料を添付してからテーブルを作成してください。」という文章を入力して、添付資料でローカルPCにあるcsvを添付します。（5ファイルずつしか添付できないので注意してください）
すると、データベース操作するけど良いかい？と言われるので「Allow for This Chat」を押下。
データベース確認
一悶着はありましたが、データベースにしっかり情報が格納されていることを確認できました。
以下のように、Claude側のアウトプット情報が多すぎると途中で会話が切れていること（処理も含めて）があるので、確認しながら進めるのが大事です。
やってみた
前置きが長かったですが、本題部分です...！
ローカルPCのcsvからsqliteデータベースに移動した内容を土台に、「売上・在庫管理WEBサイト」を構築してもらいます。
もうすでに出来栄えがいい感じです。
修正を繰り返す
まだグラフやチャートが出ていない部分や、タブを切り替えても何も表示されていなかったので、Claudeと壁打ちをします。
最後に
こちらが満足のいくレベルまで壁打ちを繰り返すと、以下のようにタブを切り替えたりすると、csvの情報が視覚的に確認できるようになります。
完成系は、細かく見るとまだ以下のような問題があります。
- グラフの数字や円グラフの文字が見切れている
- 従業員情報も欲しいが情報を閲覧できる部分がない
しかし、目的である売上・在庫の確認などはできそうです。
「生成系AI(以後、Clade)」と「生成系AIとツールをうまく組み合わせてくれるもの(以後、MCP)」を使って、エクセル（csvデータ）から「売上・在庫管理WEBサイト」は簡単ですが、作れていそうです。
修正を正しくしてもらうためのコツ
修正お願いしますで治らないのが続く場合は、基本お願いしている側に問題がある
例で、以下のように何も映っていませんと指示しても、何が・どのように映っていなくて、どういう形が理想なのかわからないので、状況は変わりません。
解消
角度を変えて修正方針を伝える必要があります。
アウトプットが情報過多になると、途中できれたり、完璧なものを提示してこない問題がある
csvからデータベースを構築している箇所でもそうでしたが、アウトプットするのに時間を要したり、アウトプット量が多くなりそうな場合には、Claude側で省略されます。
解消
差分を意識して伝えるか、自分で組み立てる必要があります。以下のように差分を把握できていたので、指示します。
まとめ
今回、スーバーの売上・在庫など閲覧することを想定して、ダッシュボード画面で一覧で見れるようにするために、「生成系AI(以後、Clade)」と「生成系AIとツールをうまく組み合わせてくれるもの(以後、MCP)」を使って、エクセル（csvデータ）から「売上・在庫管理WEBサイト」を作ってみました。
まだまだ進化の途中である生成系AI分野。MCPのようにローカル環境とサービスと生成系AIを組み合わせることができるようになってきて、今後RPAの分野まで手が確実に広がってくると思われます。
「Claude MCPで各業界の社内DXに寄与したい」とご立派なタイトルになりましたが、スーパーだけではなく、小さなお店や喫茶店、大好きな飲食店、ショップ色んな方々が助かる手段が増える、使えるようになればいいなと思います。
では、「ゴルフバカエンジニアです。」 @札幌の hiro でした。
![[アップデート]Amazon Bedrockのlatency-optimized inference（パブリックプレビュー）が発表されました #AWSreInvent](https://images.ctfassets.net/ct0aopd36mqt/wp-thumbnail-e3065182082062711612153bbdcf1d96/c04359de689df2f56eb066576ab63fb5/amazon-bedrock)
