0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

Cline の設定とハンズオン、気になる料金まで解説

Last updated at Posted at 2025-05-04

Cline とは

最近エンジニアの間で注目を集めている「Cline(クライン)」を試してみました。

Cline は VSCode や Cursor などの IDE で動作する拡張機能です。自然言語でAIエージェントに指示を出し、コードの生成や修正、プロジェクトの構造解析、ターミナルコマンドの実行など、多岐にわたるタスクを実行します。

しかし、これだけ聞くと既存の VSCode 拡張や Github Copilot と何が違うのかよくわからないと思います。この記事ではそんな Cline の凄さが伝わるように解説していきたいと思います。

何ができるの?

Cline を利用すると、以下のような操作が可能になります

  • コードの生成・修正
    自然言語で指示を与えることで、コードの自動生成や既存コードの修正を行えます。例えば、「この関数にエラーハンドリングを追加して」といった指示が可能です。

  • プロジェクトの構造解析
    プロジェクト内のファイルやディレクトリ構造を解析し、必要なファイルの作成や配置をサポートします。新しいプロジェクトのセットアップ時に役立ちます。

  • ターミナルコマンドの実行
    VSCode 内で直接ターミナルコマンドを実行し、その結果を基に次のアクションを提案・実行します。例えば、npm install を実行して依存関係をインストールし、その後のセットアップ手順を自動化できます。

  • ブラウザ操作の自動化
    ウェブページの操作(クリック、入力、スクロールなど)を自動化し、スクリーンショットやコンソールログの取得、インタラクティブなデバッグやE2Eテストを行えます。

何が凄いの?

Cline が凄いのは、強い権限を使って勝手にタスクを完了させるところです。
例えば Github Copilot の場合、あくまで人間がコードを書き、AI にその補助をしてもらうという感じでした。しかし Cline の場合は AI がコードを書き、人間がその補助をする、という感じです。

イメージがつくよう、ここで1つ Cline にタスクを依頼してみましょう。以下のプロンプトで依頼しました。

TypeScript + Expressで簡単なREST APIを作ってください。

目的:
ユーザー情報のCRUD操作ができるAPIを作りたいです。

要件:
- エンドポイント: `/users`
- 操作:
  - GET `/users`:すべてのユーザー一覧を取得
  - GET `/users/:id`:特定ユーザーをIDで取得
  - POST `/users`:ユーザー作成(名前・メール)
  - PUT `/users/:id`:ユーザー更新
  - DELETE `/users/:id`:ユーザー削除
- ユーザー情報は `id`, `name`, `email` を含み、MySQL上に保存
- TypeScriptで型定義をしっかり書く
- 最低限のバリデーションも入れてほしい(例: emailが空なら400)
- テストも書いてほしい

環境:
- MySQL は docker compose でたててほしい。
- node はホストOS上で動かしたい。

すると以下のような操作をゴリゴリと始めました。

  • 必要なパッケージを npm install
  • docker-compose.yaml ファイルを作って MySQL サーバをたてる
    • しかしすでに3306ポートを使っている docker コンテナがたっていたのでエラーが出る。別の docker コンテナを勝手に停止し再起動。
  • TypeScript で REST API を作成
    • 一部IDEでエラーが出た行があるので自分で修正
    • 何回かこのサイクルを繰り返すが、エラーを修正できずに無限ループしていたので一旦止めて、手動で直す。
  • jest をインストールしてテストを記述
  • npx jest を実行しエラーが出た箇所を修正
    • 何回かこのサイクルを繰り返すが、エラーを修正できずに変なことをしはじめるので一旦止めて、手動で直す。

何度か途中で手助けしましたが、上記のタスクをほぼ自力でやってくれました。自分で1から書いたら30分はかかったと思いますが、5分くらいで出来ました。Github Copilot だったらこのスピード感はないです。驚異的に感じました。

インストール

では、実際にインストールして使うまでをやってみましょう。

1. VSCode の拡張機能検索で「Cline」を検索してインストール

VSCode の左側にある拡張機能アイコンをクリックし、検索バーに「Cline」と入力します。検索結果に表示された Cline 拡張機能を選択し、「インストール」ボタンをクリックします。
スクリーンショット 2025-04-07 21.44.16.png

2. Cline の設定を開く

インストールすると左のサイドバーに Cline のアイコンが出現するのでそれをクリックします。無料で試す場合は「Get Started for Free」を押してください。ここではすでに持っている API key がある前提で「Use your own API key」を押します。
スクリーンショット 2025-04-07 21.49.16.png

3. API キーの設定

インストール後、Cline を利用するためには、対応する AI モデルの API キーを設定する必要があります。Cline は以下の主要な API プロバイダーをサポートしています:

  • OpenRouter
  • Anthropic
  • AWS Bedrock
  • OpenAI Compatible
  • GCP Vertex AI
  • Google Gemini
  • DeepSeek
  • Mistral
  • OpenAI
  • VSCode LM API

使用したいプロバイダーの API キーを取得し、Cline の設定画面で入力します。自分は ChatGPT を使っているので OpenAI を選択し、OpenAI で取得した API キーを入力します。

4. Cline の設定をする

これで Cline が使えるようになりましたが、Cline の真価を発揮するにはある程度の権限を与えてあげるほうがいいです。
※ ただし、リスクも伴うので各種設定をご確認の上ご自身の判断でお願いします。

スクリーンショット 2025-04-21 21.52.48.png

設定 意味
Auto-approve: None Cline がユーザーの許可なしに操作することを防ぐための設定。安全性を重視する場合は None(無効)のままがおすすめです。自分は気にせずONにしています。
Read project files プロジェクト内のファイルやディレクトリを読み取ることを許可します。これはONにしても良いと思います。
Read all files 上記をONにした場合に出現する設定で、プロジェクト外のファイルやディレクトリを読み取ることを許可します。自分はOFFにしています。
Edit project files プロジェクト内の任意のファイルを編集(上書き)できるようにします。誤って重要なファイルを書き換えるリスクがあるため、慎重に設定してください。自分は毎回確認されるのが面倒なのでONにしています。
Edit all files 上記をONにした場合に出現する設定で、プロジェクト外のファイルを編集できるようにします。これは自分はOFFにしています。
Execute safe commands 安全と判断されたターミナルコマンドを実行できます。リスクのあるコマンド(例:rm)は別途承認が必要です。私はONにしました。
Execute all commands 上記をONにすると出現する項目で、リスクのあるコマンドも許可する設定です。自分は毎回確認されるのが面倒だったのでONにしています。
Use the browser ヘッドレスブラウザを使ってウェブページにアクセスしたり操作することを許可します。スクレイピングや自動操作などに使います。私はONにしました。
Use MCP servers 外部に設定された MCP サーバーを利用して、ファイルシステムを操作したり API 通信を行うことを許可します。未使用の場合はオフでOKです。
Max Requests ユーザーに確認せずに自動で実行できる API リクエストの最大数です。安全重視なら「10」程度、普通に使うなら「20」くらいあると良いです。「10」だとちょくちょく制限にひっかかるので、自分は「20」にしています。逆に20以上API実行しているときは何かおかしくて無限ループに陥っているパターンがあります。
Enable Notifications タスク完了時や承認が必要なタイミングでシステム通知を受け取る機能。ONにしておくと進行状況がわかりやすくなります。

実際に使ってみる

インストールと設定が完了したら、早速 Cline を使ってみましょう。

  1. Cline の起動
    VSCode の左側に追加された Cline のアイコンをクリックするか、Cmd⌘ + Shift + P を押してコマンドパレットを開き、「Cline: Open Chat」を選択します。

  2. タスクの依頼
    チャットウィンドウが開いたら、自然言語でタスクを依頼します。

  3. 結果の確認と承認
    すると、自然言語で応答が返ってきて、「今から Cline がやろうとしていること」の説明と「こんなファイルを作ったから保存していい?」という確認が返ってきました。問題なければ「Save」を押すとファイルが実際に保存されます。同様にコマンド実行が必要なものも承認を求められるので、許可すると Cline が自動で実行してくれます。先ほどの設定で Cline に実行権限を渡しておくと、ここでいちいち承認を得ずに勝手にやってくれます。
    スクリーンショット 2025-04-09 21.48.28.png

  4. タスク完了通知
    終わると「Task Completed」と表示され、結果が表示されます。
    上部には「$0.1164」と表示されており、今回のタスク実行にいくらかかったかが表示されます。1ドル145円と考えると17円くらいでしょうか。1から自分で調べてコードを書くと1時間くらいかかりそうなので、それが17円で一瞬で終わると考えると、十分もとが取れている気がします。もちろん、もっと複雑なタスクを実行する場合は、レビュー&修正のラリーを繰り返すのでもう少し料金がかかると思います。
    スクリーンショット 2025-04-09 21.55.01.png

Cline の料金

Cline 自体はオープンソースとして提供されており、無料で利用できます。ただし、利用する AI モデルの API コストが別途発生します。私は OpenAI の API を使っているので、OpenAI の利用料がかかります。
じゃあ実際いくらくらいかかるの?というのが気になるところですが、選択する API とその使い方によるのでパッといくらとは言えません。ここでは仮に Cline + OpenAI(GPT-4)を使った場合の料金を試算してみることにします。

🔧 前提条件

項目
1日の利用回数 10回(Cline にちょっとした質問やコード生成を依頼)
1回あたりの入力トークン数 約500トークン
1回あたりの出力トークン数 約1000トークン
使用モデル GPT-4o(2024年登場の高速かつ安価なGPT-4)
為替 1ドル=145円と仮定します

💰 OpenAI GPT-4o の料金(2025年4月時点)

  • 入力:$5 / 1M(100万)トークン
  • 出力:$15 / 1Mトークン
    参照:OpenAI Pricing

💡 月額試算(30日使った場合)

1回の利用にかかる費用:

  • 入力500トークン → 0.0005M → $0.0025
  • 出力1000トークン → 0.001M → $0.015
  • 合計:$0.0175 / 回

1日10回使うと:

  • $0.0175 × 10 = $0.175 / 日

30日使うと:

  • $0.175 × 30 = $5.25 / 月

✅ 結論

「毎日ちょっとだけClineを使いたい」といったライトな使い方なら、月725〜870円程度($5〜6程度)のAPI利用料に収まりそうです。
ただ、あくまで参考値なので使いすぎにはご注意ください。

Cline は世界を変えるか?

最後に、普段の開発でしばらく使ってみた素直な感想を書きたいと思います。
結論から言うと「まだ発展途上だが、今後世界が変わる可能性がある」という感じです。

1から自分で実装するとそれなりに時間のかかるものが数分で仕上がります。コマンド実行して環境作って、コード書いて実装して、動作確認して・・・みたいな数時間かかる作業が Cline によってものの数分で出来てしまいます。これは驚異的なことです。

ただし、Cline はちょくちょく初歩的なところでハマって無限ループに陥ります。IDE のシンタックスエラーで苦しんでいたり、テストが通らずに苦しんでいたり、よくわからない初歩的なところで躓いていたりします。そんな様子が見えたら Cline を一時停止し、人間が手助けしてあげます。また、「いや、それは指示と違うじゃん」とか「そのファイルはいじっちゃダメでしょ」みたいな人間の意図を無視することもあります。そこも気づいて人間が直してあげる必要があります。Cline がコードを書いて、横で人間がペアプロしているような感覚です。
ちゃんと技術がわかっている人が使えば、Cline の暴走を止めて軌道修正できますが、何も知らない人が使うと Cline と一緒に苦しむかもしれません。

あと、しばらく触っていると「Cline が得意なこと」と「Cline が不得意なこと」がわかってきます。これは自分の感覚ですが、複雑なタスクを全部丸投げするような使い方よりも、部品や雛形を作ってもらうほうが得意な気がします。そうなると「Copilot でもいいじゃん」となってくるのですが、Cline の場合は複数ファイルにまたがった修正やコマンド実行が必要な操作も勝手にやってくれるので、そこの優位性はある気がします。

ただ、このあたりの問題の解決はもはや時間の問題なんじゃないかと思っています。最近のAIの進歩の速度を考えると、近い未来にもう人間の言うことを聞く必要がないレベルまで到達しているかもしれません。人間が読みやすく保守しやすいコードを書く必要はなく、AIが理解できてAIが自分で改修できればいいわけで、人間はいかに要件を噛み砕いて的確にAIに指示が出せるかどうか、という能力に特化していくのかもしれません。

これは開発環境の革命のはじまりを予感させます。Cline は一度使ってみる価値のある強力なツールであることは間違いないです。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?