🍕

AmplifyのAI機能を試す

2024/12/12に公開

Qiita Advent Calendar 2024 「AWS Amplify」 12日目の記事です。
https://qiita.com/advent-calendar/2024/amplify

はじめに

re:inventから落選(?)したAmplifyの新機能AWS Amplify AI kitを試します。
簡単に説明すると、AIアプリを簡単に作れる機能です。

https://aws.amazon.com/jp/blogs/mobile/build-fullstack-ai-apps-in-minutes-with-the-new-amplify-ai-kit/

そういえば去年のAmplify Gen2もre:inventの直前に発表でしたよね。
最近はAmplifyって不遇なんですかね?

作ったもの

作ったWebアプリのスクショ

作ったWebアプリのコード

GitHubにおきました。自由に使ってください。
https://github.com/k-ibaraki/ibaraki-amplify-ai-test/tree/zenn

※ 2024/12/12時点では東京リージョンで使用できないAIモデル(Claude 3.5 Haiku)を設定しています。オレゴンリージョン(us-west-2)で動作確認をしています。
使用するリージョンでBedrockのClaude 3.5 Haikuを有効化しないと動かないのでご注意ください。

※ 認証機能もつけてはいますが、誰にでも新規ユーザー作れちゃう設定になっているので、Amplifyのアクセスコントロール機能で制限したほうが良いです。

作った手順

ゼロから構築した手順を書いていきます。

ベースを作る

まずは、とりあえず適当にフロントエンドを初期化します。

npm create vite@latest . -- --template react-swc-ts

次にAmplify(Gen2)を初期化します。

npm create amplify@latest

AmplifyのCI/CDの設定をします。amplify.ymlファイルを作ります。
https://github.com/k-ibaraki/ibaraki-amplify-ai-test/blob/zenn/amplify.yml

Amplify Gen2を使ってバックエンドに生成AI機能を設定

https://docs.amplify.aws/react/ai/set-up-ai/

上記のチュートリアル見ながらamplify/data/resources.tsを変更します。
https://github.com/k-ibaraki/ibaraki-amplify-ai-test/blob/zenn/amplify/data/resource.ts

フロントエンドを作る

フロントエンドにAmplify関連のライブラリ追加します。

npm add aws-amplify @aws-amplify/ui-react @aws-amplify/ui-react-ai

Amplifyのドキュメントを参考に、認証機能とAI Chat機能を追加します。
https://docs.amplify.aws/react/build-a-backend/auth/connect-your-frontend/using-the-authenticator/
https://docs.amplify.aws/react/ai/conversation/ai-conversation/

https://github.com/k-ibaraki/ibaraki-amplify-ai-test/blob/zenn/src/App.tsx

あとは適当にCSSと調整したら完成です。簡単ですね。

作ったものを試す

最初にも書きましたが、以下の3点が注意点としてあります。

  • Amazon Bedrockで使用するモデルを有効化しておく
  • Amplifyもモデルと同じリージョンを使う
  • AWS上にデプロイする時はアクセス制限を設定しよう

なお、私はオレゴンリージョン(us-west-2)でClaude 3.5 Haikuを使いました。

ローカル環境から試す。

バックエンド

以下のコマンドで、開発用のsandbox環境を作れます。

npx ampx sandbox --profile {AWS_PROFILE}

フロントエンド

バックエンドが構築できたら、以下のコマンドでフロントエンドをローカルに立ち上げれば動作確認が出来ます。

npm run dev

AWS上にデプロイする

  1. 適当なGitHubのレポジトリに作ったコードをPushします。
  2. Amplifyコンソールから新規アプリを作成で、該当のGitHubレポジトリを指定してアプリを作成します。

以上でAmplifyにデプロイ出来ます。とても簡単ですね。

感想

良い点

AIのチャットアプリが簡単に作れる

LangChainとかPythonを知らなくても簡単にAIアプリが作れるのはありがたいです。
また、必要なものがWebのコンポーネントとして提供されているので、自作のアプリへの取り込みも容易ですし、見た目のカスタマイズもしやすいのは助かります。

履歴管理を自動でやってくれる

履歴が自動で保存され、Amplifyコンソールから簡単に履歴の確認ができます。

今回は試していませんが、おそらくアプリ上での履歴表示も簡単にできるのではないかと思います。

微妙だなと思う点

カスタマイズしたいと思ったら、それなりに面倒くさい

AWSでAIのアプリを作りたいときって、素の生成AIモデルを呼び出すことは少なくてKnowledgeBaseとかAgentを使うことが多いと思うんですよね。以下の記事にもあるようにAmplify AI kitからもKnowledgeBaseを使えそうですが、記事を読んでいて「結構面倒くさくない?」と思いました。

https://aws.amazon.com/jp/blogs/mobile/building-a-personalized-travel-planner-with-amazon-bedrocks-knowledge-bases-and-rag/?sc_channel=sm&sc_publisher=TWITTER&sc_country=global&sc_geo=GLOBAL&sc_outcome=awareness&linkId=664862929

アプリを作りたい時はその他にも色々カスタマイズしたい事が多いので、いちいち新機能のドキュメントを見てやりたいことが可能か?どうやるのか?を調べる手間を考えたら、普通にAWS SDKで作ったほうが早くない?と思ってしまいました。

Amazon Novaが現時点で使えない

現時点とは2024/12/12です。
これちょっと意味わからないのですが、当初は新AIモデルであるAmazon Nova Liteで作ろうと思っていました。Amplify SDKにも定義が追加されていていて普通に設定できたのですが、デプロイしてチャットするとAIの応答が全く無いのですよね。
すぐに対応されるとは思いますが、re:inventでのモデル発表と同時に使える状態になっていて欲しかったなという思いです。

※ ちょっと処理を追ってみたら、AI機能が生成したLambdaでバリデーションエラーで弾かれてますね。IAMの権限設定とかはしっかり入っているのになんか中途半端。ちゃんとテストしているのかな。。。

"errorMessage": "Invocation of model ID amazon.nova-lite-v1:0 with on-demand throughput isn’t supported. Retry your request with the ID or ARN of an inference profile that contains this model."

生成されるAppSyncが普通にバグってない?

生成されたAppSyncの関数を見ていたらなんかエラーがでているんですよね。しかも単純なimport漏れですね。関数名からしてAuth0関連と思われるので、私は使わないので影響はないのですが。

(もしissue化とかされてないなら、バグ報告したほうがいいのかな。。。?)

この件を置いておいても、このAppSync関数が50個もあってVTLとJSが混在していて、かなりカオスな感じがします。保守性大丈夫なのかな。。。品質に不安が、、、と思ってしまいます。

最後に

正直不安は残る機能ですが、とりあえずAIチャットアプリを簡単に作りたい時には良いんじゃないでしょうか。

以上です。

NCDCエンジニアブログ

Discussion