Deploying a full-stack application that uses Laravel for the backend and Next.js for the frontend on a VPS may seem difficult at first, but with HestiaCP, the process becomes much more organized and manageable. HestiaCP provides a simple control panel for managing domains, web files, databases, SSL certificates, and server settings, making it a practical choice for developers who want more control than shared hosting. In this guide, I will walk through the step-by-step process of deploying a Laravel + Next.js application on a VPS using HestiaCP.
The first step is preparing the VPS and setting up your domain inside HestiaCP. After purchasing a VPS, you need to install HestiaCP and point your domain or subdomain to the server IP using DNS records. Once the domain is connected, create a new web domain in HestiaCP for your project. For a Laravel application, the domain root should point to the public directory, since this is the only folder that should be publicly accessible. At this stage, it is also important to enable SSL so your application can run securely over HTTPS.
The second step is uploading the Laravel project and configuring the backend. You can upload the project using Git, SCP, or the file manager, depending on your workflow. After the files are on the server, configure the .env file with your production database credentials, app URL, and other required environment variables. Then create your MySQL database and user from HestiaCP, and connect them in Laravel. Once that is done, run commands like composer install, php artisan key:generate, php artisan migrate, and php artisan optimize to prepare the application. You should also make sure folder permissions are correct for storage and bootstrap/cache.
The third step is preparing and deploying the Next.js frontend. Upload your Next.js project to the server, install dependencies with npm install, and create the production build using npm run build. If your setup uses Next.js as the frontend and Laravel as the backend API, make sure your environment variables correctly point to the Laravel API URL. In some cases, Next.js route handlers can be used as a proxy layer between the frontend and Laravel backend, especially when handling authentication tokens more securely. After building the project, run the app using a process manager such as PM2 so it stays online even after server restarts.
The fourth step is configuring Nginx in HestiaCP so both applications work correctly. Laravel usually runs directly from the domain through PHP-FPM and Nginx, while Next.js often runs on an internal port such as 3000 and is reverse proxied through Nginx. This means Nginx listens on the public domain and forwards traffic to the running Next.js process. If your Laravel API is on a subdomain, such as api.yourdomain.com, and Next.js is on the main domain, this separation can make the deployment cleaner and easier to manage. After editing the Nginx configuration, always test it and reload the server to apply changes safely.
The final step is testing and troubleshooting the live deployment. Check whether the frontend loads properly, API requests work, database connections are successful, and SSL is active without redirect issues. It is common to face problems such as 404 errors, incorrect root paths, permission problems, mixed content warnings, or Nginx proxy misconfiguration during the first deployment. Careful checking of logs, environment files, and server configuration usually solves these issues. In the end, deploying a Laravel + Next.js app on a VPS with HestiaCP is a valuable skill because it gives you full control over your application, improves your understanding of production systems, and prepares you for real-world full-stack development.
Tags
More Articles
How to Make Money as a Student in Nepal: Practical Ways to Start Earning
Being a student in Nepal often comes with financial challenges, from managing daily expenses to supporting education costs. However, with the growth of the internet and digital opp...
The Rise of Artificial Intelligence in Nepal: Current Trends and Impact
Artificial Intelligence (AI) is rapidly transforming Nepal’s digital landscape, moving from a niche concept to a widely adopted technology across multiple sectors. In recent years,...
Understanding a Modern Full-Stack Architecture with Next.js, Laravel, Tailwind CSS, and MySQL
Building a modern web application often requires a clean separation between frontend and backend while still maintaining smooth communication between them. In this architecture, Ne...
