Vercel

What is Vercel?

Vercel is a hosting platform that makes it effortless to put a website or web app online. Instead of renting a server, installing software, and configuring infrastructure yourself, you connect your code repository (e.g. GitHub) to Vercel and it handles everything else — building your code, deploying it globally, and keeping it running.

This website (SimpleAI) runs on Vercel. Every time new content is added or a bug is fixed, the update is live within about 30 seconds of the code being pushed.

Vercel was built by the same team that created Next.js, the most popular React framework. As a result, Next.js projects work especially well on Vercel — but it supports dozens of other frameworks including plain HTML, Vue, Svelte, Astro, and more.

Why use Vercel instead of something else?

The short answer: speed and simplicity. Alternatives like AWS, Google Cloud, or DigitalOcean give you more control, but they require you to understand servers, networking, and DevOps. Vercel removes all of that. You write code; Vercel figures out the rest.

Free vs Pro

For personal projects, side businesses, and most small apps — the free tier is more than enough.

Step-by-step setup

Deploy your first project

1. Go to vercel.com and click Sign Up.
2. Sign in with GitHub (recommended — it lets Vercel pull your code automatically).
3. Click Add New → Project.
4. Select the GitHub repository you want to deploy.
5. Vercel detects your framework automatically (Next.js, React, etc.) and fills in the build settings.
6. Click Deploy.

That's it. Within a minute you'll have a live URL like your-project.vercel.app. Every time you push new code to GitHub, Vercel automatically rebuilds and redeploys.

Connect a custom domain

1. In your project dashboard, go to Settings → Domains.
2. Type in your domain name (e.g. simpleai.club) and click Add.
3. Vercel shows you two DNS records to add — a CNAME and an A record.
4. Log in to wherever you bought your domain (e.g. Namecheap, GoDaddy, Cloudflare), find the DNS settings, and add those records.
5. Come back to Vercel — the domain will show a green checkmark within a few minutes to a few hours (DNS propagation time varies).

Environment variables

When your website needs to use a secret — like an API key for OpenAI, Stripe, or a database — you should never put that secret directly in your code. If your code is on GitHub, anyone can read it.

Instead, you store secrets as environment variables in Vercel. Your code references them by name (e.g. process.env.OPENAI_API_KEY) but the actual value is kept private inside Vercel's dashboard.

How to add environment variables

1. Open your project in Vercel and go to Settings → Environment Variables.
2. Click Add.
3. Enter a Name (e.g. OPENAI_API_KEY) and the Value (your actual key).
4. Choose which environments it applies to: Production, Preview, or Development (or all three).
5. Click Save.
6. Redeploy your project — environment variables only take effect on new deployments.

Tip: Use separate API keys for Production and Preview environments. That way a mistake in a preview branch never touches your live data.

Preview deployments

Every time you push code to a non-main branch on GitHub, Vercel creates a preview deployment — a unique live URL just for that version of your code. You can share the link with a client, colleague, or tester before it goes live.

Example: you're redesigning your homepage. You create a branch called redesign and push your changes. Vercel gives you a URL like your-project-git-redesign-yourname.vercel.app. Your designer can click around on the actual live site, not a screenshot. When everyone's happy, you merge the branch and it goes live.

This is one of Vercel's most powerful features for teams and it costs nothing.

Serverless functions

Vercel lets you add serverless functions — small pieces of backend code that run on demand without a permanent server. In a Next.js project, any file inside src/app/api/ automatically becomes a serverless endpoint.

For example, the SimpleAI newsletter signup works like this: the frontend sends the email address to /api/subscribe, a serverless function adds it to the Resend mailing list, and the function exits. Vercel only charges for the milliseconds it actually ran — no server idling.

Serverless functions are perfect for:

• Processing form submissions
• Calling third-party APIs (so you don't expose API keys in the browser)
• Sending emails or notifications
• Writing to a database

Cron Jobs — scheduled automation

A Cron Job is a task that runs automatically on a schedule. Think of it like a calendar reminder for your server: "every Monday at 9am, send the newsletter."

Vercel Cron Jobs let you call any API route in your project on a schedule — no separate server or third-party service required.

How to set up a Cron Job on Vercel

Step 1 — Write an API route that does the work you want automated. In a Next.js project this is a file like src/app/api/cron/send-newsletter/route.ts. It just needs to export a GET function.

Step 2 — Add a vercel.json file to the root of your project:

{
  "crons": [
    {
      "path": "/api/cron/send-newsletter",
      "schedule": "0 9 * * 1"
    }
  ]
}

The schedule field uses cron syntax — a shorthand for time patterns:

Step 3 — Secure your endpoint. Vercel automatically sends an Authorization: Bearer <token> header when it calls your cron route. Add a secret check at the top of your handler to reject any calls that don't include it:

function isAuthorised(req: NextRequest) {
  const secret = process.env.CRON_SECRET;
  if (!secret) return true; // skip check in local dev
  return req.headers.get("authorization") === `Bearer ${secret}`;
}

Add CRON_SECRET as an environment variable in Vercel (any long random string). Vercel sets it automatically in the header when it triggers the cron.

Step 4 — Deploy. Push your code. Vercel reads vercel.json and registers the schedule. You can verify it's active under Settings → Cron Jobs in your project dashboard.

Free plan note: Cron Jobs on the free (Hobby) plan have a minimum interval of once per day. More frequent schedules (hourly, every 15 minutes) require a Pro plan.

How SimpleAI uses Cron Jobs

SimpleAI runs two automated cron jobs:

• Daily at 8am UTC — Scans HackerNews for AI product launches, sends the results to Claude AI to identify genuine releases, and saves them to a database. This is what keeps the What's New page fresh without anyone manually updating it.

• Every Monday at 9am UTC — Fetches the top AI news from the past 7 days, asks Claude to pick the 4 most interesting stories and write plain-English summaries, then sends the weekly newsletter to all subscribers via Resend.

Both jobs run entirely automatically. No one presses a button.

Edge functions

Vercel also supports Edge Functions — a faster version of serverless functions that run at Vercel's global edge network locations (closer to the user) rather than a single data centre. They start up in milliseconds rather than the ~100ms cold-start time of regular serverless functions.

Edge functions are best for:

• Personalisation (e.g. showing different content based on location)
• Authentication checks
• Redirects and rewrites

For most projects you'll never need edge functions — serverless functions handle the vast majority of use cases.

Vercel Analytics

Vercel includes a basic analytics dashboard showing page views, unique visitors, and top pages. It works without cookies, so it's privacy-friendly and doesn't require a cookie banner.

For more detailed analytics (heatmaps, funnels, session recordings), you'd integrate a third-party tool like PostHog or Plausible. But for a starting point, Vercel's built-in analytics tells you what you need to know.

Vercel vs alternatives

Pick Vercel if you're building with Next.js or any modern JavaScript framework and want deployment to be as simple as possible. Pick Netlify if you prefer their UI or need their specific features. Use GitHub Pages only for static HTML with no backend logic.

Common questions

Do I need to know how to code to use Vercel? No — if you're using a tool like Bolt or Lovable to build your site, those tools can deploy directly to Vercel for you. You just need a GitHub account.

What happens if my site gets a lot of traffic suddenly? Vercel scales automatically. You won't need to do anything — it just handles it (up to the limits of your plan).

Can I roll back a broken deployment? Yes. Every deployment is saved. In your project dashboard, go to the Deployments tab, find an earlier version, and click Promote to Production.

How do I test a Cron Job without waiting for the schedule? Make a GET request to the API route directly — either in your browser, with a tool like Postman, or with curl. Include the Authorization: Bearer <your-secret> header if you have a secret set.