AI News HubLIVE
サイト内リライト2 分で読了

AIウェブサイトクローナーテンプレート:AIコーディングエージェントで任意のウェブサイトをクローン

AIコーディングエージェントを使用して任意のウェブサイトを最新のNext.jsコードベースに逆工学するための再利用可能なテンプレート。Claude Code、Cursor、Copilotなど複数のエージェントに対応。偵察、基盤設定、コンポーネント仕様、並行ビルド、品質保証の多段階パイプラインを提供。

ソースHacker News AI著者: vantareed

「AIウェブサイトクローナーテンプレート」というオープンソースプロジェクトがGitHubで大きな注目を集めています。このプロジェクトは、AIコーディングエージェントを使用して既存のウェブサイトを分析し、最新のNext.jsコードベースに再構築するための再利用可能なテンプレートを提供します。核となる機能は「1つのコマンドで任意のウェブサイトをクローンする」ことです。

このテンプレートには /clone-website というマルチステージパイプラインが組み込まれています。まず偵察フェーズでは、スクリーンショット、デザイントークンの抽出、およびインタラクション(スクロール、クリック、ホバー、レスポンシブ)のスイープを通じてターゲットサイトを徹底的に調査します。次に基盤フェーズでフォント、色、グローバルスタイルを更新し、すべてのアセットをダウンロードします。その後、コンポーネント仕様ファイルを作成し、正確な計算済みCSS値、状態、動作、コンテンツを記述します。最後に、Gitワークツリーで各コンポーネントを並行ビルドし、マージ後、元のサイトとの視覚的差分を確認して品質を保証します。

対応するAIエージェントはClaude Code(Opus 4.7推奨)、Codex CLI、Cursor、Windsurf、GitHub Copilotなど10種類以上。ユーザーはGitHubの「Use this template」ボタンから自分のリポジトリを作成し、npm install を実行した後、AIエージェントを起動して /clone-website <URL> コマンドを入力するだけでクローンを開始できます。

技術スタックはNext.js 16(App Router)、React 19、TypeScript(厳格モード)、Tailwind CSS v4(oklchデザイントークン)、shadcn/uiコンポーネントライブラリです。クローン時には抽出したSVGアイコンがデフォルトアイコンと置き換えられ、画像や動画も自動的にダウンロードされます。

開発者は主なユースケースとして、WordPress/Webflow/Squarespaceからのプラットフォーム移行、失われたソースコードの復旧(サイトは稼働中だがリポジトリがない場合)、およびプロダクションサイトのレイアウトやアニメーションを学ぶための学習を挙げています。同時に、このツールはフィッシング、なりすまし、商標侵害、または利用規約違反の目的で使用してはならないと明記されています。

プロジェクトはMITライセンスで公開され、GitHubで19.6k以上のスターと2.9kのフォークを獲得しています。最新バージョンはv0.3.1で、活発なコミュニティに支えられています。