ZencoderAIのCodingAgentを使って爆速でノーコードでmcp-server-wrikeを作った件

皆さん、こんにちは！今回は、最近自分の中で非常に感動したAIコーディングツール「ZencoderAI」を使って、Wrike用のMCPサーバーを作った体験をシェアしたいと思います。

## はじめに

Cursor、GitHubC opilot、Gemini Code Assistなどコーディング界隈にも生成AIの波がめちゃくちゃ来ていますが、日本ではまだ使っている人が少ないZencoderAIというツールをつかってWrikeのMCPサーバーを作ってみました。ちなみに私がこのツールを知ったきっかけは私が働いている会社であるWrikeの創業者が新たに立ち上げた会社がAI Codingツールを数年前から開発しているのをしって使ってみたという感じです。Zencoderという名前で別の動画エンコードツールがありますが全くの別ツールです。
私の詳細は[LinkedIn](https://www.linkedin.com/in/katoiek/?locale=ja_JP)をみていただくとして、JS、TSによる開発経験ほぼなし（スクリプトはBashとかPowershellちょっとだったり、Javaちょっとだったりどちらかというと運用保守畑出身）、Node.jsは記事みてローカルに立ち上げて試す程度、GithubにPublicで公開も初心者くらい、Postman、WrikeのAPIはそれなりの程度の知識ですがCodeAgentを使ってプロンプトだけで1日くらいで形になりました。

https://github.com/katoiek/mcp-server-wrike

今回のmcp-server-wrikeですが**1行もコードを書いていませんし、ファイルも作っていません**。これが今回お伝えしたいZencoderAIの魅力です。

## ZencoderAIとは？

[ZencoderAI](https://zencoder.ai/)は、AIを活用した次世代のコーディングアシスタントです。特に「CodeAgent」と呼ばれる機能が非常に強力で、プロンプトからコードを生成するだけでなく、実行までサポートしてくれます。

### 主な特徴

#### Repo Grokking
[Repo Grokking](https://zencoder.ai/product/repo-grokking)は、コードベースを瞬時に理解してくれる機能です。

- **高速インデックス化**: リポジトリ全体を数秒で理解
- **詳細な分析**: コードの構造、依存関係、APIなどを自動で把握
- **スマートなナビゲーション**: コードの関連部分を素早く見つけ出せる

#### Agentic Pipeline
[Agentic Pipeline](https://zencoder.ai/product/agentic-pipeline)は、自律的にタスクを進めるAIエージェントシステムです。

- **タスク分解**: 複雑なタスクを小さなステップに分解
- **自動実行**: 各ステップを順番に実行し、結果を次のステップに渡す
- **自己修正**: エラーが発生した場合、自動的に修正を試みる

### 主要機能

[ZencoderAIの機能一覧](https://zencoder.ai/product/features)から抜粋すると：

- **CodeAgent**: プロンプトからコードを生成し、実行まで自動化
- **マルチモデルサポート**: GPT-4、Claude、Gemini、Mistralなど複数のAIモデルを活用
- **コード生成・編集**: 高品質なコードを自動生成、既存コードの改善
- **テスト自動化**: ユニットテスト、統合テストの自動生成
- **ドキュメント生成**: コード解説、README、API仕様書などを自動作成
- **デバッグアシスト**: エラーの原因特定と解決策の提案

## ZencoderAI vs 他のツール

[比較ページ](https://zencoder.ai/compare)によると、ZencoderAIは他のAIコーディングツールと比較して次のような特徴があります：


| 機能 | ZencoderAI | Cursor | GitHub Copilot | Cody | Tabnine | Gemini Code Assist | Claude |
|------|------------|--------|----------------|------|---------|-----------------|--------|
| マルチモデルサポート | ✅ | ❌ | ❌ | ✅ | ❌ | ❌ | ❌ |
| リポジトリ理解 | ✅ | ✅ | ❌ | ✅ | ❌ | ✅ | ✅ |
| 自律エージェント | ✅ | ❌ | ❌ | ❌ | ❌ | ❌ | ✅ |
| コマンド実行 | ✅ | ❌ | ❌ | ❌ | ❌ | ❌ | ✅ |
| マルチステップタスク | ✅ | ❌ | ❌ | ❌ | ❌ | ❌ | ✅ |
| 対応IDE | VSCode, JetBrains, Web | 独自エディタ(VS Codeベース) | VSCode, JetBrains, Web | VSCode, JetBrains | VSCode, JetBrains | VS Code, Android Studio, Cloud Shell | Web, API, Claude Code(CLI) |
| 無料プラン | ✅（制限あり） | ✅（制限あり） | ❌ | ✅（制限あり） | ✅（制限あり） | ✅（制限あり） | ✅（制限あり） |
| 個人月額 | $29/月〜 | $20/月〜 | $10/月〜 | $12/月〜 | $12/月〜 | $19/月〜 | $20/月〜 |
| チーム月額 | $49/人/月〜 | $40/人/月〜 | $19/人/月〜 | $24/人/月〜 | $20/人/月〜 | 要問合せ | $30/人/月〜 |

特に注目すべきは「コマンド実行」と「コードエージェント」機能で、これらによりコードを書くだけでなく、実際に実行して結果を確認するまでの一連の流れをAIが担当してくれます。コードエージェントは無償のプランでも上限がありますが利用できます。

## 実際の開発体験

今回、ZencoderAIのCodeAgentを使ってWrike用のMCPサーバーを開発しました。MCPサーバーとは何かという詳細は省きますが、簡単に言うとWrike（プロジェクト管理ツール）とのインテグレーションを容易にするサーバーコンポーネントです。

### CodeAgentの便利さ

実際の開発過程で特に便利だと感じた点をいくつか紹介します：

1. **プロンプトだけで開発**: CodeAgentモードを使うことで「Wrike APIと連携するMCPサーバーを作りたい」といったプロンプトだけで、基本的な設計から実装までを提案してくれ、必要なファイルも全部作ってくれました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2671/f217919e-edf7-45e9-84c4-46f3db53e7fd.png)


2. **コマンド実行ボタン**: コード生成だけでなく、そのコードを実行するボタンもあるので、生成→実行→確認のサイクルがスムーズです。例えば、依存パッケージのインストールや、サーバー起動などのコマンドも、ボタン一つで実行できます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2671/942875a0-bc05-472f-b8d6-194e40da692b.png)
3. **エラー対応**: 実行時にエラーが発生した場合、その原因を解析して修正案を提案してくれるので、デバッグの手間が大幅に削減されました。エラーLogが開いているファイルの場合はそのまま解析してくれますし、ターミナル出力からコピペしてもOKです。

4. **プロジェクト全体の把握**: 開発が進むにつれて複雑になるコードベースを常に把握し、新しい機能追加時にも適切な場所を提案してくれます。

5. **ドキュメント生成**: READMEやAPIドキュメントなども自動生成してくれるので、開発に集中できました。

### 具体的な開発フロー

1. **プロジェクトの目的をプロンプトで説明**
   今回は"https://developers.wrike.com/ を参考にwrike用のmcp-server-wrikeを作ってください。認証は永続トークンのみとし、Typescriptで作ってください。""とを伝えました
   大体3分ほどで生成されました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2671/90f7ece6-b63f-4a8a-9865-3ad9a5b5dfe3.png)
2. **CodeAgentが基本構造を提案・生成**
   プロンプトをベースに勝手に作られましたのでApply allをクリックすることでファイルが全て生成されます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2671/266a61f8-3152-4daf-a769-764a204182f9.png)

3. **必要なパッケージのインストール（ボタン一つで実行）**
   package.jsonなどは手順2で作られているのでnpm installを実行
   エラーが出たのでそのままターミナルのエラー出力をCode Agentに/fixコマンドで投げる(いくつか便利なプロンプトが入ったコマンドが用意されているみたいですCustom Agentという形で作成可能＆Fixコマンド入れなくてもデバッグしてくれます）
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2671/51b305e7-4166-4281-a446-a0ce6aa291a5.png)
   結果は単純に作成されたディレクトリ上でnpm installを叩いていなかったのが原因でした。

4. **コアとなる機能の実装**
   Wrike APIリファレンスページの詳細を送りつつ必要な機能の実装を依頼

5. **テストとデバッグ**
   ひたすら壁打ち

6. **ドキュメントの生成**
   必要なドキュメントを自動生成

7. **githubへpushする前にリファクタリングの指示**
   最終的な品質向上のためのリファクタリング

8. **githubへpush**
   完成したコードをリポジトリに公開

この全工程で、私が書いたコードは**0行**です。すべてプロンプトとAIの提案、そして実行ボタンのクリックだけで完成しました。

## 成果物

今回の開発で作成したWrike用MCPサーバーは、GitHubで公開しています：
[https://github.com/katoiek/mcp-server-wrike](https://github.com/katoiek/mcp-server-wrike)

JS/TSの開発経験がほとんどない状態から、1日程度でここまで作れたのは、間違いなくZencoderAIのCodeAgentの力です。

## 今後の予定
mcp-server-wrikeへは以下のような機能追加を予定しています：
- より多くのWrike API機能のサポート
- NPMパッケージとしての公開＆インストールの簡素化
- Docker対応によるデプロイ環境の提供
- パフォーマンスの改善。私のPCだけかもですがWindowsDesktop環境でClaud Desktop＆mcp-server-wrikeを起動していると画面がよく固まる・・・（リソースモニターにはあまり変化がない・・・ログにもイマイチわからない）のでなんとかしたい。開発経験者の方ぜひ品質向上にご協力ください！

## まとめ

ZencoderAIのCodeAgentは、プログラミング経験の少ない人でも、アイデアを形にできる強力なツールです（もちろん未経験では難しいですが・・・）。特に「コードを書かない」「コマンド実行ボタンがある」という点は、他のAIコーディングツールと一線を画す特徴だと感じました。

Cursorなどの人気ツールも素晴らしいですが、ZencoderAIの自律エージェント機能は、特にプロトタイピングや小〜中規模のプロジェクト開発において、驚異的な生産性向上をもたらしてくれます。

皆さんもぜひ試してみてください！