OpenAIがGPT-4.1をリリースし、すぐさまCursorは「肌感を掴んでもらうために当面は無料で提供します」と利用可能のモデルにこれを追加しました。(Xのポストを参照)

OpenAIの発表によると、コーディング能力が向上したり長文コンテキストの処理能力や理解力が改善したということです。さっそくCursorで触ってみます。

Vibe codingやるぞ

対話1: とりあえず作り切らせる

ごく簡単なCRUDを持つアプリケーションを要求します。今回作るのは旅行とかで作成する持ち物リストを管理するためのアプリケーションです。

以下のプロンプトから開始します。

プロンプト
旅行の持ち物リストを管理するアプリケーションを作ってみて。とりあえず最後まで作り切ってみて。
  
- ログイン機能は不要  
- ユーザーは持ち物の追加、削除、編集ができる  
- データは永続化されるが、デモアプリなので簡易的な手段を選択して良い(SQLiteなど)  
- テンプレートを追加できる(財布など行き先に関係なく必ず持っていくようなものをまとめることができる)  
- カバンに入れたかどうかの状態をcheckboxで管理できる  
- おしゃれでモダンなUI

で、特に躓くことなくここまではコーディングしてくれました。

バックエンドはexpress, sqlite3、フロントエンドはvite, typescript, react, emotion, muiというスタックを選択したようです。

npm create vite@latest . -- --template react-ts でプロジェクトを開始した際に作成された index.css により color-schema が dark になっており、そのせいで見づらいようです。

しかしちゃんとデータの永続化はできていますね。(画像の入力値はこちらで入れたもの)

プロンプト
> すべてのテーブルの中身を標準出力して
 
全テーブル(items, templates, template_items)の中身は以下の通りです。
 
---
 
### items テーブル
 
| id | name | packed |
|----|-----------|--------|
| 3 | test | 0 |
| 4 | hogehoge | 0 |
 
### templates テーブル
 
| id | name |
|----|----------------|
| 1 | testとhogehoge |
 
### template_items テーブル
 
| template_id | name | packed |
|-------------|-----------|--------|
| 1 | test | 0 |
| 1 | hogehoge | 0 |
 

対話2: ブラッシュアップする

プロンプト
ちゃんと動いているようです。以下についてブラッシュアップしてください。  
  
- create viteしたときに生成された余計なファイルが残っています
	- 不要なものは消してください
	- 特に、index.cssが影響して、OSがダークモードのユーザーは視認性がとても悪いです  
- UIがダサすぎるのでもっとモダンなwebサービスっぽくして  
- タイトルをもっといい感じに考えて

結果が以下の通り。割と良いのではないでしょうか?

対話3: ちょっとだけ難しそうなことを言ってみる

限定的なコンテキストしか持たないのでしょうがないんですが、他のシステムに依存するとうまくいかないことが多いので、geminiのAPIを利用するように促してみます。

プロンプト
backend/.env に、 GEMINI_API_KEY という命名でgeminiのAPIキーを追加しました。  
これで、行き先と泊数を入力したら、持ち物リストを提案してくれて、それを編集して適用できるような機能を追加してください。

結果は以下。一発では無理だったのでここからデバッグさせます。

デバッグのやり取りは何往復もしたので載せませんが。。

流れとしては、

  1. backendの必要な依存関係をインストールしていなかった
  2. geminiの存在しないモデルを指定していた
  3. geminiに与えるプロンプトがおかしかった

という感じでした。2の解決は結局できず、人間が修正しました。

対話3の完成形は以下のとおりです。良いのではないでしょうか。

 

まだClaudeやgeminiの最上位と比較してどうかは評価しきれませんが、そんなに悪くなさそうなのでちょっと使ってみようと思います。

最終形のコードベースはこちらです。

GitHub - tachibanayu24/gpt-4.1-test

(おまけ)うざかったところ

今回 cursor ruleとか特に設定せずに素手でやったので、ちゃんとやれば防げるんでしょうけど。

  • 人間が修正したところを何回も戻そうとする
  • すぐ迷子になって cd: no such file or directory
  • nodeをkillすな!