Skip to main content
020 3318 8223Email
SupportLoginRegister
5wireBlogHostingVPS

How to deploy your Next.js website to a Virtual Machine

James Ensor•

This tutorial will focus on deploying Next.js to a Virtual Machine.

Prerequisites

  • Linux based cloud server
  • Basic understanding of command-line interface (CLI) and terminal usage
  • A Next.js application (if you don’t have one, use npx create-next-app my-app)

Steps

Deploy your Cloud Server

  • Choose a Cloud Server with sufficient resources (CPU, RAM) to handle your application’s traffic.
  • Select an appropriate operating system (OS) like Ubuntu or Debian, which are commonly used for Node.js deployments.

Connect to the VM

Use a tool like SSH to establish a secure connection to your VM. Refer to your cloud provider’s documentation for specific commands and authentication methods.

Set Up the Server Environment

Update package lists:

sudo apt update

Install Node.js and npm (or yarn):

sudo apt install nodejs npm

Verify Node.js and npm versions:

node -v

npm -v

Clone or Transfer Your Next.js App

If your app is in a Git repository, clone it using SSH:

git clone git@github.com:your-username/your-app.git

Alternatively, upload the built application files (from ./out after running npm run build) to the VM using a method like SCP or SFTP.

Install Dependencies and Build the Application

cd your-app

Install production dependencies:

npm install --production ``` (or `yarn install --production`)

Build the application for production:

npm run build ``` (or `yarn build`)

Configure a Process Manager (Optional):

Process managers (PMs) like PM2 or forever can help keep your Next.js server running automatically and handle restarts.

Install a PM (e.g., using npm install pm2 -g): 

npm install pm2 -g

Start your Next.js server using the PM (adjust the port as needed):

pm2 start npm -- start  # Adjust the port if needed (e.g., pm2 start npm -- start -p 8080)

Set Up a Web Server (Optional – if not using a PM):

Install a web server like Nginx:

sudo apt install nginx

Configure Nginx to act as a reverse proxy for your Next.js application. Refer to Nginx documentation for specific configuration steps, typically involving creating a server block that points to the built application directory (./out).

Test and Access Your Application

From your local machine, try accessing your application using the VM’s public IP address or domain name (if configured). The port might be 80 (default for HTTP) or the custom port you specified in the PM or Nginx configuration.

Additional Considerations

  • Security: Configure firewalls on your VM and cloud provider to restrict access to necessary ports (e.g., SSH, application port).
  • Scaling: Consider using auto-scaling features offered by your cloud provider to handle fluctuating traffic.
  • Monitoring: Set up monitoring tools to track application performance and resource usage.
  • Backups: Regularly back up your application code and database (if applicable) to prevent data loss.

Optimise Your IT Infrastructure with 5wire’s Cloud Server, Reseller Hosting, and Forex Servers. Boost your business efficiency with 5wire’s comprehensive cloud server solutions, reseller hosting options, and high-speed forex servers.

← Back to Blog