VxCloud
▲Beginner10 minFrontend

Deploy a Next.js app from GitHub

Clone a Next.js repo from GitHub, build it with Node 20, and serve it in production behind Nginx — with a live progress stream and Git-token auth sealed in Vault.

What you'll build

  • A Next.js app running in production mode on your node
  • Nginx terminating HTTP/HTTPS in front of the Node server
  • Git credentials stored in Vault, not in the deploy form

Before you begin

  • A registered node (see “Provision your first node”)
  • A GitHub repo with a Next.js app and a personal-access token for private repos
  • A free TCP port on the node (3000 by default)
1

Point the wizard at your node

Open Development → Deploy → Next.js. Step 1 is server configuration: choose the deployment type (VM), the node IP, the SSH username, and the Vault key pair. If you set a default node earlier, these are pre-filled.

app.prodxcloud.com/dashboard/development

Deploy Next.js — Server configuration

1
2
3
4
5
VM (SSH + Docker)▾
138.199.144.21
ubuntu
default (from Vault)▾
Step 1 — the node IP and SSH key come straight from your registered nodes.
2

Connect the GitHub repository

Step 2 is the application source. Paste the repo URL and branch. For a private repo, add a GitHub token — it’s written to Vault at workspaces/<org>/<workspace>/git/github_token and used only on the node during clone, never echoed back to the browser.

app.prodxcloud.com/dashboard/development

Deploy Next.js — Application source

2
3
4
5
https://github.com/acme/marketing-site
main
GitHub token (private repo)▾
Step 2 — Git auth is sealed in Vault the moment you submit.

Use a fine-scoped token

A read-only contents:read PAT is enough. VxCloud never needs write access to deploy.
3

Configure the Next.js build

Step 3 sets build mode and runtime. Pick Production build mode and Node.js 20. The pipeline runs npm install && npm run build then npm run start in production mode.

app.prodxcloud.com/dashboard/development

Deploy Next.js — Next.js configuration

3
4
5
Production▾
20▾
marketing-site
Step 3 — production mode runs the optimized .next build, not next dev.
4

Set env vars, ports, and resources

Step 4 covers entry point, the package_file location, environment variables, and ports. Step 5 allocates CPU/RAM/disk. Defaults (app port 3000, HTTP 80, HTTPS 443) work for most apps — Nginx is configured automatically as the reverse proxy.

app.prodxcloud.com/dashboard/development

Deploy Next.js — Application settings

4
5
package.json
NEXT_PUBLIC_API=https://api.acme.com
3000 / 80 / 443
Step 4 — env vars are one KEY=value per line; they’re injected at runtime.

Prefer automation? The same payload can be posted directly:

POST /api/v2/infrastructure/services/nextjs/deploy
$ {$   "config": { "host": "138.199.144.21", "ssh_user": "ubuntu", "key_pair_name": "default" },$   "repository_url": "https://github.com/acme/marketing-site",$   "branch": "main",$   "build_mode": "production",$   "node_version": "20",$   "app_name": "marketing-site",$   "app_port": 3000,$   "environment_vars": ["NEXT_PUBLIC_API=https://api.acme.com"]$ }
5

Watch the live deployment stream

Hit Deploy. The wizard subscribes to /ws/api/v3/tenant/provision/status over WebSocket (with HTTP polling as a fallback) and streams each phase as it happens.

Deployment progress100%
  • Clone repository (Git token from Vault)20%
  • npm install45%
  • npm run build (Node 20)75%
  • Start production server + Nginx proxy95%
  • Health check passed100%
The same stream backs the dashboard progress bar — no refresh needed.

Live in production

Your app is reachable on the node’s domain. Push to main and re-run the wizard (or wire CI — see the blue-green tutorial) to ship updates.

Nice work — you're done!

You completed Deploy a Next.js app from GitHub. Keep the momentum going with the next walkthrough, or jump back to the full catalog.