DeepSeek Cline チュートリアル：無料モデルと API 接続
Cline は VS Code でもターミナルでも動くオープンソースのコーディングエージェントです。この図解ウォークスルーでは実際のセットアップに沿って、拡張機能のインストール、無料モデル一覧から DeepSeek V4 Flash を選ぶ方法（または自分の API キーの接続）、そして合計 $0.00 でポートフォリオサイトを完成させるところまでを解説します。
要点まとめ
- Cline は VS Code・JetBrains・Cursor・Windsurf・ターミナルで使える無料のオープンソース コーディングエージェントです。インストールは一度だけ、サブスクリプションも不要です。
- DeepSeek V4 Flash は Cline の Free モデル階層にあり、100 万トークンのコンテキスト窓を備えます。作者の hello テストも 71,049 トークンのポートフォリオ構築も請求は $0.00 でした。
- 自分のキーを使いたい場合は platform.deepseek.com で作成し、Cline の設定で DeepSeek プロバイダーを選び、ベース URL に https://api.deepseek.com を入れて、現行モデル名の deepseek-flash か deepseek-v4-pro を指定します。
- 旧モデル名 deepseek-chat と deepseek-reasoner は 2026 年 7 月 24 日に廃止されました。旧名のままのチュートリアルを見たら、現行名に置き換えてください。
Cline: FREE AI Coding Agent | DeepSeek, GLM, LongCat & Laguna
ウォークスルー動画:Code With Yousaf08:49
DeepSeek provider configuration — official Cline docs
公式ドキュメント:docs.cline.bot
このウォークスルーは Cline の現行無料階層で録画されたもので、DeepSeek V4 Flash の項目と deepseek/deepseek-v4-flash のモデル ID が画面にそのまま映っています。API キー経路の値は 2026 年 9 月時点の Cline および DeepSeek 公式ドキュメントに準拠します。
スクリーンショットは上の動画のフレームで、出典付きで正確なタイムスタンプへリンクしています。手順の文章はすべて当サイト独自のものです。
Cline で DeepSeek を使う手順
1 · オープンなコーディングエージェント Cline を知る
- 1
cline.bot で Cline を知る
Cline はオープンソースのコーディングエージェントで、ターミナル用の CLI、VS Code・JetBrains・Cursor・Windsurf 用の IDE 拡張、そして SDK の 3 形態で提供されます。公式ホームページはこのガイドが扱う両ルートの起点です。
オープンなコーディングエージェントのホームページ：CLI・IDE 拡張・SDK を一度のインストールで0:52 に視聴 - 2
ルートを選ぶ：CLI コマンドか IDE 拡張か
インストール欄には両方の選択肢が並んでいます。ターミナル派は npm i -g cline コマンドをコピー（macOS・Windows・Linux いずれも対応）、VS Code 派は IDE Extension タブへ。このガイドはまず拡張ルートを進み、構築デモで CLI に戻ります。
インストール欄に二つのルート：npm コマンドと拡張タブ1:20 に視聴 - 3
CLI の無料モデル一覧に DeepSeek を確認
任意のフォルダで cline を起動すると、ウェルカム画面のステータス行に現在のモデルが表示されます。初期状態では Cline の使用量課金で動作し、DeepSeek V4 Flash は無料階層にあります。開始に API キーは不要です。
CLI のステータス行は DeepSeek V4 Flash (high)、$0.00 — 初回起動から無料2:30 に視聴
2 · VS Code に Cline をインストール
- 4
VS Code の拡張機能ビューを開く
VS Code でアクティビティバーから拡張機能ビューを開くと、インストール済みの中に Cline があります（新規で入れる場合はマーケットプレイスで「Cline」を検索）。
拡張機能ビューにインストール済みとして並ぶ Cline（自律コーディングエージェント）3:28 に視聴 - 5
設定前に拡張機能を確認する
拡張機能の詳細ページで本物だと確認できます：公開元は cline.bot で、インストール数は 500 万超。Install ボタンの代わりに Disable と Uninstall が表示されていれば、すでに有効になっています。
Cline のマーケットプレイスページ：cline.bot 公開、519 万インストール、インストール済み3:34 に視聴 - 6
Cline パネルを開く
アクティビティバーの Cline アイコンをクリックします。パネルには What can I do for you? のタスクボックス、下部に Plan/Act 切り替え、過去タスクとその費用が表示され、この環境ではすべてのセッションが $0.00 です。
タスクボックス・Plan/Act 切り替え、そして全タスク $0.00 の Recent リスト3:50 に視聴
3 · DeepSeek を接続（無料階層 or 自分のキー）
- 7
設定で API プロバイダーを確認
歯車アイコンから Cline の設定を開きます。API Provider ドロップダウンは Cline Usage-Billing（Cline 自前の課金）になっていて、無料階層はこれによって成り立っています。自分のキーを使いたい場合は、ここで DeepSeek プロバイダーに切り替えます（詳細は FAQ）。
設定 → API Provider：Cline Usage-Billing、請求と使用量はワンクリック先4:02 に視聴 - 8
モデルピッカーの Free タブを開く
Model の下には Recommended と Free の 2 つのタブがあります。Free タブには DeepSeek V4 Flash・GLM-5.3-Flash・LongCat 2.0・Laguna S 2.1 が並び、すべて FREE タグ付き。100 万トークンのコンテキストなら DeepSeek V4 Flash を選びましょう。
4 つの無料モデル、すべて FREE タグ付き — 先頭は DeepSeek V4 Flash4:22 に視聴 - 9
DeepSeek V4 Flash を選びモデル ID を確認
DeepSeek V4 Flash を選ぶと、設定にはモデル ID deepseek/deepseek-v4-flash、1.0M のコンテキスト窓、入出力とも Free の価格が表示されます。Reasoning Effort の既定は High。Plan と Act で別々のモデルを使い、実行は安いモデルに任せることもできます。
deepseek/deepseek-v4-flash を選択：1.0M コンテキスト、入出力とも Free4:44 に視聴 - 10
hello テストを送る
タスクボックスに hello と入力します。しばらくすると緑の COMPLETED マークと $0.0000 の費用バッジ付きで返信が届きます（作者は 4 つの無料モデルを順に試しています。下部のモデルチップを見れば、どれが答えたか分かります）。
最初のチャット：$0.0000 で COMPLETED、回答モデルはチップに表示5:04 に視聴
4 · $0.00 で実際のプロジェクトを完成させる
- 11
Cline に実際の構築プロンプトを渡す
CLI に戻って作者は完全な仕様を送ります：滑らかなスクロールアニメ・ホバー効果・アニメ付きコードスニペットを備えたダークで高級感のあるポートフォリオを、CSS と JavaScript を埋め込んだ単一の index.html に収めるというもの。この構築では LongCat 2.0（これも無料リスト）に切り替えましたが、手順はどの無料モデルでも同じです。
シングルファイルのポートフォリオ仕様を Cline CLI に貼り付け5:53 に視聴 - 12
作業と請求の両方を見届ける
Cline は計画をストリーミングし、ファイルを書き出し、最後に機能リストで締めます：プリローダー・カスタムカーソル・アニメ背景・ナビゲーション・ヒーロー・スキル・プロジェクト・コンタクト・フッター。ステータス行の合計は 71,049 トークン、$0.00 です。
構築サマリー — 9 セクション納品、71,049 トークン、$0.006:37 に視聴 - 13
完成したサイトを開く
生成された index.html はブラウザでそのまま開きます：アニメ付きコードカードを備えた I craft digital experiences のヒーロー、プロジェクトグリッド、コンタクトフォーム。気になる点があれば、作者がナビバーの中央寄せを頼んだように普通の言葉で修正を伝えれば、Cline がファイルを編集します。
完成したポートフォリオ、単一の生成 index.html で動く7:09 に視聴