ai_gallery
1.0.0
英語| 中文
私のAI-ASSISTED Web Development Projectへようこそ！フロントエンドの知識が最小限（HTMLとCSSのほんの少し）があるにもかかわらず、Claude 3.5とGPT-4の助けを借りて、いくつかの興味深いコンポーネントを作成することができました。これらのコンポーネントをこのショーケースサイトに統合しました。自分でそれを探索して体験してください！
私は言わなければならない、AIは私たちがコードを書く方法を本当に変えた。
このプロジェクトは、静的サイト生成（SSG）にReactとNextJSを使用して構築され、Netlifyに展開されます。自動サイトマップ生成、Googleアナリティクス統合、I18Nの国際化のサポートを備えています。現在、ギャラリーにはいくつかの興味深いコンポーネントが含まれており、AI支援を継続的に追加する予定です。
アルゴリズム：BFSパスファインディング、A*検索、Dijkstraのアルゴリズム、HEAP操作などの古典的なアルゴリズムのインタラクティブな視覚化を調査します。
ゲーム：Gomoku（5つの連続）、中国のチェス、テトリス、2048年などのクラシックゲームの実装。
その他のコンポーネント：データ視覚化のための動的チャートを含むさまざまな興味深いウィジェット。
これらのコンポーネントの改善に貢献できることを歓迎します。フロントエンドの技術的背景がない場合でも心配しないでください。AIを活用してアイデアを実現できます。このプロジェクトをローカルに実行するための簡単な手順は次のとおりです。
git clone [email protected]:selfboot/ai_gallery.git
cd ai_gallery
pnpm install
pnpm dev
http://localhost:3000にアクセスしてプロジェクトを表示します。途中で問題が発生した場合は、AIを使用してそれらを解決してみてください！
ウェブ開発の経験がない初心者として、私はこのプロジェクトのAI支援開発を通じて多くの実用的な知識を学びました。私がいつも作りたいと思っていた視覚化を最終的に作成することは非常に充実しています。
GPT-4およびClaude 3.5は、完全に能力がある仮想メンターおよびペアプログラミングパートナーであることが証明されています。事前の反応開発の経験がなくても、彼らは私が反応の概念をすばやく把握し、複雑なロジックを実装し、魅力的なUIを作成し、根本的な原則を理解するのを助けました。優れたプログラミングアシスタントであり、ベストプラクティス、デザインパターン、最適化技術を迅速に導入しています。彼らはさまざまな挑戦的な問題を解決するのに役立ち、最高のメンターのタイトルを獲得します。
AIには、推論能力にいくつかの幻覚と制限があります。 AIに生成されたコードにバグが含まれたり、プロジェクトの要件を完全に満たしていない場合もあれば、提供された説明が十分に明確でない場合もあります。これらの状況では、自分で問題をデバッグして解決する必要があります。
最も効果的なアプローチは、AIを共同ツールとして使用し、その膨大な知識と個人的な創造性とプロジェクト固有の理解を組み合わせて、興味深い作業をより速く、より良く完了することです。
これらは個人的な意見であり、参照のみです。両方のAIモデルは、このプロジェクトで重要な役割を果たし、それぞれに独自の強みがありました。私は通常、クイックプロトタイピングにはClaude 3.5を使用し、詳細な問題を解決するためにGPT-4を使用します。
