Going live — Kalme Next.js

Before the site goes public, replace the demo’s details and pictures and point the form at you; then deploy it to any host that runs Next.js and check it once more on the live address.

Before you deploy

	Where
Your domain in site.url	src/content/site.ts — share links, sitemap.xml and robots.txt are built from it
Name, title, description	src/content/site.ts
Contact details (hello@example.com, the phone number and the address are placeholders)	contact in src/content/site.ts
Your booking link instead of https://cal.com/	footer.action and cta.actions in src/content/site.ts, action in src/content/pages/service.ts
Social links	socials in src/content/site.ts
Logo replaced	public/images/logo.svg, logo-white.svg
Browser icons replaced	src/app/icon.svg, src/app/apple-icon.png
Share image replaced and described	public/opengraph-image.png, its description in src/lib/meta.ts
Demo text and photos replaced	src/content/pages/, src/content/collections/, public/images/
The three videos replaced (or removed)	Editing the content
Prices and what they include	plans of each service in src/content/collections/services.ts
Page titles and descriptions written for your business	the meta of each file in src/content/pages/, the legal descriptions in legal.ts
Terms of Service and Privacy Policy replaced with your own	src/content/collections/legal.ts
The form delivers to you	Forms
Style guide kept or deleted	src/app/style-guide/
npm run build passes	—

The demo content is there to be replaced: leaving “Kalme”, the sample address or the sample case studies on a live site is the most common mistake. The legal texts are examples, not legal advice — have yours written or reviewed for your country.

Deploy

The site is a normal Next.js app: it builds to pre-rendered pages and runs on Node.js, so any host that supports Next.js works.

Vercel (made by the Next.js team, free for personal sites)

1. Push the project to GitHub, GitLab or Bitbucket.
2. https://vercel.com/new → import the repository → Deploy. The framework, build command and output are detected.
3. Add your form variables under Settings → Environment Variables, then redeploy.
4. Settings → Domains → add your domain and follow the DNS instructions.

Netlify

Import the repository, keep the detected settings (npm run build), add the environment variables, deploy.

Cloudflare Workers

Use @opennextjs/cloudflare (npx opennextjs-cloudflare build), then deploy with Wrangler. Cloudflare’s docs walk through it; the template needs no change.

Your own server

npm ci
npm run build
npm start          # listens on port 3000

Run it under a process manager (pm2, systemd) behind nginx or Caddy for TLS, or in a container — node:20-alpine, copy the project, build, CMD ["npm", "start"].

After it is live

1. Check the pages. Click through every page on a phone and a laptop: the menu, the services accordion, the pricing switch on a service page, the videos, the Contact form.
2. Send yourself a submission from the live site and reply to it.
3. Verify the share card. Paste the URL of the home page and of a project into https://www.opengraph.xyz or a chat window and confirm the image and title.
4. Tell Google. Add the site to Search Console, verify ownership and submit https://yourdomain.com/sitemap.xml. Bing has the same thing in Webmaster Tools.
5. Analytics, if you want it. Add your snippet to src/app/layout.tsx, or use your host’s built-in analytics (Vercel Analytics, Cloudflare Web Analytics, Plausible, Fathom) — none of them need a cookie banner.
6. Keep the work coming. A new case study is one entry in src/content/collections/projects.ts, a new post one entry in posts.ts; see Editing the content, or connect a CMS (Using a headless CMS) if someone else will publish.

Performance and SEO

The template ships with what search engines look for: pre-rendered HTML, one <h1> per page, a title and description for every page, canonical links, sitemap.xml, robots.txt, share cards, sized and lazy-loaded images and links in the HTML to every page. Keeping the site fast is mostly about images and videos: export photos at the size they are shown, not the size your camera produced, and keep the looping videos short and small. The demo’s videos play from a stock site whose servers set a cookie; your own video files from your own domain don’t.