JCodesMore/ai-website-cloner-template

解決する問題

このプロジェクトは、AIコーディングエージェントが既存のウェブサイトを最新のクリーンなNext.jsアプリケーションとして再現するための構造化環境を提供します。レガシーサイトの移行、失われたソースコードの復元、または学習目的での本番品質のレイアウトとアニメーションの分解を支援するように設計されています。

仕組み

専用のエージェントスキル（/clone-website）を使用し、AIエージェントを4つのステップでガイドします：ソースサイトの構造のマッピング、異なるデバイスでのデザインとアセットの観察、Next.jsとTailwind CSSを使用したサイトの構築、そして視覚的および機能的な忠実性を確保するためのオリジナルとの比較。

対象者

AIエージェント（Claude Code、Cursor、OpenCodeなど）を活用して、ウェブサイトを最新の保守可能なReactベースのスタックに再構築する面倒なプロセスを自動化したい開発者とデザイナー。

ハイライト

• エージェントファーストのワークフロー： エージェントが簡単なコマンドでクローン処理を実行できるようにする専用のスキル定義が含まれています。
• 最新のテクノロジースタック： Next.js 16、React 19、TypeScript、Tailwind CSS v4を使用したコードを出力します。
• 構造化された出力： アセット、コンポーネント、調査ドキュメントをクリーンでモジュール化されたプロジェクト構造に整理します。
• 検証ツール： クローンされたサイトの品質を確保するための、リンティング、型チェック、本番ビルド用の組み込みコマンドが含まれています。