Quickstart Guide

Get WebDev running and deploy your first project in under 30 minutes.

Prerequisites

Before you begin, ensure you have:

• ✅ Server with Docker installed
• ✅ Domain name configured
• ✅ GitHub token with repo permissions
• ✅ Cloudflare API token

Step 1: Configure WebDev

Create your agent configuration:

cd ~/.openclaw/workspace

Create AGENTS.md

# Agent Guidelines

## Identity

You are WebDev, an autonomous software engineer agent.

## Environment

- OS: Ubuntu 24.04 LTS
- Node.js 22, pnpm, Docker
- Git configured for GitHub

## Key Directories

- Projects: ~/projects/
- Progress tracker: ~/projects/PROGRESS.json
- Logs: ~/logs/daily/

## Git Conventions

- Provider: GitHub
- Branches: main → develop → feature/\*
- Commits: Conventional Commits

Create SOUL.md

# WebDev Agent — SOUL

You are an autonomous senior software engineer.

## Operating Principles

1. NEVER commit directly to main
2. NEVER skip tests
3. NEVER hardcode secrets
4. ALWAYS follow Conventional Commits
5. ALWAYS handle errors explicitly
6. NEVER STOP PROGRESSING

Create HEARTBEAT.md

# Heartbeat

1. Read ~/projects/PROGRESS.json
2. If no active project → assign next from roadmap
3. If project in progress → continue working on it
4. If project complete → verify quality gates, then start next
5. Never stop

Step 2: Start WebDev

# Start the gateway
openclaw gateway start

# Verify it's running
openclaw status

You should see:

✓ Gateway running
✓ Sessions: 1 active
✓ Agent: WebDev (ready)

Step 3: Assign First Project

Send WebDev its first task via Telegram or chat:

Your first project is Portfolio Developer (Level 1.1).
- Repo: webdev-portfolio
- Subdomain: portfolio.yourdomain.dev
- Stack: Astro 5 + Tailwind CSS + MDX
- Start now.

What Happens Next?

WebDev will autonomously:

1. Planning (5-10 minutes)

• Create docs/DESIGN.md
• Create docs/ROADMAP.md
• Initialize Git repository
• Create GitHub repo via API

2. Scaffolding (5-10 minutes)

• Set up Astro project
• Configure Tailwind CSS
• Install linting tools (ESLint, Prettier)
• Set up Git hooks (Husky, commitlint)
• Configure TypeScript strict mode

3. Implementation (30-60 minutes)

• Create layouts and components
• Build pages (Home, About, Projects)
• Set up content collections
• Implement dark mode
• Ensure responsive design
• Make WCAG 2.1 AA compliant

4. Deployment (10-15 minutes)

• Create Dockerfile (multi-stage)
• Set up docker-compose
• Configure Nginx reverse proxy
• Generate SSL certificate (Let’s Encrypt)
• Deploy to subdomain
• Verify HTTPS access

5. Release (5 minutes)

• Run final quality checks
• Create CHANGELOG.md
• Merge develop → main
• Tag release (v1.0.0)
• Update PROGRESS.json

Monitoring Progress

Check Current Status

# View progress
cat ~/projects/PROGRESS.json

# View today's activity log
cat ~/logs/daily/$(date +%Y-%m-%d).md

# Check Git status
cd ~/projects/webdev-portfolio
git log --oneline --graph --all -10

Watch Live Deployment

# Follow Docker logs
cd ~/projects/webdev-portfolio
docker compose logs -f

# Check Nginx access
sudo tail -f /var/log/nginx/access.log

Expected Timeline

Verification

Once complete, verify your deployment:

1. Check GitHub

# View releases
open https://github.com/youruser/webdev-portfolio/releases

You should see:

• ✅ Tag v1.0.0
• ✅ Release notes with changelog
• ✅ All code in main branch

2. Check Live Site

# Test HTTPS
curl -I https://portfolio.yourdomain.dev

You should see:

• ✅ HTTP/2 200
• ✅ Valid SSL certificate
• ✅ Content-Type: text/html

3. Check Quality

cd ~/projects/webdev-portfolio

# TypeScript
pnpm type-check  # Should pass

# Linting
pnpm lint  # Should pass

# Build
pnpm build  # Should succeed

Common Issues

”DNS not resolving”

Wait 2-5 minutes for DNS propagation:

dig +short portfolio.yourdomain.dev
# Should show your server IP

“SSL certificate failed”

Ensure port 80 is accessible:

sudo ufw status
sudo ufw allow 80
sudo ufw allow 443

“Build fails”

Check Node version:

node --version  # Should be v22.x.x
pnpm --version  # Should be v10.x.x

Next Project

Once Project 1.1 completes, WebDev automatically:

1. Updates PROGRESS.json
2. Generates Level 1.2 proposal
3. Begins implementation immediately

What’s Next?

• Project Structure - Understanding WebDev’s organization
• Git Workflow - Branch strategy and commits
• Deployment Guide - Docker and Nginx details
• Troubleshooting - Solving common problems

Getting Help

If WebDev encounters issues:

1. Check logs: ~/logs/daily/$(date +%Y-%m-%d).md
2. Review PROGRESS.json for current state
3. Check GitHub Issues for known problems
4. Join Discord community for support