How to Deploy a Laravel Vite Project on CPanel

  • Last updated Apr 25, 2024

In this tutorial, you will learn the step-by-step process of deploying a Laravel project on cPanel. Our comprehensive guide will walk you through the necessary steps and provide valuable insights, making it easier for web developers to host their Laravel applications on cPanel hosting environments. Follow our expert tips to ensure a smooth deployment of your Laravel project, optimizing your web development workflow and taking your website live effortlessly:

  1. Sign in to your CPanel:
  2. If this is your first time signing in to your cPanel, use the username and password provided to you by your web hosting company. For example:

  3. Upload Laravel Project to CPanel:
  4. There are several ways to upload a project to CPanel but in this example, we will use the most simple one, that is by using the File Manager:

    Go inside the File Manager, you will see directories of files and folders there.

    Next, compress your Laravel project folder that you want to deploy to your CPanel as a .zip file and upload it in the root directory.

    After your project folder is uploaded, extract it in the root directory.

  5. Moving Project Public Files:
  6. Before moving your project public files, you should enable Show Hidden Files from your File Manager Settings which is on the top right corner:

    After enabling this, go inside the public folder of your project. Inside the public folder, you should also see .htaccess file. Now select all the files (excluding public/build/manifest.json) and move them to the public_html folder located in the root directory of the File Manager.

    Next, update require __DIR__.'/../vendor/autoload.php'; to require __DIR__.'/../your-project-folder-name/vendor/autoload.php'; and $app = require_once __DIR__.'/../bootstrap/app.php'; to $app = require_once __DIR__.'/../your-project-folder-name/bootstrap/app.php'; in index.php file that is inside the public_html directory.

    Your project folder structure should look like this:

    ├── your-project-folder
    │   │── app
    │   │── bootstrap
    │   │── config
    │   │── database
    │   │── node_modules
    │   ├── public
    │   │     └── build
    │   │            └── manifest.json
    │   │── resources
    │   │── routes
    │   │── storage
    │   │── tests
    │   │── css
    │   │── vendor
    │   │── .editorconfig
    │   │── .env
    │   ├── artisan
    │   ├── composer.json
    │   ├── composer.lock
    │   ├── package-lock.json
    │   ├── phpunit.xml
    │   ├── README.md
    │   ├── vite.config.js

    Your files inside your public_html folder should look like this:

    ├── public_html
    │   │── .well-known
    │   ├── build
    │   │     └── assets
    │   │          ├── app-3e34f327.css
    │   │          ├── app-54a3df03.js
    │   │          └── app-8424f829.css
    │   │── cgi-bin
    │   │── css
    │   │── images
    │   │── js
    │   │── css
    │   │── js
    │   │── .htaccess
    │   │── favicon.ico
    │   ├── index.php
  7. Setting Up MySQL Database on CPanel:
  8. If your project is using a MySQL database, then you should configure it next. To create a new MySQL database, click on the MySQL® Databases . From this MySQL® Databases page, you can not only create a new database but also create users and add users to your database.

    After setting up your database, you should also update the MySQL configuration in your application .env configuration file. Go to your main project folder from your CPanel File Manager and look for .env file. Right click on the .env file and select the edit option.

    Here is an example of a .env file (This file is usually hidden, so in order to make it visible, you should enable Show Hidden File option from the CPanel Settings):

    APP_NAME=MyAppName
    APP_ENV=production
    APP_KEY=base64:YHon8mjCdjcc7TE+nlzdFn+hj8KNfLJfbhsjYKD37E5s=
    APP_DEBUG=false
    APP_URL=https://www.mydomain.com
    
    
    LOG_CHANNEL=stack
    LOG_LEVEL=debug
    
    DB_CONNECTION=mysql
    # use localhost if 127.0.0.1 does not work
    DB_HOST=127.0.0.1
    DB_PORT=3306
    DB_DATABASE=my_database_name
    DB_USERNAME=my_user
    DB_PASSWORD=my_password
    
    BROADCAST_DRIVER=log
    CACHE_DRIVER=file
    QUEUE_CONNECTION=sync
    SESSION_DRIVER=file
    SESSION_LIFETIME=120
    
    MEMCACHED_HOST=127.0.0.1
    
    REDIS_HOST=127.0.0.1
    REDIS_PASSWORD=null
    REDIS_PORT=6379
    
    MAIL_DRIVER=smtp
    MAIL_HOST=
    #MAIL_PORT=
    MAIL_USERNAME=
    MAIL_PASSWORD=
    MAIL_ENCRYPTION=
    MAIL_FROM_ADDRESS=
    MAIL_FROM_NAME="$${`{APP_NAME}`}"
    
    AWS_ACCESS_KEY_ID=
    AWS_SECRET_ACCESS_KEY=
    AWS_DEFAULT_REGION=us-east-1
    AWS_BUCKET=
    
    PUSHER_APP_ID=
    PUSHER_APP_KEY=
    PUSHER_APP_SECRET=
    PUSHER_APP_CLUSTER=mt1
    
    MIX_PUSHER_APP_KEY="$${`{PUSHER_APP_KEY}`}"
    MIX_PUSHER_APP_CLUSTER="$${`{PUSHER_APP_CLUSTER}`}"

    Note: Do not forget to disable the Show Hidden File option, once setting up your configuration is complete because it contains all the sensitive data of your application.

  9. Connect Your Domain To Your Hosting Package:
  10. Next, if your existing domain is registered somewhere else, then you will need to update the nameservers to point to your hosting package. For example - If your domain is registered with namecheap, then you will need to sign in to your namecheap account and update the nameservers from the domain settings.

  11. Install SSL on CPanel:
  12. Go to Security menu of your CPanel and click on SSL/TLS Status:

    Next, put check mark in the domain check box and click on the Run AutoSSL button. This will install free SSL on your domain. For example:

    That's it! You can open your browser and test your application.