diff --git a/src/app/hosting/cloud/page.tsx b/src/app/hosting/cloud/page.tsx new file mode 100644 index 00000000..6ac39459 --- /dev/null +++ b/src/app/hosting/cloud/page.tsx @@ -0,0 +1,741 @@ +"use client"; + +import { useState } from "react"; +import Link from "next/link"; + +interface CloudPlatform { + id: string; + name: string; + icon: string; + tagline: string; + pros: string[]; + cons: string[]; + pricing: { + tier: string; + cost: string; + includes: string[]; + }[]; + quickStart: { + title: string; + steps: string[]; + code?: string; + }; +} + +const platforms: CloudPlatform[] = [ + { + id: "aws", + name: "Amazon Web Services", + icon: "☁️", + tagline: "Enterprise-grade cloud with maximum control and scaling", + pros: [ + "Massive ecosystem with 200+ services", + "Best-in-class scaling and reliability", + "Strong enterprise support and compliance", + "Extensive documentation and community", + ], + cons: [ + "Complex pricing model", + "Steep learning curve", + "Can be expensive without optimization", + "Overwhelming number of options", + ], + pricing: [ + { + tier: "EC2 t3.micro", + cost: "$0.0104/hour (~$7.50/mo)", + includes: ["1 vCPU", "1 GB RAM", "Moderate network", "EBS storage extra"], + }, + { + tier: "EC2 t3.small", + cost: "$0.0208/hour (~$15/mo)", + includes: ["2 vCPU", "2 GB RAM", "Good for production", "Better network"], + }, + { + tier: "Lambda", + cost: "Free tier: 1M requests/mo", + includes: ["Pay per execution", "400k GB-seconds/mo free", "Auto-scaling"], + }, + ], + quickStart: { + title: "Deploy to AWS EC2 with Terraform", + steps: [ + "Install AWS CLI and Terraform", + "Configure AWS credentials", + "Create Terraform configuration", + "Deploy infrastructure", + "Set up continuous deployment", + ], + code: `# terraform/main.tf +provider "aws" { + region = "us-west-2" +} + +resource "aws_instance" "agent" { + ami = "ami-0c55b159cbfafe1f0" # Ubuntu 22.04 + instance_type = "t3.small" + + user_data = <<-EOF + #!/bin/bash + apt-get update + apt-get install -y docker.io + docker run -d --restart=always \\ + -e ANTHROPIC_API_KEY=\${ANTHROPIC_API_KEY} \\ + your-agent-image:latest + EOF + + tags = { + Name = "ai-agent" + } +} + +resource "aws_security_group" "agent" { + ingress { + from_port = 443 + to_port = 443 + protocol = "tcp" + cidr_blocks = ["0.0.0.0/0"] + } + + egress { + from_port = 0 + to_port = 0 + protocol = "-1" + cidr_blocks = ["0.0.0.0/0"] + } +} + +# Deploy +# terraform init +# terraform plan +# terraform apply`, + }, + }, + { + id: "gcp", + name: "Google Cloud Platform", + icon: "🔵", + tagline: "Serverless-first cloud with excellent developer experience", + pros: [ + "Best serverless container platform (Cloud Run)", + "Generous free tier", + "Simple, predictable pricing", + "Excellent documentation", + ], + cons: [ + "Smaller ecosystem than AWS", + "Fewer regions globally", + "Less enterprise adoption", + "Some services less mature", + ], + pricing: [ + { + tier: "Cloud Run", + cost: "First 2M requests/mo free", + includes: ["Pay per use", "Auto-scaling to zero", "Built-in SSL", "Container-based"], + }, + { + tier: "Compute Engine e2-micro", + cost: "$6.11/month", + includes: ["0.25-2 vCPU", "1 GB RAM", "Always-free tier eligible"], + }, + { + tier: "Cloud Functions", + cost: "2M invocations/mo free", + includes: ["400k GB-seconds free", "Event-driven", "Auto-scaling"], + }, + ], + quickStart: { + title: "Deploy to Cloud Run in 5 minutes", + steps: [ + "Install gcloud CLI", + "Authenticate with GCP", + "Build container image", + "Deploy to Cloud Run", + "Get HTTPS URL instantly", + ], + code: `# Install gcloud +curl https://sdk.cloud.google.com | bash + +# Authenticate +gcloud auth login +gcloud config set project YOUR_PROJECT_ID + +# Build and deploy +gcloud run deploy ai-agent \\ + --source . \\ + --region us-central1 \\ + --allow-unauthenticated \\ + --set-env-vars ANTHROPIC_API_KEY=sk-xxx + +# You get an HTTPS URL immediately! +# https://ai-agent-xxx.run.app + +# Dockerfile +FROM node:20-alpine +WORKDIR /app +COPY package*.json ./ +RUN npm install +COPY . . +CMD ["npm", "start"]`, + }, + }, + { + id: "azure", + name: "Microsoft Azure", + icon: "🔷", + tagline: "Enterprise cloud with strong Microsoft ecosystem integration", + pros: [ + "Best for Microsoft stack (Active Directory, .NET)", + "Strong compliance and enterprise features", + "Good for hybrid cloud scenarios", + "Competitive pricing with reserved instances", + ], + cons: [ + "Complex portal interface", + "Steeper learning curve than GCP", + "Some documentation gaps", + "Pricing can be confusing", + ], + pricing: [ + { + tier: "Container Instances", + cost: "$0.0000125/vCPU-second + $0.0000014/GB-second", + includes: ["Pay per second", "Fast startup", "No cluster management"], + }, + { + tier: "VM B1s", + cost: "$7.59/month", + includes: ["1 vCPU", "1 GB RAM", "Linux VM", "Good for small agents"], + }, + { + tier: "Functions", + cost: "1M executions/mo free", + includes: ["400k GB-seconds free", "Event-driven", "Multiple triggers"], + }, + ], + quickStart: { + title: "Deploy to Azure Container Instances", + steps: [ + "Install Azure CLI", + "Login to Azure", + "Create resource group", + "Deploy container", + "Access via public IP", + ], + code: `# Install Azure CLI +brew install azure-cli # macOS +# or: curl -sL https://aka.ms/InstallAzureCLIDeb | sudo bash + +# Login +az login + +# Create resource group +az group create --name agent-rg --location westus2 + +# Deploy container +az container create \\ + --resource-group agent-rg \\ + --name ai-agent \\ + --image your-registry/agent:latest \\ + --cpu 1 --memory 1 \\ + --restart-policy Always \\ + --environment-variables \\ + ANTHROPIC_API_KEY=sk-xxx + +# Get IP +az container show \\ + --resource-group agent-rg \\ + --name ai-agent \\ + --query ipAddress.ip`, + }, + }, + { + id: "railway", + name: "Railway", + icon: "🚂", + tagline: "Zero-config deployment for developers who just want things to work", + pros: [ + "Simplest deployment experience", + "Git-based automatic deployments", + "Built-in databases and services", + "Great for indie hackers", + ], + cons: [ + "Limited to 500 hours/mo on free tier", + "Less control over infrastructure", + "Smaller community", + "Can be pricey at scale", + ], + pricing: [ + { + tier: "Hobby", + cost: "$5/month + usage", + includes: ["$5 credit/mo", "Unlimited projects", "512 MB RAM default", "Auto SSL"], + }, + { + tier: "Pro", + cost: "$20/month + usage", + includes: ["$20 credit/mo", "Priority support", "Team collaboration", "More resources"], + }, + ], + quickStart: { + title: "Deploy to Railway (easiest option!)", + steps: [ + "Sign up at railway.app", + "Install Railway CLI", + "Initialize project", + "Deploy with one command", + "Get URL automatically", + ], + code: `# Install Railway CLI +npm install -g @railway/cli +# or: brew install railway + +# Login +railway login + +# Initialize (in your project directory) +railway init + +# Link to project +railway link + +# Deploy +railway up + +# That's it! You get: +# - Automatic HTTPS +# - Environment variables UI +# - Zero-downtime deploys +# - Built-in monitoring + +# Set environment variables +railway variables set ANTHROPIC_API_KEY=sk-xxx + +# View logs +railway logs`, + }, + }, + { + id: "flyio", + name: "Fly.io", + icon: "🪰", + tagline: "Deploy to the edge for global low-latency access", + pros: [ + "Global edge deployment", + "Excellent for WebSocket apps", + "Simple pricing and billing", + "Great developer experience", + ], + cons: [ + "Smaller than major clouds", + "Limited to containerized apps", + "Fewer managed services", + "New platform (less mature)", + ], + pricing: [ + { + tier: "Free tier", + cost: "$0", + includes: ["3 shared-cpu VMs", "3GB storage", "160GB bandwidth/mo"], + }, + { + tier: "Paid", + cost: "~$5-15/month", + includes: ["Per-resource pricing", "Auto-scaling", "Global deployment"], + }, + ], + quickStart: { + title: "Deploy to Fly.io for global edge access", + steps: [ + "Install flyctl CLI", + "Sign up and login", + "Launch app (auto-generates config)", + "Deploy globally", + "Scale to multiple regions", + ], + code: `# Install flyctl +curl -L https://fly.io/install.sh | sh + +# Login +flyctl auth login + +# Launch app (creates fly.toml) +flyctl launch +# Answer prompts: app name, region, etc. + +# Deploy +flyctl deploy + +# Scale to multiple regions for global edge +flyctl regions add iad lhr syd hkg +flyctl scale count 3 + +# Set secrets +flyctl secrets set ANTHROPIC_API_KEY=sk-xxx + +# Monitor +flyctl status +flyctl logs + +# Your app is now running globally!`, + }, + }, + { + id: "lambda", + name: "AWS Lambda (Serverless)", + icon: "λ", + tagline: "Event-driven functions with zero infrastructure management", + pros: [ + "Pay only for execution time", + "Automatic scaling to zero", + "Integrates with entire AWS ecosystem", + "Generous free tier (1M requests/mo)", + ], + cons: [ + "Cold start latency (1-5 seconds)", + "15-minute max execution time", + "Complex for long-running agents", + "State management challenges", + ], + pricing: [ + { + tier: "Free tier", + cost: "1M requests/month free", + includes: ["400k GB-seconds compute free", "Forever free tier"], + }, + { + tier: "Paid", + cost: "$0.20 per 1M requests", + includes: ["+ $0.0000166667/GB-second compute", "Pay per millisecond"], + }, + ], + quickStart: { + title: "Serverless Agent with AWS Lambda", + steps: [ + "Install Serverless Framework", + "Create serverless.yml config", + "Write Lambda handler", + "Deploy to AWS", + "Trigger via API Gateway or events", + ], + code: `# Install Serverless Framework +npm install -g serverless + +# Create project +serverless create --template aws-nodejs --path agent-lambda +cd agent-lambda + +# serverless.yml +service: ai-agent +provider: + name: aws + runtime: nodejs20.x + environment: + ANTHROPIC_API_KEY: \${env:ANTHROPIC_API_KEY} + +functions: + agent: + handler: handler.agent + events: + - http: + path: agent + method: post + timeout: 300 # 5 minutes + +# handler.js +export const agent = async (event) => { + const { prompt } = JSON.parse(event.body); + // Your agent logic here + return { + statusCode: 200, + body: JSON.stringify({ response: "..." }) + }; +}; + +# Deploy +serverless deploy + +# Invoke +serverless invoke -f agent --data '{"prompt": "Hello"}'`, + }, + }, + { + id: "vercel", + name: "Vercel Functions", + icon: "▲", + tagline: "Serverless functions optimized for Next.js and edge deployment", + pros: [ + "Perfect for Next.js agents", + "Edge functions for low latency", + "Instant deployments", + "Excellent developer experience", + ], + cons: [ + "10-second timeout on hobby plan", + "Optimized for frontend, not long-running tasks", + "Can be expensive at scale", + "Limited to HTTP triggers", + ], + pricing: [ + { + tier: "Hobby", + cost: "$0/month", + includes: ["100GB bandwidth", "Serverless functions", "Edge functions", "1000 builds/mo"], + }, + { + tier: "Pro", + cost: "$20/month", + includes: ["1TB bandwidth", "Longer timeouts", "Team collaboration", "Analytics"], + }, + ], + quickStart: { + title: "Deploy Next.js agent to Vercel", + steps: [ + "Create Next.js app with agent routes", + "Add Vercel configuration", + "Connect GitHub repo", + "Deploy automatically on push", + "Access via Vercel URL", + ], + code: `# Create Next.js app +npx create-next-app@latest agent-app +cd agent-app + +# Create API route: app/api/agent/route.ts +import Anthropic from "@anthropic-ai/sdk"; + +export async function POST(request: Request) { + const { prompt } = await request.json(); + + const anthropic = new Anthropic({ + apiKey: process.env.ANTHROPIC_API_KEY, + }); + + const message = await anthropic.messages.create({ + model: "claude-3-5-sonnet-20241022", + max_tokens: 1024, + messages: [{ role: "user", content: prompt }], + }); + + return Response.json({ response: message.content }); +} + +# Install Vercel CLI +npm install -g vercel + +# Deploy +vercel + +# Or connect GitHub and deploy on push +# Set env vars in Vercel dashboard`, + }, + }, +]; + +export default function CloudHostingPage() { + const [selectedPlatform, setSelectedPlatform] = useState("railway"); + + const platform = platforms.find((p) => p.id === selectedPlatform) || platforms[3]; + + return ( +
+ {/* Hero */} +
+ + ← Back to Hosting Overview + +

☁️ Cloud Deployment Guide

+

+ Step-by-step guides for deploying agents to AWS, GCP, Azure, Railway, Fly.io, and serverless + platforms +

+
+ + {/* Platform Selector */} +
+
+ {platforms.map((p) => ( + + ))} +
+
+ + {/* Platform Details */} +
+
+ {/* Header */} +
+
{platform.icon}
+

{platform.name}

+

{platform.tagline}

+
+ + {/* Pros & Cons */} +
+
+

✅ Pros

+
    + {platform.pros.map((pro, i) => ( +
  • + • + {pro} +
    • + ))} +
+
+ +
+

⚠️ Cons

+
    + {platform.cons.map((con, i) => ( +
  • + • + {con} +
    • + ))} +
+
+
+ + {/* Pricing */} +
+

💰 Pricing

+
+ {platform.pricing.map((tier, i) => ( +
+

{tier.tier}

+

{tier.cost}

+
    + {tier.includes.map((item, j) => ( +
  • + • + {item} +
    • + ))} +
+
+ ))} +
+
+ + {/* Quick Start */} +
+

🚀 {platform.quickStart.title}

+ +
+

Steps:

+
    + {platform.quickStart.steps.map((step, i) => ( +
  1. + + {i + 1} + + {step} +
    2. + ))} +
+
+ + {platform.quickStart.code && ( +
+

Code:

+ 
+                  {platform.quickStart.code}
+
+
+ )} +
+
+
+ + {/* Cost Calculator */} +
+
+

📊 Cost Estimation Calculator

+

+ Rough monthly cost estimates for different agent workloads: +

+ +
+
+
Workload
+
Specs
+
Est. Cost
+
+ +
+
Light (personal assistant)
+
512 MB RAM, low traffic
+
$5-10/mo
+
+ +
+
Medium (team agent)
+
1-2 GB RAM, moderate traffic
+
$15-30/mo
+
+ +
+
Heavy (production)
+
4 GB RAM, high availability
+
$50-100/mo
+
+ +
+
Serverless (sporadic)
+
On-demand, <1M requests/mo
+
Free - $5/mo
+
+
+ +

+ * Estimates vary by platform, region, and API costs. Always check current pricing. +

+
+
+ + {/* Next Steps */} +
+
+ +
🐳
+

Containerize Your Agent

+

+ Learn Docker best practices for deploying agents +

+ + + +
🔒
+

Secure Your Deployment

+

+ Production security checklist and best practices +

+ +
+
+
+ ); +} diff --git a/src/app/hosting/local/page.tsx b/src/app/hosting/local/page.tsx new file mode 100644 index 00000000..2802cbe7 --- /dev/null +++ b/src/app/hosting/local/page.tsx @@ -0,0 +1,657 @@ +"use client"; + +import { useState } from "react"; +import Link from "next/link"; + +interface LocalSetup { + id: string; + name: string; + icon: string; + tagline: string; + requirements: { + os: string[]; + cpu: string; + ram: string; + storage: string; + }; + pros: string[]; + cons: string[]; + installation: { + steps: string[]; + code: string; + }; +} + +const setups: LocalSetup[] = [ + { + id: "openclaw", + name: "OpenClaw", + icon: "💻", + tagline: "Full-featured local agent runtime with desktop UI and deep system integration", + requirements: { + os: ["macOS 11+", "Linux (Ubuntu 20.04+)", "Windows 10+ (WSL2)"], + cpu: "2+ cores recommended", + ram: "4 GB minimum, 8 GB recommended", + storage: "1 GB for base install, 5+ GB with models", + }, + pros: [ + "Rich desktop UI with GUI controls", + "Deep system integration (files, camera, clipboard)", + "Built-in session management", + "Zero API costs (local models supported)", + "Perfect for personal use and development", + ], + cons: [ + "Requires local machine to be on", + "Limited to single machine (no cloud sync)", + "Resource-intensive when running models locally", + "Mac/Linux focused (Windows via WSL)", + ], + installation: { + steps: [ + "Download OpenClaw CLI", + "Initialize workspace", + "Configure API keys or local models", + "Start the gateway", + "Access via desktop UI or CLI", + ], + code: `# Install OpenClaw (macOS/Linux) +curl -fsSL https://openclaw.ai/install.sh | sh + +# Or with Homebrew (macOS) +brew install openclaw/tap/openclaw + +# Initialize workspace +openclaw init ~/my-agents +cd ~/my-agents + +# Configure (create .env or use openclaw config) +export ANTHROPIC_API_KEY="sk-ant-..." +# Or use local models: +# export OLLAMA_HOST="http://localhost:11434" + +# Start the gateway +openclaw gateway start + +# Check status +openclaw status + +# Create your first agent +cat > AGENTS.md << 'EOF' +# My First Agent + +I'm a personal assistant agent that helps with: +- Task management +- Research +- File organization +- Daily summaries +EOF + +# Start a session +openclaw chat + +# Or use the desktop UI +open http://localhost:4200`, + }, + }, + { + id: "langchain", + name: "LangChain", + icon: "🔗", + tagline: "Python framework for building custom agent workflows and chains", + requirements: { + os: ["Any (Python 3.8+)"], + cpu: "2+ cores", + ram: "2 GB minimum, 4 GB for complex agents", + storage: "500 MB+ for dependencies", + }, + pros: [ + "Maximum flexibility and customization", + "Huge ecosystem of integrations", + "Strong community and documentation", + "Great for research and experimentation", + ], + cons: [ + "Requires Python coding knowledge", + "More setup and boilerplate", + "Less polished than turnkey solutions", + "No built-in UI (must build your own)", + ], + installation: { + steps: [ + "Install Python 3.8+", + "Create virtual environment", + "Install LangChain and dependencies", + "Write agent code", + "Run locally", + ], + code: `# Install Python dependencies +python3 -m venv venv +source venv/bin/activate # On Windows: venv\\Scripts\\activate + +# Install LangChain +pip install langchain langchain-anthropic + +# Create agent script: agent.py +from langchain_anthropic import ChatAnthropic +from langchain.agents import AgentExecutor, create_tool_calling_agent +from langchain.tools import Tool +from langchain_core.prompts import ChatPromptTemplate + +# Initialize LLM +llm = ChatAnthropic( + model="claude-3-5-sonnet-20241022", + api_key="sk-ant-..." +) + +# Define tools +def search_web(query: str) -> str: + """Search the web for information.""" + # Implement your search logic + return f"Results for: {query}" + +tools = [ + Tool( + name="web_search", + func=search_web, + description="Search the web for information" + ) +] + +# Create agent +prompt = ChatPromptTemplate.from_messages([ + ("system", "You are a helpful AI assistant."), + ("human", "{input}"), + ("placeholder", "{agent_scratchpad}"), +]) + +agent = create_tool_calling_agent(llm, tools, prompt) +agent_executor = AgentExecutor(agent=agent, tools=tools) + +# Run agent +response = agent_executor.invoke({ + "input": "What's the weather like today?" +}) +print(response["output"]) + +# Run it +# python agent.py`, + }, + }, + { + id: "autogen", + name: "AutoGen", + icon: "🤖", + tagline: "Multi-agent conversation framework from Microsoft Research", + requirements: { + os: ["Any (Python 3.8+)"], + cpu: "2+ cores", + ram: "4 GB for multi-agent systems", + storage: "500 MB+", + }, + pros: [ + "Built for multi-agent collaboration", + "Great for complex problem-solving", + "Strong code generation capabilities", + "Active Microsoft support", + ], + cons: [ + "More complex than single-agent frameworks", + "Requires understanding of agent roles", + "Can be resource-intensive", + "Documentation still maturing", + ], + installation: { + steps: [ + "Install Python 3.8+", + "Install AutoGen", + "Configure agent roles", + "Define conversation patterns", + "Run multi-agent system", + ], + code: `# Install AutoGen +pip install pyautogen + +# Create multi-agent system: team.py +import autogen + +config_list = [{ + "model": "claude-3-5-sonnet-20241022", + "api_key": "sk-ant-...", + "api_type": "anthropic" +}] + +# Define agents +assistant = autogen.AssistantAgent( + name="assistant", + llm_config={"config_list": config_list} +) + +user_proxy = autogen.UserProxyAgent( + name="user_proxy", + human_input_mode="NEVER", + code_execution_config={"work_dir": "coding"} +) + +# Start conversation +user_proxy.initiate_chat( + assistant, + message="Write a Python script to analyze CSV data" +) + +# Run it +# python team.py`, + }, + }, + { + id: "raspberry-pi", + name: "Raspberry Pi", + icon: "🥧", + tagline: "Low-power always-on agent server for home automation and personal use", + requirements: { + os: ["Raspberry Pi OS (Debian-based)"], + cpu: "Raspberry Pi 4 (2GB+) recommended", + ram: "2 GB minimum, 4 GB for production", + storage: "16 GB SD card minimum, 32 GB+ recommended", + }, + pros: [ + "Very low power consumption (~5W)", + "Always-on without high electricity bills", + "Perfect for home automation agents", + "Cheap hardware (~$50-100)", + ], + cons: [ + "Limited compute power", + "Not suitable for large models", + "SD card reliability issues", + "Requires some Linux knowledge", + ], + installation: { + steps: [ + "Flash Raspberry Pi OS", + "Set up SSH access", + "Install Docker or Python environment", + "Deploy agent", + "Configure auto-start on boot", + ], + code: `# SSH into your Raspberry Pi +ssh pi@raspberrypi.local + +# Update system +sudo apt update && sudo apt upgrade -y + +# Install Docker (recommended) +curl -fsSL https://get.docker.com -o get-docker.sh +sudo sh get-docker.sh +sudo usermod -aG docker pi + +# Or install Python environment +sudo apt install python3-pip python3-venv -y + +# Deploy agent with Docker +docker run -d --restart=always \\ + --name agent \\ + -e ANTHROPIC_API_KEY=sk-ant-... \\ + -v /home/pi/agent-data:/data \\ + your-agent-image:latest + +# Or with systemd service +sudo cat > /etc/systemd/system/agent.service << 'EOF' +[Unit] +Description=AI Agent +After=network.target + +[Service] +Type=simple +User=pi +WorkingDirectory=/home/pi/agent +ExecStart=/home/pi/agent/venv/bin/python agent.py +Restart=always + +[Install] +WantedBy=multi-user.target +EOF + +sudo systemctl enable agent +sudo systemctl start agent + +# Monitor +docker logs -f agent +# or +sudo journalctl -u agent -f`, + }, + }, +]; + +const platformTips = [ + { + platform: "macOS", + icon: "🍎", + tips: [ + "Use Homebrew for easy installation: `brew install openclaw`", + "Grant Terminal full disk access in System Preferences → Privacy", + "Use `caffeinate` to prevent sleep during long-running tasks", + "Docker Desktop works great for containerized agents", + "Raycast/Alfred integration for quick agent access", + ], + }, + { + platform: "Linux", + icon: "🐧", + tips: [ + "Ubuntu 22.04+ LTS recommended for stability", + "Use systemd for auto-starting agents on boot", + "Consider running headless with tmux/screen for persistence", + "Docker is native and performs better than macOS", + "Use ufw for basic firewall protection", + ], + }, + { + platform: "Windows", + icon: "🪟", + tips: [ + "Use WSL2 (Windows Subsystem for Linux) for best compatibility", + "Install Docker Desktop with WSL2 backend", + "PowerShell can run agents natively with some frameworks", + "Use Windows Terminal for better CLI experience", + "Task Scheduler for auto-start on boot", + ], + }, +]; + +export default function LocalHostingPage() { + const [selectedSetup, setSelectedSetup] = useState("openclaw"); + + const setup = setups.find((s) => s.id === selectedSetup) || setups[0]; + + return ( +
+ {/* Hero */} +
+ + ← Back to Hosting Overview + +

💻 Local Setup Guide

+

+ Run agents locally with full control, zero cloud costs, and complete privacy +

+
+ + {/* Setup Selector */} +
+
+ {setups.map((s) => ( + + ))} +
+
+ + {/* Setup Details */} +
+
+ {/* Header */} +
+
{setup.icon}
+

{setup.name}

+

{setup.tagline}

+
+ + {/* System Requirements */} +
+

💾 System Requirements

+
+
+ Operating Systems: +
+ {setup.requirements.os.map((os, i) => ( +
• {os}
+ ))} +
+
+
+
+ CPU: +
{setup.requirements.cpu}
+
+
+ RAM: +
{setup.requirements.ram}
+
+
+ Storage: +
{setup.requirements.storage}
+
+
+
+
+ + {/* Pros & Cons */} +
+
+

✅ Advantages

+
    + {setup.pros.map((pro, i) => ( +
  • + • + {pro} +
    • + ))} +
+
+ +
+

⚠️ Limitations

+
    + {setup.cons.map((con, i) => ( +
  • + • + {con} +
    • + ))} +
+
+
+ + {/* Installation */} +
+

🚀 Installation & Setup

+ +
+

Steps:

+
    + {setup.installation.steps.map((step, i) => ( +
  1. + + {i + 1} + + {step} +
    2. + ))} +
+
+ +
+

Commands:

+ 
+                {setup.installation.code}
+
+
+
+
+
+ + {/* Platform-Specific Tips */} +
+

💡 Platform-Specific Tips

+
+ {platformTips.map((platform) => ( +
+
+
{platform.icon}
+

{platform.platform}

+
+
    + {platform.tips.map((tip, i) => ( +
  • + → + {tip} +
    • + ))} +
+
+ ))} +
+
+ + {/* Networking & Access */} +
+
+

🌐 Networking & Remote Access

+

+ Access your local agent from anywhere with tunnels and port forwarding +

+ +
+
+

Option 1: ngrok (Easiest)

+ 
+{`# Install ngrok
+brew install ngrok  # or download from ngrok.com
+
+# Expose local port
+ngrok http 3000
+
+# You get a public URL like:
+# https://abc123.ngrok.io → http://localhost:3000`}
+
+
+ +
+

Option 2: Cloudflare Tunnel (Free)

+ 
+{`# Install cloudflared
+brew install cloudflare/cloudflare/cloudflared
+
+# Create tunnel
+cloudflared tunnel create my-agent
+
+# Route traffic
+cloudflared tunnel route dns my-agent agent.yourdomain.com
+
+# Run tunnel
+cloudflared tunnel run my-agent`}
+
+
+ +
+

Option 3: Tailscale (Private Network)

+ 
+{`# Install Tailscale
+brew install tailscale
+
+# Connect to your tailnet
+sudo tailscale up
+
+# Access from any device on your tailnet:
+# http://:3000`}
+
+
+
+
+
+ + {/* Monitoring */} +
+
+

📊 Monitoring & Health Checks

+ +
+
+

Check if agent is running:

+ 
+{`# OpenClaw
+openclaw status
+
+# Docker
+docker ps | grep agent
+
+# Python/systemd
+ps aux | grep agent
+systemctl status agent`}
+
+
+ +
+

View logs:

+ 
+{`# OpenClaw
+openclaw logs --follow
+
+# Docker
+docker logs -f agent
+
+# systemd
+journalctl -u agent -f`}
+
+
+ +
+

Resource usage:

+ 
+{`# System stats
+htop  # or: top
+
+# Docker stats
+docker stats agent
+
+# Disk usage
+df -h`}
+
+
+
+
+
+ + {/* Next Steps */} +
+
+ +
🐳
+

Containerize Your Agent

+

+ Package your local agent for easy deployment anywhere +

+ + + +
📖
+

Agent Configuration

+

+ Learn how to configure and customize your agent +

+ +
+
+
+ ); +} diff --git a/src/app/hosting/page.tsx b/src/app/hosting/page.tsx new file mode 100644 index 00000000..dbe85356 --- /dev/null +++ b/src/app/hosting/page.tsx @@ -0,0 +1,446 @@ +"use client"; + +import Link from "next/link"; +import { useState } from "react"; + +interface HostingOption { + name: string; + type: "local" | "cloud" | "serverless"; + icon: string; + description: string; + costRating: 1 | 2 | 3 | 4 | 5; + scalingRating: 1 | 2 | 3 | 4 | 5; + complexityRating: 1 | 2 | 3 | 4 | 5; + bestFor: string[]; + link: string; +} + +const hostingOptions: HostingOption[] = [ + { + name: "OpenClaw Local", + type: "local", + icon: "💻", + description: "Run agents locally on your machine with full control and zero cloud costs", + costRating: 1, + scalingRating: 2, + complexityRating: 2, + bestFor: ["Personal use", "Development", "Privacy-first", "Offline capability"], + link: "/hosting/local#openclaw", + }, + { + name: "LangChain Local", + type: "local", + icon: "🔗", + description: "Python-based agent framework for local development and prototyping", + costRating: 1, + scalingRating: 2, + complexityRating: 3, + bestFor: ["Python developers", "Rapid prototyping", "Research", "Custom workflows"], + link: "/hosting/local#langchain", + }, + { + name: "AWS EC2/ECS", + type: "cloud", + icon: "☁️", + description: "Scalable cloud hosting with full infrastructure control on AWS", + costRating: 3, + scalingRating: 5, + complexityRating: 4, + bestFor: ["Production", "Enterprise", "High availability", "Custom scaling"], + link: "/hosting/cloud#aws", + }, + { + name: "Google Cloud Run", + type: "cloud", + icon: "🔵", + description: "Serverless containers on GCP with automatic scaling and zero-config SSL", + costRating: 2, + scalingRating: 5, + complexityRating: 3, + bestFor: ["Containerized agents", "Pay-per-use", "Quick deployment", "Auto-scaling"], + link: "/hosting/cloud#gcp", + }, + { + name: "Azure Container Instances", + type: "cloud", + icon: "🔷", + description: "Fast container deployment on Azure with integrated Microsoft services", + costRating: 3, + scalingRating: 4, + complexityRating: 3, + bestFor: ["Microsoft ecosystem", "Enterprise", "Compliance", "Hybrid cloud"], + link: "/hosting/cloud#azure", + }, + { + name: "Railway", + type: "cloud", + icon: "🚂", + description: "Simple platform for deploying agents with Git-based deployments", + costRating: 2, + scalingRating: 3, + complexityRating: 1, + bestFor: ["Indie hackers", "Quick deployment", "Git workflow", "Side projects"], + link: "/hosting/cloud#railway", + }, + { + name: "Fly.io", + type: "cloud", + icon: "🪰", + description: "Edge-deployed containers with global distribution and low latency", + costRating: 2, + scalingRating: 4, + complexityRating: 2, + bestFor: ["Edge computing", "Global users", "Low latency", "WebSocket apps"], + link: "/hosting/cloud#flyio", + }, + { + name: "AWS Lambda", + type: "serverless", + icon: "λ", + description: "Event-driven serverless functions with pay-per-execution pricing", + costRating: 1, + scalingRating: 5, + complexityRating: 4, + bestFor: ["Event-driven", "Microservices", "Cost optimization", "Burst traffic"], + link: "/hosting/cloud#lambda", + }, + { + name: "Vercel Functions", + type: "serverless", + icon: "▲", + description: "Serverless functions optimized for Next.js and edge deployment", + costRating: 2, + scalingRating: 4, + complexityRating: 2, + bestFor: ["Next.js agents", "Web interfaces", "Edge functions", "Quick setup"], + link: "/hosting/cloud#vercel", + }, + { + name: "Raspberry Pi", + type: "local", + icon: "🥧", + description: "Low-power home server for always-on agents on a budget", + costRating: 1, + scalingRating: 1, + complexityRating: 3, + bestFor: ["Home automation", "Always-on", "Energy efficient", "Learning"], + link: "/hosting/local#raspberry-pi", + }, +]; + +const RATING_LABELS = { + cost: ["Very Low", "Low", "Moderate", "High", "Very High"], + scaling: ["Limited", "Basic", "Good", "Excellent", "Elite"], + complexity: ["Easy", "Simple", "Moderate", "Complex", "Expert"], +}; + +function RatingBar({ rating, type }: { rating: number; type: "cost" | "scaling" | "complexity" }) { + const colorMap = { + cost: rating <= 2 ? "bg-emerald-500" : rating === 3 ? "bg-amber-500" : "bg-rose-500", + scaling: rating >= 4 ? "bg-emerald-500" : rating === 3 ? "bg-amber-500" : "bg-gray-500", + complexity: rating <= 2 ? "bg-emerald-500" : rating === 3 ? "bg-amber-500" : "bg-rose-500", + }; + + return ( +
+
+ {[1, 2, 3, 4, 5].map((i) => ( +
+ ))} +
+ {RATING_LABELS[type][rating - 1]} +
+ ); +} + +export default function HostingPage() { + const [filterType, setFilterType] = useState<"all" | "local" | "cloud" | "serverless">("all"); + + const filteredOptions = hostingOptions.filter( + (option) => filterType === "all" || option.type === filterType + ); + + const webPageJsonLd = { + "@context": "https://schema.org", + "@type": "WebPage", + name: "Agent Hosting & Deployment — forAgents.dev", + description: + "Comprehensive guide to hosting AI agents: local setups, cloud platforms, containers, and serverless. Compare options and find the best deployment strategy.", + url: "https://foragents.dev/hosting", + }; + + return ( +
+