1
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って何?を図で解説してみた。

Posted at

はじめに

こんにちは。最近、AIを使ったコーディングに興味があって、VSCodeの拡張機能で導入しやすい「Cline」を少し使い始めています。自分にとって馴染みのあるTerraformのコードをAIに書かせてみたのですが、本当に自分は最後のちょこっとしたコード修正を行うだけで済んだのでとても便利に感じました。今回は、そんなClineについてどういうものなのか?どう使うのか?などを解説していこうと思います!!

Clineとは?

概要

Clineは、AIを活用した開発者支援ツールです。具体的な支援としては、VSCodeなどのIDE上で動作して、ファイル作成、コーディング、トラブルシューティングなどを自律的に行ってくれます!
普段、開発をする上でのAI活用はChatGPTなどのチャットボットを使っているのかなと思いますが、実際にどういう点が違うのでしょうか?以下では、その違いを図を使って説明しようと思います。
ポイントは、「IDE上で動作する」「自律的に開発者を支援する」という点です。

図解:チャットボットを活用したコーディング (通常)

チャットボットを使用したコーディングはこんなイメージです。
image.png
まず、書いて欲しい内容をチャットボットに提示してコードを記述してもらいます。そこから、ユーザはIDE上でコピペしてコードを実行し、エラーがあったらそれをチャットボットに投げてどんどんコードを改善していくというような流れです。この流れはコーディングを行うのはAIなので、効率的に見えますが、

  • IDE上にコピペし、コマンドを実行する作業
  • 実行結果を渡し、エラーをAIに修正依頼する作業

は手動で行っており、まだまだ非効率的なところが残っています。
どうせなら

  • コーディングをIDE (実行環境) 上でやってほしい
  • コマンドを実行し、トラブルシューティングを自動でやってほしい

と思いますよね?それをClineは実行してくれます!

図解:Clineを活用したコーディング

Clineを使用したコーディングはこんなイメージです。

image.png

まず、書いて欲しい内容をVSCode上で提示します。すると、VSCode上でAIとのやり取りが始まります。
すると、AIは、コーディングするためのファイルの作成などのVSCode上の操作について許可をユーザに取ってきます。ユーザがその操作を許可するとコマンドを実行し、ファイルが作成されます。そして作成したファイルにコーディングが行われ、テストしたいとの依頼が再びきます。ユーザがそれを許可すると、テストコードが実行され、その実行結果は自動的にAIに送信され、AIはその結果をもとに次の行動を決めるというような流れです。

つまり、先ほど書いた効率的に行いたい点として書いた

  • コーディングをIDE (実行環境) 上でやってほしい
  • コマンドを実行し、トラブルシューティングを自動でやってほしい

というのをユーザに許可を取りながら自律的にVSCode上で実行してくれます!

めっちゃ便利ですよね...。ここまで進化しましたか...。

Clineの使い方

そんなClineの使い方ですが、拡張機能をインストールし、使用したいAIモデルを指定だけで使い始めることが出来ます。例えば、Bedrockなら使用するAIモデルをAWSのマネージメントコンソールで有効化し、自身のアクセスキーや使用するAIモデルをVSCode上に登録することでClineを使い始めることが出来ます。

より詳細な説明は👇に書かれています!

.clinerulesでよりスマートな依頼を実現!

コーディングをAIに行って欲しい際は、「こういうルールでこういうコードを書いて欲しい」と、ルールを詳細に書くことで、AIがルールに沿ったコーディングしてくれます。
しかし、プロジェクトであらかじめ決まっているルールをAIに何度も投げるのは指示文も長くなるなどしてとても非効率に感じます。そこで、Clineではそのルールを.clinerulesに記載しておくことで「こういうコードを書いて欲しい」という指示文で済ませることが出来ます!.clinerulesは基本マークダウン形式で記載して

## はじめに
このドキュメントは、clineが開発を行うためのルールをまとめたものです。
このルールに従って開発を行ってください。

## コーディングルール
1. xxxxx
2. yyyyy
3. aaaaa

## テスト
$ exec-command {file-name} が成功すること

というようにまとめて、プロジェクトのフォルダに格納してください。

実際、どのようなルールが設定されているかは👇をご参考ください!

まとめ

便利なので、ぜひお手元のVSCodeにインストールして、どれかお気に入りのAIモデルを探してみてください!もう、元の開発には戻れません()

1
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
1
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?