web-clone-cli

🌐 WebClone CLI ✨

🤖 A powerful command-line tool to clone websites and apply AI-powered changes with ease!

📑 Table of Contents

• ✨ Features
• 🔧 Prerequisites
• 📦 Installation
• ⚙️ Configuration
• 🚀 Usage
• 🛠️ Tools
• 🔍 Troubleshooting
• 🤝 Contributing
• 📄 License

✨ Features

🎯 Clone websites quickly and easily
Downloads the HTML, CSS, JavaScript, and images of any website with a single command

🤖 AI-powered website modifications
Uses OpenAI's GPT models to intelligently modify cloned websites based on your natural language instructions

💬 Interactive command-line interface
Provides an intuitive, user-friendly interface that makes website cloning accessible to everyone

🛠️ Comprehensive file manipulation tools
Offers a complete suite of tools for creating, reading, writing, and manipulating files and directories

🔄 Iterative refinement
Apply changes step-by-step, refining the output until you achieve exactly what you envision

🌍 Environment-based configuration
Simple setup using environment variables for API keys and model preferences

🔧 Prerequisites

Before you begin, ensure you have the following installed:

Requirement	Version	Download Link
🟢 Node.js	18+	nodejs.org
🥖 Bun	1.2.18+	bun.sh
🔑 OpenAI API Key	-	OpenAI Platform

📦 Installation

🚀 Quick Install (Recommended)

npm i -g web-clone-cli

🛠️ Development Setup

# Clone the repository
git clone https://github.com/ashu-dwd/web-clone-cli.git

# Navigate to the project directory
cd web-clone-cli

# Install dependencies
bun install

⚙️ Configuration

📝 Environment Setup

• Create environment file:

  touch .env
  

• Add your API credentials:

  # 🔑 Required: OpenAI Configuration
  OPENAI_API_KEY=your_openai_api_key_here
  OPENAI_MODEL_NAME=gpt-4o-mini
  
  # 🌟 Optional: Gemini Configuration (Future Updates)
  GEMINI_API_KEY=your_gemini_api_key_here
  GEMINI_MODEL_NAME=your_gemini_model_name
  

🔑 API Key Details

Variable	Description	Status
OPENAI_API_KEY	Your OpenAI API key for AI-powered modifications	✅ Required
OPENAI_MODEL_NAME	OpenAI model to use (recommended: gpt-4o-mini)	✅ Required
GEMINI_API_KEY	Gemini API key for future features	🔮 Optional
GEMINI_MODEL_NAME	Gemini model name for future features	🔮 Optional

💡 Pro Tip: Get your OpenAI API key from platform.openai.com

🚀 Usage

🎬 Getting Started

Launch the CLI and start creating:

webclone-cli

The interactive interface will guide you through the process! 🎯

💫 Example Commands

Here are some inspiring examples to get you started:

🎨 Design Changes
"Clone https://example.com and change the title to 'My Awesome Website'"
"Clone https://example.com and make the background a beautiful gradient"
"Clone https://example.com and add a modern dark theme"

🔧 Interactive Elements
"Clone https://example.com and add a button that says 'Click Me'"
"Clone https://example.com and add a contact form with validation"
"Clone https://example.com and create a responsive navigation menu"

🎪 Advanced Modifications
"Clone https://example.com and add smooth scrolling animations"
"Clone https://example.com and integrate a modern card layout"
"Clone https://example.com and add interactive hover effects"

🔄 Iterative Workflow

• Clone your target website 📥
• Describe your desired changes 💬
• Review the AI-generated modifications 👀
• Refine with additional changes 🔧
• Repeat until perfect! ✨

🛠️ Tools

Our comprehensive toolkit includes:

Tool	Purpose	Input	Output
📂 readDir	Browse directory contents	Directory path	File/folder list
📄 createFile	Create new files	File path	Success confirmation
✍️ writeFile	Write content to files	File path + content	Updated file
📁 createFolder	Create new directories	Folder path	New directory
📖 readFile	Read file contents	File path	File content
🌐 cloneWebsite	Clone entire websites	Website URL	Cloned site path

🎯 Tool Usage Examples

# 📂 Explore cloned website structure
readDir ./cloned-website

# ✍️ Modify specific files
writeFile ./cloned-website/index.html "<updated content>"

# 🌐 Clone your favorite website
cloneWebsite https://your-favorite-site.com

🔍 Troubleshooting

🚨 Common Issues & Solutions

Problem	Solution
🔴 CLI not working	✅ Verify all prerequisites are installed and environment variables are configured
🤖 AI not generating desired output	💡 Try rephrasing your request with more specific instructions or examples
🔑 Authentication errors	🔧 Double-check your API keys in the .env file
📦 Installation failures	🔄 Try clearing npm cache: npm cache clean --force

🆘 Need More Help?

• 📖 Check the documentation
• 🐛 Report bugs on GitHub Issues
• 💬 Join our community discussions

🤝 Contributing

We welcome contributions from the community! 🎉

🌟 How to Contribute

• 🍴 Fork the repository
• 🌿 Create a feature branch (git checkout -b feature/amazing-feature)
• ✍️ Commit your changes (git commit -m 'Add some amazing feature')
• 📤 Push to the branch (git push origin feature/amazing-feature)
• 🔀 Open a Pull Request

📋 Contribution Guidelines

• ✅ Use clear and concise commit messages
• 🎨 Follow the existing coding style
• 🧪 Write tests for your changes
• 📚 Update documentation as needed
• 🔍 Ensure your code passes all existing tests

🏆 Contributors

Thanks to all the amazing people who have contributed to this project!

📄 License

This project is licensed under the MIT License - see the LICENSE file for details.

🌟 Star this repo if you found it helpful!

Made with ❤️ by Raghvendra Dwivedi

🐛 Report Bug • ✨ Request Feature • 💬 Discussions

Happy cloning! 🚀