Deploying your Next.js app on a production server can feel overwhelming, but Next.js deployment on a Hostinger VPS running Ubuntu gives you complete control over your hosting environment. This guide is designed for developers who want to move beyond shared hosting and take charge of their Next.js production deployment with a reliable VPS hosting Next.js solution.
You’ll learn how to transform a fresh Ubuntu server into a powerful hosting platform for your React applications. We’ll walk through the complete Hostinger VPS setup process, from initial server configuration to getting your app live with proper security measures.
This tutorial covers three essential areas: setting up your Ubuntu server deployment environment with Node.js and preparing your Next.js app for production, configuring Nginx reverse proxy Next.js setup to handle traffic efficiently, and securing everything with SSL certificate Next.js implementation. By the end, you’ll have a fast, secure, and scalable deployment that you can manage and optimize yourself.
Setting Up Your Ubuntu Server on Hostinger VPS
Creating and configuring your Hostinger VPS instance
Start by logging into your Hostinger control panel and navigate to the VPS section. Choose an Ubuntu 20.04 or 22.04 LTS server configuration with at least 2GB RAM for optimal Next.js deployment performance. Select your preferred data center location closest to your target audience for better latency. Configure your server’s hostname and set up root password credentials during the initial setup process.
Connecting to your server via SSH
Access your VPS through SSH using the provided IP address and root credentials from Hostinger. Open your terminal and run ssh root@your-server-ip, then enter your password when prompted. For enhanced security, create a new sudo user immediately after connecting: adduser yourusername and usermod -aG sudo yourusername. Always use this new user account instead of root for daily operations.
Updating system packages and security configurations
Run sudo apt update && sudo apt upgrade -y to refresh package lists and install the latest security patches. Configure the UFW firewall by enabling it with sudo ufw enable and allowing essential ports: sudo ufw allow ssh, sudo ufw allow 80, and sudo ufw allow 443. Disable root login and configure SSH key authentication by editing /etc/ssh/sshd_config and setting PermitRootLogin no and PasswordAuthentication no.
Installing essential development tools and dependencies
Install the build-essential package and development libraries needed for Next.js deployment: sudo apt install build-essential git curl wget unzip software-properties-common -y. Add the deadsnakes PPA for Python support and install PM2 process manager globally for production application management. These tools create a solid foundation for running Node.js applications and managing deployment processes on your Ubuntu server.
Installing Node.js and npm for Next.js Development
Setting up Node Version Manager (NVM) for flexible Node.js management
Node Version Manager streamlines your Next.js deployment workflow by allowing seamless switching between different Node.js versions on your Ubuntu server. Download and install NVM using the official installation script: curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.0/install.sh | bash. After installation, restart your terminal or run source ~/.bashrc to activate NVM. This tool becomes essential when managing multiple projects with different Node.js requirements on your Hostinger VPS setup.
Installing the latest stable Node.js version
Install the current stable Node.js version using NVM with the command nvm install node. This automatically downloads and sets up the latest stable release. For production Next.js deployment, you can also specify particular versions like nvm install 18.17.0 to match your development environment. Switch between installed versions using nvm use node or nvm use 18.17.0. Set a default version with nvm alias default node to ensure consistency across terminal sessions on your Ubuntu server.
Verifying npm installation and updating to latest version
Node.js installation includes npm by default. Verify your installation by checking versions with node --version and npm --version. Update npm to the latest version using npm install -g npm@latest for improved performance and security features. Check available npm updates with npm outdated -g and ensure your package manager supports the latest Next.js features. This setup prepares your Hostinger VPS for efficient Next.js production deployment with proper dependency management capabilities.
Preparing Your Next.js Application for Production Deployment
Optimizing your Next.js build configuration
Configure your next.config.js file for optimal Next.js production deployment by enabling compression, setting output to standalone mode, and configuring static file handling. Add build optimization settings like swcMinify: true and proper asset optimization to reduce bundle size and improve server performance on your Hostinger VPS.
- Enable standalone output mode with
output: 'standalone' - Configure compression and asset optimization
- Set up proper image optimization settings
- Add environment-specific build configurations
- Configure webpack bundle analyzer for size monitoring
Creating production-ready environment variables
Set up secure environment variables for your Next.js deployment by creating a .env.production file with database connections, API keys, and server-specific configurations. Replace development URLs with production domains and ensure sensitive data like JWT secrets use strong, unique values for your Ubuntu server environment.
- Create
.env.productionwith production-specific values - Configure database connection strings for VPS
- Set up secure API keys and authentication tokens
- Define production domain and SSL configurations
- Implement proper secret management practices
Building and testing your application locally
Build your Next.js application using npm run build to generate the production-ready .next folder and verify all components render correctly. Test the production build locally with npm start to catch any build-time errors before deploying to your Hostinger VPS, ensuring smooth Ubuntu server deployment.
- Run
npm run buildto create production build - Test with
npm startto verify functionality - Check for build warnings and optimization opportunities
- Validate all API routes and static generation
- Confirm environment variable loading works correctly
Deploying Your Next.js Application to the VPS
Transferring Application Files to Your Ubuntu Server
Upload your Next.js project files to your Ubuntu server using SCP, SFTP, or Git clone from your repository. Create a dedicated directory like /var/www/your-app-name with proper permissions. If using Git, run git clone https://github.com/username/your-nextjs-app.git directly on the server. Ensure your production build files and package.json are included in the transfer for a complete Next.js deployment setup.
Installing Project Dependencies on the Server
Navigate to your application directory and run npm install --production to install only production dependencies, reducing server resource usage. For better performance, consider using npm ci instead, which installs packages directly from package-lock.json. Verify all dependencies are correctly installed by checking node_modules directory and running npm list to identify any missing packages that could break your Next.js production deployment.
Configuring PM2 Process Manager for Application Monitoring
Install PM2 globally using npm install -g pm2 to manage your Next.js application processes efficiently. Create an ecosystem.config.js file specifying your app name, script path, and environment variables. Start your application with pm2 start ecosystem.config.js or pm2 start npm --name "your-app" -- start. PM2 provides automatic restarts, load balancing, and monitoring features essential for production Next.js deployments on Ubuntu servers.
Setting Up Automatic Application Restart on Server Reboot
Generate PM2 startup script by running pm2 startup and following the displayed commands to configure automatic startup. Save your current PM2 process list with pm2 save to preserve application configurations. Test the setup by rebooting your Ubuntu server and verifying your Next.js application automatically restarts. This ensures your Hostinger VPS deployment remains available even after system maintenance or unexpected server restarts.
Installing and Configuring Nginx as Reverse Proxy
Installing Nginx web server on Ubuntu
Start by updating your Ubuntu package list and installing Nginx. Run sudo apt update && sudo apt install nginx -y to get the latest version. Check if Nginx is running with sudo systemctl status nginx and enable auto-start with sudo systemctl enable nginx. The default firewall should allow HTTP traffic, but verify with sudo ufw allow 'Nginx Full' to enable both HTTP and HTTPS connections.
Creating server block configuration for your domain
Navigate to /etc/nginx/sites-available/ and create a new configuration file for your domain using sudo nano /etc/nginx/sites-available/yourdomain.com. This server block will define how Nginx handles requests for your specific domain. Include the server name directive matching your domain and set up the document root. Remove the default Nginx configuration to avoid conflicts by running sudo rm /etc/nginx/sites-enabled/default.
Setting up reverse proxy to forward requests to Next.js application
Configure the location block within your server block to proxy requests to your Next.js app running on port 3000. Add these directives: proxy_pass http://localhost:3000, proxy_http_version 1.1, proxy_set_header Upgrade $http_upgrade, proxy_set_header Connection 'upgrade', proxy_set_header Host $host, and proxy_cache_bypass $http_upgrade. These settings ensure proper handling of WebSocket connections and maintain request headers for your Next.js production deployment.
Testing Nginx configuration and enabling the site
Before activating your configuration, test it for syntax errors using sudo nginx -t. If the test passes, create a symbolic link to enable the site with sudo ln -s /etc/nginx/sites-available/yourdomain.com /etc/nginx/sites-enabled/. Reload Nginx to apply changes with sudo systemctl reload nginx. Your domain should now successfully forward traffic to your Next.js application running on the Ubuntu server, completing the Nginx reverse proxy setup for your Hostinger VPS deployment.
Securing Your Deployment with SSL Certificates
Installing Certbot for Let’s Encrypt SSL certificates
Certbot simplifies SSL certificate management by automating the entire process of obtaining and renewing free Let’s Encrypt certificates. Install Certbot using the snap package manager for the most up-to-date version. Run sudo apt install snapd followed by sudo snap install --classic certbot to get started. Create a symbolic link with sudo ln -s /snap/bin/certbot /usr/bin/certbot to make the command accessible system-wide. This installation method ensures automatic updates and compatibility with your Ubuntu server hosting your Next.js deployment.
Obtaining free SSL certificates for your domain
Generate SSL certificates for your domain by running sudo certbot --nginx -d yourdomain.com -d www.yourdomain.com. Certbot automatically detects your Nginx configuration and modifies it to include SSL settings. During the initial setup, provide a valid email address for renewal notifications and agree to the terms of service. The tool validates domain ownership through HTTP challenges, creating temporary files in your web root. Once validation completes, Certbot downloads and installs the certificates, immediately securing your Next.js application with HTTPS encryption.
Configuring automatic certificate renewal
Let’s Encrypt certificates expire every 90 days, making automatic renewal essential for uninterrupted SSL protection. Certbot includes a systemd timer that handles renewals automatically – verify it’s active with sudo systemctl status snap.certbot.renew.timer. Test the renewal process manually using sudo certbot renew --dry-run to catch potential issues before they affect your production Next.js deployment. The renewal process checks certificate expiration dates and only renews certificates within 30 days of expiry, minimizing server load while maintaining security.
Updating Nginx configuration for HTTPS redirect
Modify your Nginx server block to redirect all HTTP traffic to HTTPS, ensuring secure connections for your Next.js application. Add a redirect block that captures port 80 traffic and sends it to the SSL-enabled version. Certbot typically handles this automatically, but manual verification prevents security gaps. Include HSTS headers in your SSL server block with add_header Strict-Transport-Security "max-age=31536000; includeSubDomains" always; to force browsers to use HTTPS for future visits. Reload Nginx configuration with sudo nginx -t && sudo systemctl reload nginx to activate the changes.
Optimizing Server Performance and Monitoring
Configuring Nginx caching for static assets
Setting up proper caching in Nginx dramatically improves your Next.js deployment performance on Hostinger VPS. Add caching directives to your Nginx configuration file to cache CSS, JavaScript, and image files for extended periods, reducing server load and improving page load times for returning visitors.
location ~* \.(js|css|png|jpg|jpeg|gif|svg|ico|woff|woff2)$ {
expires 1y;
add_header Cache-Control "public, immutable";
access_log off;
}
Setting up log rotation and monitoring tools
Log management prevents your Ubuntu server from running out of disk space while maintaining visibility into application performance. Configure logrotate to automatically compress and archive Nginx and PM2 logs weekly, keeping only the most recent files.
Install basic monitoring tools like htop and set up automated log alerts:
- Create custom logrotate rules for Next.js application logs
- Configure PM2 log rotation with
pm2 install pm2-logrotate - Set up disk space monitoring with simple bash scripts
- Enable Nginx access and error log rotation in
/etc/logrotate.d/nginx
Implementing basic security measures and firewall rules
Securing your Next.js production deployment requires configuring UFW firewall and implementing essential security hardening. Enable UFW and allow only necessary ports: SSH (22), HTTP (80), and HTTPS (443). Block all other incoming connections by default.
sudo ufw enable
sudo ufw allow ssh
sudo ufw allow 'Nginx Full'
sudo ufw deny 3000
Additional security measures include:
- Disable root SSH login and use key-based authentication
- Configure fail2ban to prevent brute force attacks
- Hide Nginx version information in server responses
- Set up automatic security updates for Ubuntu server packages
- Implement rate limiting in Nginx configuration to prevent DDoS attacks
Deploying a Next.js application on Hostinger VPS with Ubuntu gives you complete control over your hosting environment while keeping costs manageable. You’ve learned how to set up your server from scratch, install the necessary tools, configure Nginx as a reverse proxy, and secure everything with SSL certificates. This setup provides a solid foundation for running production applications with better performance than shared hosting.
Taking the time to properly configure your server, implement SSL security, and optimize performance will pay off in the long run. Your Next.js app now runs on a scalable infrastructure that you can customize as your project grows. Don’t forget to regularly monitor your server performance and keep your system updated. With this deployment strategy, you have the flexibility to scale your application and add new features without worrying about hosting limitations.


















