VxCloud
Docs/Guides/Frontend deployments
Frontend deployments

Ship a Next.js app in three minutes

You bring a GitHub repo and an SSH-reachable VM. VxCloud handles clone, npm install, next build, process supervision, and HTTPS.

10 minBeginnerNext.jsNode.jsFrontendGit
Pick how you want to follow along

In the dashboard (UI)

The Next.js wizard lives at Dashboard → Development → Next.js Application. Every wizard in the Development tab shares the same shape: pick a target node, fill four steps, click Deploy, watch the live progress.

1

Open the Next.js wizard

In the dashboard sidebar, click Development → tab "Development" → card "Next.js Application" → button "Deploy". The card shows the Next.js logo and a short description. Clicking Deploy opens the four-step wizard with a node selector pinned to the top right.

2

Step 1 — Server Configuration

Pick a Deployment Type (Virtual Machine, Kubernetes, or Docker Host). Enter the Server IP of your target VM, the SSH Username (typically ubuntu), and pick an SSH Key Pair Name from the dropdown — it lists every keypair stored in your workspace Vault.

  • Use Test SSH Connection (green button) to verify reachability before continuing.
  • The Services Checking button (yellow) runs runtime smoke-tests on the VM if you want a deeper preflight.
Tip: If Test SSH Connection fails with "host: 13.216.243.13 " (trailing space), re-paste the IP cleanly. We trim on the server too, but cleaner input means cleaner audit logs.
3

Step 2 — Application Source

Choose "From Repository" (default) or "Upload Zip". For Git: paste the repo URL, set a branch (defaults to main), pick the Git provider (GitHub, GitLab, Bitbucket), and either OAuth-connect or paste a personal access token. The token is stored in your workspace Vault and reused on subsequent deploys — you only enter it once.

4

Step 3 — Next.js Configuration

Select Build Mode (production / development), Node.js Version (22, 20, 18, or 16), and an App Name. App Name is what you will see later in Monitoring as the resource identifier.

5

Step 4 — Application Settings

Set Entry Point (default ".") and Package File ("package.json"). Add Environment Variables — one KEY=value per line. Set Application Port (typically 3000), HTTP Port (80) and HTTPS Port (443) for the front-facing reverse proxy.

6

Click Deploy and watch progress

A live progress card appears: 10% session created → 38% repo cloned → 50% npm install → 70% next build → 90% systemd unit started → 100% reverse proxy live. Logs stream over WebSocket; the same view is reachable later under Monitoring → session ID.

Stuck halfway through? Email [email protected] — most replies land within an hour during weekdays.

All guides

Was this page helpful?