Replit AgentとBolt.newを使いpythonコードを生成させて比べてみる

# はじめに
株式会社TechoesインフラチームのTです！
今回は、最近話題のブラウザ上IDEのAI支援を実際使用してみて比べてみたいと思います。

# 実行環境
- Windows : 11 Home 24H2

# Replit Agentについて
### 概要
##### Replitについて
Replitはブラウザ上で動作するIDEです。特徴としては以下の5つがあげられます。
- 多言語対応
- どこからでもアクセス可能 (スマホ、タブレットからのアクセス可能)
- 実行環境の構築が不要
- 複数のデバイスで同期可能
- リアルタイム共同編集

開発環境立ち上げ、アクセスの手軽さや複数人での開発のしやすさが使用するメリットになります。

##### Replit AIについて
Replit上でコーディングをする際に使用できるアシスタントAI機能です。
コード解説、修正、補完、生成が主な機能となります。
`Starter`プランでは `Gemini1.5Flash`が利用可能
`Core`プラン以上では `GPT-4o` `Claude 3.5 Sonnet V2`が利用可能

:::note 
2024/12/10時点
:::

##### Replit Agentについて
Replit AIをさらに強化した機能で自然言語で指示を出すだけでフロントエンドだけでなくバックエンドのコード生成可能な支援機能です。
環境やコードを意識することなくチャットのみで実現したい機能を実装してくれるのでエンジニア以外でも扱える。

:::note
Core以上のプランで利用可能
:::

### 料金
| プラン | 月額 | 年額 |
|:-:|:-:|:-:|
| Starter | Free | Free |
| Core | $25 | $180 |
| Teams | $40 | Coming soon |

プランが上位になるにつれて展開できるプロジェクト数や高いマシンスペックの選択、DBの使用が可能になります。
https://replit.com/pricing
# Bolt.newについて
### 概要
AIによる環境制御により自然言語で指示をするだけでアプリケーションの作成からデプロイまでチャットのみで操作可能
- ブラウザ内でフルスタック開発が可能なAIツール
- 様々なフレームワークのサポート
- ワンクリックでデプロイが可能

### 料金
| プラン | 価格 | 概要 | サポート
|:-:|:-:|:-:|:-:|
| Personal | Free | 基本的なアプリ開発が可能だが回数制限が厳しい | なし
| Pro 50~200 | $20~200 | 月間1000万トークン以上使用可能 | なし
| Teams 60~210 | $30~210 | チーム開発向け サポート付き　商用利用可 | eメール
|Enterprise | 要問合せ | 大規模なプロジェクト向け | 専用サポート

ProとTeamsプランには幅があり、数字が大きくなるほど月間で使用できるトークン数が上昇する。

https://bolt.new/?showPricing=true

# 事前準備
### Replitのセットアップ
1. [Replit](https://replit.com/)にアクセスし、右上のLog inを選択
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3492991/4d5884d7-2afd-4769-33fa-9b557155d807.png)
2. 左下のSign upを選択し、画面の情報を入力してサインアップ
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3492991/a6cc2574-c54a-76a4-509e-340af9ac5e95.png)


### Bolt.newのセットアップ
1. [Bolt.new](https://bolt.new)にアクセスし、右上のボタンからサインアップ
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3492991/e1dc0447-b6d7-6e21-6f8d-5a8b91f39337.png)
1. GithubアカウントかEmailで登録
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3492991/7d1d7dff-370d-09c3-77e3-32267aba2248.png)


# 実践
- 同じ指示をして環境を構築する
今回は`電卓アプリをPythonを使用して作成してください。`という命令をしてみます。

### Replit
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3492991/7c4c6a76-d7c3-b820-f868-8361e5a5768f.png)
Replitはユーザが指示した機能を拡張するようなものを提案してくれました。
せっかくなので今回は提案されているものをすべて実装してもらいましょう。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3492991/7d409bd4-86fc-514e-bf76-a2c0d8c35c7f.png)
実装されたものを確認したところ問題なく動作しているようです。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3492991/9f6e0a14-3dc8-0650-0ead-3227403ab44f.png)

ここまで実装してみて使用した料金を確認したところ$1.25と表示されていました。

### Bolt.new
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3492991/37cd645c-29b7-ae43-691a-5a36c7362e9f.png)
指示が適切でなかったのかコンソール上で動作するものを作成していたので追加で指示をしました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3492991/c95f560d-7a19-83e4-f25b-7b65e626d311.png)

`コンソール上で動作するものでなく、ボタンなどをクリックして動作するものを作成してください。`

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3492991/9aa40ac9-1946-5d10-f485-bbd81d200842.png)

せっかくなのでReplitと同じように履歴機能、メモリ機能、関数電卓機能を追加してもらいましょう。
`先ほど作成した電卓に関数電卓機能、メモリ機能、履歴機能を追加してください。`
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3492991/9cac1602-a0db-1c48-d8bd-011e71e8a57a.png)

freeプランでは一日150kトークンの制限がありますがここまで実装して使用したトークンは60Kトークンでした。

あくまでIDEなので画像のように生成されたもののディレクトリ閲覧やファイルの直接編集も可能
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3492991/7e09e8f5-f2f1-bbb1-da6b-3246d9ad47ab.png)

# 所感
今回は2つの生成AIを使用してみましたが、bolt.newは電卓のようなシンプルなアプリであれば無料のプランで実装可能なので限定的ではあるがプロトタイプの作成などに役立つと感じました。
逆にReplitに関しては、bolt.newでは収まらないような規模のアプリ開発に役立つと感じますが料金が少し高いようにも思います。
似たような機能を提供している2つのAIサービスですが場面によって使い分けることによってその利点を最大限に活用できると感じました。

# 参考記事
https://chatgpt-lab.com/n/nccc10e804eba#e8534a89-db02-4423-a3b2-1c1124aa3aae

https://sogyotecho.jp/bolt-new/