Communityライティング&編集github.com

Waiel5/website-replicator

Claude Codeスキル:任意の本番Webサイトをピクセル単位の精度でAstro 6 + Tailwind v4に再現します。11フェーズ、28の文書化された落とし穴、並列エージェントディスパッチ機能。

website-replicator とは?

Waiel5/website-replicator は、Claude Code用の高度なスキルで、あらゆる本番WebサイトをAstro 6とTailwind v4を使用してピクセル完全に再現します。このスキルは11の明確に定義されたフェーズで構成され、28の文書化された落とし穴を網羅し、並列エージェントディスパッチを活用してレプリケーションを効率化します。開発者は、複雑なWebサイトを正確に再現し、元のデザインと機能を維持しながら、最新の静的サイトジェネレーターとCSSフレームワークの利点を活用できます。このスキルは、サイト全体の構造分析、コンポーネントの分解、レスポンシブデザインの調整、パフォーマンス最適化を自動化し、手動でのコーディング作業を大幅に削減します。特に、一貫性のある高品質なレプリケーション結果を必要とするプロジェクトや、迅速なプロトタイピングと本番環境への移行を目指すチームに適しています。

対応✓Claude Code~Codex CLI~Cursor
npx skills add Waiel5/website-replicator

Installed? Explore more ライティング&編集 skills: steipete/notion, langchain-ai/langchain, bytedance/podcast-generation · View all 6 →

お気に入りのAIに質問する

このエージェントスキルを事前に読み込んだ状態で新しいチャットを開きます。

ドキュメント

website-replicator は何をしますか?

Claude Codeスキル:任意の本番Webサイトをピクセル単位の精度でAstro 6 + Tailwind v4に再現します。11フェーズ、28の文書化された落とし穴、並列エージェントディスパッチ機能。

概要

このスキルは、指定された本番WebサイトをAstro 6とTailwind v4を使用して正確に複製するための包括的なフレームワークを提供します。11のフェーズに分かれており、各フェーズはレプリケーションの特定の側面をカバーし、28の文書化された落とし穴を回避するのに役立ちます。並列エージェントディスパッチにより、複数のコンポーネントやページを同時に処理し、全体的なパフォーマンスを向上させます。

機能

  • ピクセル完全な再現: 元のWebサイトのデザインを正確に複製します。
  • Astro 6 + Tailwind v4: 最新の静的サイトジェネレーターとCSSフレームワークを活用。
  • 11フェーズ: 構造分析からデプロイまで、段階的なプロセス。
  • 28の文書化された落とし穴: 一般的な問題を事前に回避。
  • 並列エージェントディスパッチ: 効率的なタスク処理。

使用方法

  1. Claude Codeを起動し、スキルを有効にします。
  2. レプリケーションするターゲットWebサイトのURLを指定します。
  3. スキルが自動的にフェーズを実行し、結果を生成します。

注意事項

  • 元のWebサイトの著作権と利用規約を尊重してください。
  • 複製は学習および開発目的に限定します。
  • 大量のデータ転送やリクエストが発生する可能性があるため、適切なレート制限を考慮してください。

関連スキル