Not able to access the react app via http://[Vultr_main_ip_address]:3000
event after running npm start
command and then running node server.js
from src/
folder location.
Vultr name servers
are already added under DNS settings of the domain provider.
Could someone please advise why I am not able to access the app via vultr ip address
Below are the Versions:
node v18.13.0
nginx/1.22.0 (Ubuntu)
Ubuntu 23.04 x64
Installed nginx in the Vultr server root location from terminal by running below:
$ sudo apt-get update
$ sudo apt-get install nginx
Then I have modified the Nginx configuration file by running the below command:
$ sudo nano /etc/nginx/sites-available/default
And added following entries under location/ {
server {
listen 80 default_server;
listen [::]:80 default_server;
# SSL configuration
#
# listen 443 ssl default_server;
# listen [::]:443 ssl default_server;
#
# Note: You should disable gzip for SSL traffic.
# See: https://bugs.debian.org/773332
#
# Read up on ssl_ciphers to ensure a secure configuration.
# See: https://bugs.debian.org/765782
#
# Self signed certs generated by the ssl-cert package
# Don't use them in a production server!
#
# include snippets/snakeoil.conf;
root /var/www/html;
# Add index.php to the list if you are using PHP
index index.html index.htm index.nginx-debian.html;
server_name _;
location / {
# First attempt to serve request as file, then
# as directory, then fall back to displaying a 404.
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;
proxy_cache_bypass $http_upgrade;
try_files $uri /index.html;
}
}
#server {
# listen 80;
# listen [::]:80;
#
# server_name example.com;
#
# root /var/www/example.com;
# index index.html;
#
# location / {
# try_files $uri $uri/ =404;
# }
#}
Later ran below command again:
$ sudo nginx -t
$ sudo systemctl restart nginx
Below is my package.json file:
{
"name": "matblogs",
"version": "0.1.0",
"private": true,
"dependencies": {
"@material-tailwind/react": "^1.2.5",
"@tanstack/react-query": "^4.26.0",
"@testing-library/jest-dom": "^5.16.5",
"@testing-library/react": "^13.4.0",
"@testing-library/user-event": "^13.5.0",
"@uiw/react-md-editor": "^3.20.2",
"axios": "^1.3.3",
"bcryptjs": "^2.4.3",
"body-parser": "^1.20.1",
"bootstrap": "^5.2.3",
"cors": "^2.8.5",
"dotenv": "^16.0.3",
"express": "^4.18.2",
"pg": "^8.9.0",
"react": "^18.2.0",
"react-animated-text": "^0.1.4",
"react-bootstrap": "^2.7.2",
"react-dom": "^18.2.0",
"react-hook-form": "^7.43.0",
"react-markdown": "^8.0.5",
"react-responsive": "^9.0.2",
"react-router-dom": "^6.6.2",
"react-scripts": "5.0.1",
"react-syntax-highlighter": "^15.5.0",
"sequelize": "^6.28.0",
"web-vitals": "^2.1.4"
},
"proxy": "http://localhost:8000",
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}
After correcting the nginx configuration by running below command and then added the server block:
$ sudo nano /etc/nginx/sites-available/default
server {
listen 80;
server_name somedomain-test.com www.somedomain-test.com;
root /var/www/somedomain-test.com/build;
index index.html;
}
Ran below commands:
$ sudo ufw allow 'Nginx Full'
$ sudo ufw delete allow 'Nginx HTTP'
and then restarted nginx by running below command, solved the issue
$ sudo systemctl restart nginx