VSCodeの拡張機能Continueを使ってGroqを試してみた

## はじめに
この記事では、VSCodeの拡張機能「Continue」とGroqのAPIを活用して、話題のllama3 70b を試してみます。特にエディタからLLMを呼び出す方法に興味がある方にとって、実用的なガイドとなる内容を紹介します。

### Continueとは
-「Continue」は、ソフトウェア開発のためのオープンソースのオートパイロット(コーディング支援AIツール)です。
- VS CodeやJetBrainsにChatGPTの力をもたらすIDE拡張機能であり、深くカスタマイズ可能に構築され、開発データから継続的に学習します。
- 詳細は https://continue.dev で確認できます。
- デモの動画の参照先。

https://youtu.be/3Ocrc-WX4iQ?si=6VdN525RvIOwTLDh

## 必要なツールと設定
- Visual Studio Codeのインストール
- Groqのアカウント作成：[公式サイト](https://groq.com/)からアカウント作成には、メールアドレスまたは、Googleアカウントを使うことができます！

## 導入手順
### Continueのインストール
VSCodeの拡張機能タブで「Continue」を検索し、インストールします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2648069/4db9b58c-160a-8350-bd46-eb660bf5a1e5.png)

### groqのAPIキー取得
1. [groqCloude](https://console.groq.com/playground)からAPIキーを取得します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2648069/b0c554ce-d9cb-adca-0054-b9978b107a53.png)

2. 「Create API Key」をクリックし、キーを生成して取得します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2648069/97f0f4aa-c543-472a-9041-cd06cae932c3.png)

### groqのAPIをVSCodeに設定
1. VSCodeにContinueがインストールされた後、指定のアイコンから設定画面を開きます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2648069/16fb466d-c49d-5845-f363-e0df16331981.png)

2. 「+」をクリックしてgroqのAPIで選択できるモデルを追加する。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2648069/da36bf5b-d529-477d-0d8c-899624a14b11.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2648069/45247fed-ba7e-678b-2ed4-32f7e2f1bca8.png)

3. APIキーを入力し、使用するモデルを選択して保存。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2648069/ad1be7da-7030-1e76-ce62-845321014b7f.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2648069/60d02425-fdbf-84a1-edf7-f2cbda24978b.png)
vscodeの右下にモデルの追加が成功した通知される。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2648069/d8652a23-3633-6e61-b3cc-58bb3e59572c.png)
追加したモデルを選択する

## 使用例とデモ
- Continueのチャット入力欄に質問を投げ、Groqで答えを得るデモを行います。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2648069/315ed47d-fcd7-1c20-947a-8ba99ec49324.png)


- 例えば、「インドカレーの作り方を教えて」と質問すると、爆速で叩きつけるような感じで回答が得られます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2648069/763c8a35-04ed-9251-a4d0-c3168c51180c.png)

- コマンドやファイル参照機能を活用してさらに便利に。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2648069/635027cd-f3f0-dcdf-6dd9-ec0ffd501793.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2648069/af460e74-b1c3-86e5-eea5-1fd9d8850a50.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2648069/dd212c73-e140-51a3-7de5-88a97ebbc5a1.png)

- htmlのコードについて、コメントを追記することをお願いしてみた。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2648069/3105efad-8198-c0ff-4191-d8dede7a62e9.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2648069/bf6c8445-f77f-a14b-704f-b552ce4b705f.png)
自分の環境だとエラーにになってしまった・・。

## まとめ
VSCodeの拡張機能「Continue」を用いて、GroqのAPIを経由することでLamma3 70Bを効果的に活用する方法を紹介しました。このツールを使えば、コーディング支援を受けながらさまざまなLLMを簡単に切り替えて使用でき、開発作業の効率を大きく向上させることが可能です。是非このガイドを参考に、応用してみてください。

## 感想
- コード生成については、自分の環境ではうまくうごかなかったが、文章生成でも、爆速で動くだけでも素晴らしかったです。公式のWebサイトのプレイグラウンドでも、爆速感は体験できるのでぜひともやってみてください。LPUすげーな・・。未来を感じました。

## 参考文献
- [LPUを使った最速AI、「groq」はなぜ速い？他のLLMとの比較や使い方を紹介！](https://aitechworld.info/groq/)
- [Groq's AI Chip Breaks Speed Records](https://youtu.be/pRUddK6sxDg?si=cYEpv5n5G_SHKea8)
GroqのCEO、ジョナサン・ロス氏は、2024年のワールド・ガバメント・サミット（ドバイ）で行われたインタビューで、同社の人間のようなAIチップの動作原理について説明しました。CNNのベッキー・アンダーソンがこの驚異的な技術と対話する様子も紹介されました。