Free deploy in 5 minutes

You built something with AI. Now put it online — for free. This guide covers four solid free hosts, when to choose each, and exactly how to wire your TDSPRO key so your deployed app can call AI safely.

Which host should I pick?

Quick rule of thumb: Next.js → Vercel, static site or Vite → Netlify or Cloudflare Pages, a real backend server → Render. All four are free to start.

Deploy on Vercel

1. 1Push your project to a GitHub repo.
2. 2Go to vercel.com, sign in with GitHub, and click Add New → Project.
3. 3Pick your repo. Vercel auto-detects the framework — keep the defaults.
4. 4Open Settings → Environment Variables and add your key (next step).
5. 5Click Deploy. Every future git push redeploys automatically.

Add the environment variables Vercel will inject at build and runtime:

TDSPRO_BASE_URL=https://api.tdspro.lol/v1
TDSPRO_KEY=sk-hub-your-key-here

Then read them on the server. In a Next.js Route Handler:

import OpenAI from "openai";

const client = new OpenAI({
  baseURL: process.env.TDSPRO_BASE_URL,
  apiKey: process.env.TDSPRO_KEY,   // server-only — never exposed to the browser
});

export async function POST(req: Request) {
  const { prompt } = await req.json();
  const r = await client.chat.completions.create({
    model: "smart",
    messages: [{ role: "user", content: prompt }],
  });
  return Response.json({ text: r.choices[0].message.content });
}

Deploy on Netlify

1. 1Push to GitHub, then in Netlify click Add new site → Import an existing project.
2. 2Set the build command and publish directory (e.g. npm run build → dist).
3. 3Under Site settings → Environment variables, add TDSPRO_BASE_URL and TDSPRO_KEY.
4. 4Put AI calls in a Netlify Function so the key stays on the server.

import OpenAI from "openai";

const client = new OpenAI({
  baseURL: process.env.TDSPRO_BASE_URL,
  apiKey: process.env.TDSPRO_KEY,
});

export default async (req: Request) => {
  const { prompt } = await req.json();
  const r = await client.chat.completions.create({
    model: "fast",
    messages: [{ role: "user", content: prompt }],
  });
  return Response.json({ text: r.choices[0].message.content });
};

Deploy on Cloudflare Pages

1. 1In the Cloudflare dashboard go to Workers & Pages → Create → Pages and connect your repo.
2. 2Set your framework preset and build output directory.
3. 3Under Settings → Environment variables, add the two variables — mark the key as encrypted.
4. 4Use a Pages Function (a file in /functions) to call TDSPRO server-side.

// Cloudflare Pages Function — env is injected per request.
export const onRequestPost: PagesFunction<{
  TDSPRO_BASE_URL: string;
  TDSPRO_KEY: string;
}> = async ({ request, env }) => {
  const { prompt } = await request.json();
  const r = await fetch(env.TDSPRO_BASE_URL + "/chat/completions", {
    method: "POST",
    headers: {
      "Authorization": "Bearer " + env.TDSPRO_KEY,
      "Content-Type": "application/json",
    },
    body: JSON.stringify({
      model: "fast",
      messages: [{ role: "user", content: prompt }],
    }),
  });
  return new Response(await r.text(), {
    headers: { "Content-Type": "application/json" },
  });
};

Deploy on Render

1. 1In Render click New → Web Service and connect your repo.
2. 2Set the build command (npm install && npm run build) and start command (npm start).
3. 3Choose the Free instance type.
4. 4Open the Environment tab and add TDSPRO_BASE_URL and TDSPRO_KEY.

Why route through TDSPRO

• One key, 20+ models. Switch models by changing one string — no new accounts.
• Automatic fallback. If a model is busy, your request reroutes — your deployed app stays up.
• Token-saving cache. Repeat requests cost less, which matters when a demo goes viral.
• One bill, one dashboard. Watch usage from every deploy in a single place.