2024/11/15 リリース IBMの最新のコードアシスタントを試してみよう

# はじめに

この記事ではIBMの最新のコードアシスタントである「**IBM watsonx Code Assistant**」を無料お試ししてみることを目的としております。
ご興味がありましたらぜひお手元で環境設定いただきコード生成の世界を体感いただけますと幸いです！

:::note info
この記事では以下の方におすすめの記事となっております。
- IBMの最新生成AIツールを体験したい
- コード生成に興味がある
:::

# そもそも、watsonx Code Assistant とは？
Watsonx Code Assistant は生成AIと自動化を活用して、企業向けにコーディングをより迅速に行うことができるツールです。
ポイントは以下の通りです。
- 不明点を解消：コーディングAIアシスタントとチャットすることでコーディングに必要な推奨事項やガイダンスを迅速に入手することができます
- あらゆる環境に導入：クラウド、オンプレミス、ハイブリッドのいずれでも、お客様のニーズを見たし、データガバナンスや規則に最適なホスティング環境を選択できる
- 高い信頼性：IP保証サービスを提供するAIモデルを活用しており、お客様の利益と知的財産権を保護します

従来のwatsonx Code Assistant シリーズでは特定の領域( AnsibleやZ向け )に対して使えるコードアシスタントサービスでしたが、今回リリースされた製品はより汎用的なコーディングにも対応しております。
「Python、Java、C、C++、Go、JavaScript、TypeScriptなど、さまざまなプログラミング言語のコーディング・ワークフローを簡素化し、迅速化します。」
製品のHP: https://www.ibm.com/jp-ja/products/watsonx-code-assistant

# IBM Cloud 上での設定

## まずはIBM Cloudにログインします
https://cloud.ibm.com/login
こちらからお持ちのIBM Cloudにログインします。
![スクリーンショット 2024-11-16 1.20.55.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3631727/2d53be6e-b5a5-bdb4-6e52-a199ae12aafc.png)
＊アカウントをお持ちでない場合は、「アカウントの作成」からアカウント作成ください
参考サイト：[IBM Cloudのアカウント開設方法](https://qiita.com/Topfield/items/d3bdd7f696268a562340)
## IBM Cloudのダッシュボードが表示されたら、IBM watsonx Code Assistantのサービスを検索します
![スクリーンショット 2024-11-16 1.22.33.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3631727/260f7a1b-1c4e-c9c1-adaf-f7c8f00932cc.png)
上の検索バーにwatsonx code assistant と入力します。
![238.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3631727/0ef5d4bb-c783-0de9-6b0f-a881eca5d68c.png)
「IBM watsonx Code Assistant」をクリックします。
![234.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3631727/3908f8ea-05f5-7071-0c69-13d54b030af0.png)
watsonx Code Assistant のカタログ画面が表示されます。
![237.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3631727/8bba5b0e-aa72-865d-9196-8e6fd02edd46.png)
## 「IBM watsonx Code Assistant トライアル」を選択し、サービスを作成します
![242.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3631727/fe666b2b-8c5f-4657-062f-0dfee40605f6.png)
4. watsonx Code Assistant のダッシュボードが表示されます
![スクリーンショット 2024-11-16 1.31.03.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3631727/765afb8f-8063-1d91-3c57-9c7ef6c090ef.png)
制限付きのお試しプランであるため、トークンの制限と、日数の制限が表示されています。
## Watsonx Code Assistant のサービスを立ち上げる
「watsonx Code Assistant の起動」をクリックします。
![246.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3631727/fdb7656c-8cd6-a527-3a45-be605294a711.png)
watsonx Code Assistant のダッシュボードが開かれます。
![スクリーンショット 2024-11-16 1.32.51.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3631727/8719ae48-4ae7-d794-34a3-a0b03c62b39d.png)
「セットアップ」をクリックします。
![247.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3631727/749ecafb-fe4c-f76a-43e1-fee6cdd13c2e.png)
セットアップの画面が表示されます
![スクリーンショット 2024-11-16 1.33.15.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3631727/2e4459c1-8196-e5f8-ca73-9909e98494bc.png)
## watsonx Code Assistant をセットアップする
基本的にはガイド通りにシンプルに進めば大丈夫です。
今回はお試しということでよりシンプルな「シングル・ユーザー」で設定するので、「シングル・ユーザー」を選択します。
![251.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3631727/74f6e904-ec81-f9a0-5baf-8a27f3f30d28.png)
### デプロイメント・スペースを作成します
矢印ボタンをクリックします。
![256.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3631727/7a97195c-70db-14f2-5383-3d8eba34e014.png)
名前は適当な名前を入力し、有効なストレージとコード・アシスタント・サービスを選択したのちに、「作成」をクリックします。
![300.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3631727/9c7b3c35-b306-4616-96d2-8633a4853a7c.png)
この画面になればOKです。
![スクリーンショット 2024-11-16 1.36.26.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3631727/1830ecc7-baf6-25ec-5962-36541b1f5003.png)
### 次にライセンスの優先順位を選択します
watsonx Code Assistant のダッシュボードにもどり、矢印ボタンをクリックします。
![303.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3631727/688720e0-4db3-28e5-b7ff-64bda68a9a8a.png)
ライセンスに関する設定画面が表示されます。
![スクリーンショット 2024-11-16 1.40.17.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3631727/f6972fbe-86e2-9ab7-f9b8-5def85c78618.png)
watsonx Code Assistant の機能の一つに、watsonx Code Assistantが生成するコードと類似するコードを検索し、そのライセンス情報を確認する機能があります。
デフォルトでこれらのライセンスに該当するコードと近いコードが生成された場合は、生成されたコードを表示せずにブロックされます。
設定を変更することで、上記のライセンスに引っかかった場合でもコードとライセンスの参照を表示することもできます。

設定が完了したら、タブを閉じて元のwatsonx Code Assistantの画面に戻り、四角にチェックをつけます
![306.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3631727/6866c3de-c967-4acd-985f-8c4317690eec.png)

これでwatsonx Code Assistant の設定は完了です。
「Go to home page」というボタンが出現するのでクリックします。
![309.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3631727/e27f1e73-508f-54fb-c69d-50fa739be3f6.png)

# VS Code の拡張機能を設定する
watsonx Code Assistant はVS Codeの拡張機能から使用できます。ここからの手順ではVS Codeの拡張機能の設定を行います。
＊VS Code を事前にインストールください
参考：[Visual Studio Code のインストール方法](https://qiita.com/YurimyMiyu/items/5ce7821f1e3e5905c3ee)

watsonx Code Assistant のダッシュボードから「拡張機能のインストール」を選択します。
![313.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3631727/547fa94e-6a07-34ac-dd59-90ec6630e373.png)

表示されたドキュメントのページから、まずはAPI keyを取得します。
「Create an IBM Cloud API key」をクリックします。
![314.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3631727/16cd6869-f08b-a280-a261-6b3208236f39.png)

「IBM Cloud API key」をクリックします。
![316.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3631727/4ac4632e-59d6-1909-e7f8-8674c9464bab.png)

APIキーを設定できるIBM Cloud のダッシュボードが表示されます。
「作成＋」ボタンをクリックします。
![318.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3631727/7123705d-919e-ef59-9a2f-248c7428de6f.png)

APIキーの名前を入力後、作成します。
![320.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3631727/83de3e6b-1aca-6ef8-357a-94e1a8b69a24.png)
![スクリーンショット 2024-11-16 1.49.06.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3631727/e8fb58dd-3e46-1d1d-8c92-c2b80df38a5a.png)
作成されたキーは300秒ほどで確認することができなくなるので、適宜メモ帳にコピーしたり、ダウンロードしておいてください。

こちらのIBM Cloudタブは以降使用しないので閉じておきます。

次に拡張機能をインストールします。
再度ドキュメントのページに戻り、少し下にスクロールして「watsonx Code Assistant」を選択します。
![323.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3631727/f508dc04-a852-495b-d5da-9064fc93da40.png)
![325.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3631727/a460a879-cf8b-cd15-d52c-9b4a43e4e696.png)

VS Code の拡張機能の画面に遷移します。
このwatsonx Code Assistantという拡張機能をインストールしたいので、「Install」をクリックします。
![327.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3631727/48ec9741-6862-ff04-9921-e338e762c9e2.png)

お使いのPCがmacとwindowsかで少し表示が変わりますが、webサイトからVS Codeを開くことを許可します。
![328.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3631727/de5e2f68-2b38-bb56-45f0-e5b4fd3e862b.png)

VS Code が立ち上がり、watsonx Code Assistant 拡張機能が表示されます。
「Install」をクリックします。
![329.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3631727/19962ce4-5191-c519-172b-76d1197374a5.png)

左のタブにwatsonx Code Assistant のアイコンが追加されると成功です。
![331.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3631727/90e05901-1a80-3680-e713-aca94366b3b9.png)

左のアイコンをクリックします。
![333.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3631727/8ef626e1-d532-1544-0484-9b656d9a4545.png)

watsonx Code Assistant の設定画面が表示されます。
「Log in with your API key」をクリックします。
![335.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3631727/1998d1ce-3051-0e1f-5c6e-7bf9aa15b6fa.png)

「Allow」を選択して、先ほどのステップでメモしたAPI keyを入力します。(入力後はエンターボタンを押します)
![336.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3631727/c35fd188-326c-6eea-338c-556f7ba33723.png)

このようなチャットUIが表示されれば成功です。
![スクリーンショット 2024-11-16 1.57.48.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3631727/0be21dd0-5f46-f13a-fca2-dd168bb73a12.png)

# 簡単な例を試してみましょう
適当にpythonファイルを用意します。
![スクリーンショット 2024-11-16 2.02.44.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3631727/11b13848-71d1-4cbe-639d-f3b2a4955fd7.png)

ファイルの最上部にコメントで「Hello worldと出力するプログラム」と書きます。
![スクリーンショット 2024-11-16 2.03.47.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3631727/4fd56187-4936-8abf-3817-bbba0b77584b.png)

コメントの下の行に移動し、macなら「cmd+.」、windowsなら「Alt+.」を押します。
するとコードのサジェストが出てきました。受け入れるためにはTabボタンを押します。
![スクリーンショット 2024-11-16 2.07.37.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3631727/67ab1435-c0de-6863-2a1c-9c5fa155f875.png)

関数を忘れた時などにネットなどを使った検索なしにサクッと出してくれますし、単純な手打ちよりもコーディングの時間の短縮になるのではないでしょうか。

:::note warn
現在のwatsonx Code Assistant の正式なサポート言語は英語のみとなっております。ただし生成AIの特性上、上記のようなある程度の難易度のタスクであれば日本語にも対応します。より複雑なタスクを行いたい場合は英語を使うことを考慮する必要があるかもしれません。
:::

# 最後に
この記事ではIBMの最新ソリューションであるwatsonx Code Assistantをお試しするまでの方法をご紹介しました。
今回は機能の詳細な説明はしておりませんが、ドキュメントなどを参考に色々お試しいただけますと幸いです。
最後までお読みいただきありがとうございました！