Deployed laravel website on digital ocean showing blank screen and attempting to load css and js files over https

I followed through one of the tutorials on deployment of laravel app here https://www.techalyst.com/posts/laravel-hosting-with-digital-ocean-droplet-step-by-step-tutorial and was able to deploy my laravel app on digital ocean, using the LEMP stack. Laravel is used as backend while vuejs handles the front end. I also installed nodejs (v16), then did npm install and then npm run prod. However, my app shows a blank page on the browser and some errors on the console.My nginx server file looks like this;

server {
    listen 80 default_server;
    listen [::]:80 default_server;
    
    root /var/www/laravel/public;

    index index.php index.html index.htm index.nginx-debian.html;

    server_name 147.182.184.11;
    location / {
            try_files $uri $uri/ /index.php?$query_string;
    }
    location ~ \.php$ {
            include snippets/fastcgi-php.conf;
            fastcgi_pass unix:/var/run/php/php7.2-fpm.sock;
    }

    location ~ /\.ht {
            deny all;
    }

    location ~ \.css {
        add_header  Content-Type    text/css;
    }

     location ~ \.js {
        add_header  Content-Type    application/x-javascript;
    }

}

my project folders live in var/www/laravel, and after pushing from github, i can see all my laravel folders and files in the directory. i have installed composer, installed MySql, created user, granted and flushed privileges and created the database as instructed in the tutorial. I have also set up my .env file and modified the necessary variables like so;

APP_NAME=laravel
APP_ENV=production
APP_KEY=base64:generated-key-here
APP_DEBUG=false
APP_URL=http://147.182.184.11

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=laravel
DB_USERNAME=root
DB_PASSWORD=my-password

After this, i cleared the cache:

sudo php artisan config:cache
sudo php artisan route:cache

and ran migration successfully. However, typing my IP address shows a blank screen. On the chrome console, i have this;

GET https://147.182.184.11/css/app.css net::ERR_CONNECTION_REFUSED
GET https://147.182.184.11/js/app.js net::ERR_CONNECTION_REFUSED
GET https://147.182.184.11/images/assets/relicon.png net::ERR_CONNECTION_REFUSED

I have searched through the net and some similar questions i found had answers which didn't help or change anything. I have not installed SSL certificate and i have not yet added a domain name. I have been on this for a full day and nothing seems to work. How do i fix this? Any assistance will be appreciated.

Recommended topics

Hot tags