はじめに
前回はCursorの基本的な機能についてご紹介しました(前回の記事はこちらから)。今回は実践ということでCursorによってゲームを作成、動作確認を行ってみたいと思います。
Reactによる三目並べ
Reactのチュートリアルにもある三目並べゲームをCursorで実装してみます。
Cursorのチュートリアルのフォルダにある、index.jsにコードを書いてみます。Chat機能より、以下のように実装を依頼してみます。
コードとともに実装内容の説明が出力されました。Applyしてみます。
Applyし、index.jsにコードを反映しました。コマンドラインから、npm startで実際に動かしてみます。
生成されたコードを実行すると、ブラウザで以下のようなエラーが発生しました。
Cursorに修正依頼を出します。
修正を反映後、ブラウザ側のエラーが解消しました。
軽く動作確認を行い、正しく動作することが確認できました。
少し仕様変更を行い、ターンごとの入力を記録できるようにします。
仕様変更が反映されました。
最後に
今回はReactによる三目並べゲームを作ってみましたが、作成からエラーの修正、仕様変更を含めても、数分でゲームを作成することが出来ました。
引き続き、Cursorでどのようなことが出来るのか。今後も検証を進めてみたいと思います。