Cursor + Claude Sonnet の初めての体験
Cursor を IDE として使用し、Claude 3.5 Sonnet を使用してソフトウェアを開発したのは初めての経験
皆さんはこれまでに Cursor に関連するものについて聞いたことがある、または少なくとも見たことがあると思います。そうでない場合は、独自のドキュメントに従って、それが何であるかを簡単に説明します。
カーソルは VS Code のフォークです。これにより、使い慣れたテキスト編集エクスペリエンスを提供しながら、AI を使用したコーディングの最適な方法の作成に集中できます。
要約すると、Cursor はソフトウェア開発における AI の使用に直接リンクされた統合と機能を備えた IDE です。
そうは言っても、私の経験を見てみましょう :)
ここにリポジトリへのリンクを残しておきます: Game of Life
私の経歴
私の経験をより深く理解していただくために、結果と最終的な考慮事項に関連する可能性のある情報をここに残しておきます。
- 私はソフトウェア開発者で、特にフロントエンドの開発に 5 年の経験があります
- 私はコンピューター サイエンスの学位を取得しています
- 私は AI に関係する Github Copilot 以外の IDE レベルの拡張機能を使用したことがありません
- はい、私は日常生活で ChatGPT を使用しています (これについてはいくつかの点がありますが、それは次の投稿にします)
あらゆる経験と同様に、ルールを定義する必要があります:
AI が生成したコードの提案を受け入れることが必須です
コミュニケーション言語として英語を使用します
バグの解決策を見つけたり、生成されたものの品質を向上させるためにコードを変更することはできません
目的
指摘されたことをすべてテストするために、目的は、Angular 17 を使用して Jhon Cornway の「Game of Life」のインタラクティブ バージョンを実装することです (はい、このバージョンはこの記事の内容に関連しています)
人生ゲーム
ライフ ゲームはセル オートマトンであり、いくつかの定義されたルールがあります。
- 2 つまたは 3 つの生きている隣接セルを持つ生きたセルは生き続けます。
- 生存している隣接セルが 2 つ未満の生存セルは死亡します。
- 3 つ以上の隣接セルが存在する生存セルが死亡します。
- ちょうど 3 つの生存している隣接セルを持つ死んだセルが生きます。
プロンプト
前述したように、対話全体で使用された言語は英語であり、次のようなコマンドが直接かつ明確に与えられました。
画面の全幅と高さのグリッドに「ライフ ゲーム」を実装します。
グリッドをランダム化するボタンと開始するボタンを追加します
シミュレーション。スタイルにはAngularマテリアルを使用してください
重要: テストの少し後にこの記事を書こうと決めましたが、コマンドと結果の履歴を失ってしまったため、書いた内容を 100% 伝えることはできません。これにより、各コマンドの結果が存在しないことが説明されます。指示。ただし、このプロジェクトの次のステップと進化についてはフォローアップするつもりです。
コード生成ごとに、すべてを受け入れて実行し、レイアウト調整、マージン、バグなどの修正を依頼しました。
コードの品質
コードが完璧であるとは言えませんが、読みやすく理解可能なコードが常に生成されているので、必要に応じて介入して、生成されたコードを修正/改善できることは簡単に言えます。
バグ/問題
私たち生身のプログラマーと同じように、AI もバグを生成します。私の最初の接触も例外ではありませんでした。レイアウト内の要素の配置 (ボタンの統計や可視性など) に多くの問題があり、グリッドと主要な色にいくつかの問題がありました。パターン検出システムが機能しません (ただし、は次のステップとしてリストされています)。
問題はあったものの、生成されたコードは信頼性が高く、要求されたものは解決されましたが、あちこちでいくつかの調整が必要でした。ライフ ゲームのルールはすべて、何の問題も調整の必要もなく実装されたことは、強調する価値があります。
時間
まだショートカットに慣れ、プロンプトを実行するいくつかの方法をテストしていることを考慮すると、プロジェクト全体に費やした時間は 1 時間 30 分もかからなかったと思います。また、これはそれほど複雑なプロジェクトではありませんが、同じ方法で実装するには (楽観的に見て) 少なくとも 2 倍の時間が必要になります。
良い点
- 高速コード生成
- 各コマンドにコンテキストを柔軟に追加できるため、バグの修正、関数の作成、気づかなかった問題の検索がはるかに簡単になります
- 動作するコード:)
- VSCode ベースの IDE なので、日常生活で使用するすべてのものを簡単にインポートできます
マイナスポイント
- いくつかの問題 (主にレイアウトに関連する) を解決するのはまだ困難です
- コードは機能しますが、一部の実装にはまだ改善の余地があります
結論
私は、作成されたすべての品質に非常に驚き、非常に満足しています。テストの生成、単純なバグの修正、MVP の作成、および概念は単純なので、コードの品質が満足できるように調整する必要があります。
次のステップ
最初のプロトタイプが作成されたので、次のステップは、このプロジェクトの新しい機能を作成することです (パターン検出を修正し、ロジック ゲートなどの事前実装されたパターンを追加したいと考えています)。さらに、自分がマスターしていないテクノロジー (ただし、Three.js のように学びたい) を使用してアプリケーションを作成し、コードを受け入れるだけでなく、生成されたものの品質を調整および改善して、本当の可能性を理解します。
ああ、v0 がどのように動作するのかも見てみたいです (とても面白そうです)。
再度、Github 上のリポジトリへのリンク: Game of Life。
ここまで読んでくださった方、ありがとうございます :)
今後の投稿のためのレビューや提案をここに残してください
以上がCursor + Claude Sonnet の初めての体験の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ホットAIツール

Undresser.AI Undress
リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover
写真から衣服を削除するオンライン AI ツール。

Undress AI Tool
脱衣画像を無料で

Clothoff.io
AI衣類リムーバー

Video Face Swap
完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

人気の記事

ホットツール

メモ帳++7.3.1
使いやすく無料のコードエディター

SublimeText3 中国語版
中国語版、とても使いやすい

ゼンドスタジオ 13.0.1
強力な PHP 統合開発環境

ドリームウィーバー CS6
ビジュアル Web 開発ツール

SublimeText3 Mac版
神レベルのコード編集ソフト(SublimeText3)

ホットトピック











さまざまなJavaScriptエンジンは、各エンジンの実装原則と最適化戦略が異なるため、JavaScriptコードを解析および実行するときに異なる効果をもたらします。 1。語彙分析:ソースコードを語彙ユニットに変換します。 2。文法分析:抽象的な構文ツリーを生成します。 3。最適化とコンパイル:JITコンパイラを介してマシンコードを生成します。 4。実行:マシンコードを実行します。 V8エンジンはインスタントコンピレーションと非表示クラスを通じて最適化され、Spidermonkeyはタイプ推論システムを使用して、同じコードで異なるパフォーマンスパフォーマンスをもたらします。

Pythonは、スムーズな学習曲線と簡潔な構文を備えた初心者により適しています。 JavaScriptは、急な学習曲線と柔軟な構文を備えたフロントエンド開発に適しています。 1。Python構文は直感的で、データサイエンスやバックエンド開発に適しています。 2。JavaScriptは柔軟で、フロントエンドおよびサーバー側のプログラミングで広く使用されています。

C/CからJavaScriptへのシフトには、動的なタイピング、ゴミ収集、非同期プログラミングへの適応が必要です。 1)C/Cは、手動メモリ管理を必要とする静的に型付けられた言語であり、JavaScriptは動的に型付けされ、ごみ収集が自動的に処理されます。 2)C/Cはマシンコードにコンパイルする必要がありますが、JavaScriptは解釈言語です。 3)JavaScriptは、閉鎖、プロトタイプチェーン、約束などの概念を導入します。これにより、柔軟性と非同期プログラミング機能が向上します。

Web開発におけるJavaScriptの主な用途には、クライアントの相互作用、フォーム検証、非同期通信が含まれます。 1)DOM操作による動的なコンテンツの更新とユーザーインタラクション。 2)ユーザーエクスペリエンスを改善するためにデータを提出する前に、クライアントの検証が実行されます。 3)サーバーとのリフレッシュレス通信は、AJAXテクノロジーを通じて達成されます。

現実世界でのJavaScriptのアプリケーションには、フロントエンドとバックエンドの開発が含まれます。 1)DOM操作とイベント処理を含むTODOリストアプリケーションを構築して、フロントエンドアプリケーションを表示します。 2)node.jsを介してRestfulapiを構築し、バックエンドアプリケーションをデモンストレーションします。

JavaScriptエンジンが内部的にどのように機能するかを理解することは、開発者にとってより効率的なコードの作成とパフォーマンスのボトルネックと最適化戦略の理解に役立つためです。 1)エンジンのワークフローには、3つの段階が含まれます。解析、コンパイル、実行。 2)実行プロセス中、エンジンはインラインキャッシュや非表示クラスなどの動的最適化を実行します。 3)ベストプラクティスには、グローバル変数の避け、ループの最適化、constとletsの使用、閉鎖の過度の使用の回避が含まれます。

PythonとJavaScriptには、コミュニティ、ライブラリ、リソースの観点から、独自の利点と短所があります。 1)Pythonコミュニティはフレンドリーで初心者に適していますが、フロントエンドの開発リソースはJavaScriptほど豊富ではありません。 2)Pythonはデータサイエンスおよび機械学習ライブラリで強力ですが、JavaScriptはフロントエンド開発ライブラリとフレームワークで優れています。 3)どちらも豊富な学習リソースを持っていますが、Pythonは公式文書から始めるのに適していますが、JavaScriptはMDNWebDocsにより優れています。選択は、プロジェクトのニーズと個人的な関心に基づいている必要があります。

開発環境におけるPythonとJavaScriptの両方の選択が重要です。 1)Pythonの開発環境には、Pycharm、Jupyternotebook、Anacondaが含まれます。これらは、データサイエンスと迅速なプロトタイピングに適しています。 2)JavaScriptの開発環境には、フロントエンドおよびバックエンド開発に適したnode.js、vscode、およびwebpackが含まれます。プロジェクトのニーズに応じて適切なツールを選択すると、開発効率とプロジェクトの成功率が向上する可能性があります。
