Why This Method Works?

Most peoples think Vercel only hosts static websites like React or Next.js, but with ServerlessWP (open-source tool), we can run WordPress as serverless app. Vercel’s free tier gives 100GB bandwidth/month and serverless functions – perfect for low-traffic blogs. No need to pay for hosting or databases!

What You Need?

• ServerlessWP (GitHub Link) – Converts WordPress to serverless app
• Free MySQL Database – We use Lade.io (no credit card)
• Vercel Account – Free tier works
• Basic terminal knowledge

Step 1: Get Free MySQL Database (Lade.io)

Why Lade.io? Unlike planetscale or AWS, Lade allows public database access for free. Follow steps carefully:

1.1 Install Lade CLI

Open terminal (Linux/Mac) and run:

# For Linux:
curl -L https://github.com/lade-io/lade/releases/latest/download/lade-linux-amd64.tar.gz | tar xz
sudo mv lade /usr/local/bin

# For Mac:
brew install lade-io/tap/lade

This installs Lade’s command-line tool. sudo is needed to move file to system path.

1.2 Create Lade Account

Go to lade.io and signup with email. No credit card required.

1.3 Login via Terminal

lade login
? Username or email: your@email.com
? Password: **********

Use same email/password as Lade website. If stuck, check Lade docs.

1.4 Create MySQL Database

lade addons create mysql --name wordpressdb

When asked:

• Plan: Choose Free tier (128MB RAM, 1GB storage)
• Region: Pick closest to you (e.g., us-east)
• Version: MySQL 8.0+

Wait 2 minutes. Then get connection details:

lade addons show wordpressdb

Note the URI like mysql://user:password@host:port/dbname. You’ll need this later.

Step 2: Deploy ServerlessWP to Vercel

2.1 Fork ServerlessWP Repository

Go to ServerlessWP GitHub and click “Deploy to Vercel”. This auto-forks repo to your account.

2.2 Connect Vercel Account

If new to Vercel, signup with GitHub. Free plan includes:

• 100GB bandwidth/month
• Serverless functions (10 sec timeout)
• Unlimited static sites

2.3 Add Environment Variables

During deployment, Vercel will ask for these:

• MYSQL_USERNAME: From Lade URI (user)
• MYSQL_PASSWORD: From Lade URI (password)
• MYSQL_HOST: Combine host + port (e.g., ladedb123.lade.app:3306)
• MYSQL_DATABASE: Database name (dbname)

Note: Never share these details publicly!

Step 3: Fix Configuration Errors

After deployment, WordPress may show “Error establishing database connection”. Fix this:

3.1 Change Node.js Version

Go to Vercel Dashboard → Project Settings → General:

• Set Node.js Version to 18.x (ServerlessWP needs v18+)

3.2 Adjust Function Region

In Project Settings → Functions:

• Set Function Region to match Lade database (e.g., us-east)
• Change Function Max Duration from 10s → 25s

3.3 Fix Database Collation

Edit wp-config.php in your GitHub repo:

// Replace line 46 with:
define( 'DB_COLLATE', 'utf8mb4_general_ci' );

This matches Lade’s MySQL collation settings.

3.4 Redeploy

Go to Vercel → Deployments → Redeploy. Wait 3-5 minutes.

Step 4: Final Setup

Visit your Vercel domain (e.g., your-site.vercel.app). You’ll see:

• WordPress installation page
• Set admin username/password
• Choose theme/plugins

Pro Tip: To use custom domain:

1. Buy domain from Cloudflare/GoDaddy
2. In Vercel → Domains → Add domain
3. Update DNS records as instructed

Common Issues & Fixes

• Error 504 Timeout: Increase “Function Max Duration” to 25s
• Database Connection Failed: Double-check MYSQL_HOST format (host:port)
• White Screen: Redeploy project after changing Node.js version

Limitations

• No email support (use SMTP plugins like WP Mail SMTP)
• File uploads limited to 4.5MB (Vercel’s free tier limit)
• No cron jobs (use external services like cron-job.org)