GenAI – How To Deploy Two Application In Nginx Server ?
Table Of Contents:
- Steps To Deploy Two Application In Nginx Server.
Step-1: Mention This PUBLIC_URL Wherever You Are Referring The Static Files.
- Set base paths so React can load static files properly when hosted under a subfolder.
- In
App.js, all paths to static files should use:
src={`${process.env.PUBLIC_URL}/images/Harman-3.png`}Step-2: Take Two Separate Build For Two Applications.
# For Softline
$env:PUBLIC_URL="/softline/"; npm run build
# For Hardline
$env:PUBLIC_URL="/hardline/"; npm run build
Step-3: SSH Into Server
Step 4: Create Directories for Each App
sudo mkdir -p /var/www/html/hardline
sudo mkdir -p /var/www/html/softline
Step 5: Clean Old Files (Optional)
sudo rm -rf /var/www/html/hardline/*
sudo rm -rf /var/www/html/softline/*
Step 6: Copy React Build Folders
- Copy the React build output from local or upload using
scp, then:
# Inside each build folder:
sudo cp -r build/* /var/www/html/hardline
sudo cp -r build/* /var/www/html/softline
Step 7: Configure NGINX
Open NGINX config:
sudo nano /etc/nginx/sites-available/default
- Replace/add the following:
server {
listen 8080;
server_name 10.159.106.140;
location /hardline/ {
alias /var/www/html/hardline/;
index index.html;
try_files $uri $uri/ /hardline/index.html;
}
location /softline/ {
alias /var/www/html/softline/;
index index.html;
try_files $uri $uri/ /softline/index.html;
}
}
Step 8: Restart NGINX
sudo systemctl restart nginx
Step 9: Access Frontends in Browser
http://10.159.106.140:8080/hardline/
http://10.159.106.140:8080/softline/
Step 10: Deploy Backend API Services / Update Python API Ports
app.run(host='0.0.0.0', port=8152)
app.run(host='0.0.0.0', port=8153)
Step 11: Run Backend Services in Background
- Use
nohupto keep them running even after SSH session closes:
nohup python3 hardline_main.py > hardline.log &
nohup python3 softline_main.py > softline.log &
- Or, specify port in command:
nohup python3 hardline_main.py – port 8152 > hardline.log &
nohup python3 softline_main.py – port 8153 > softline.log &
- Now your APIs are accessible at:
http://10.159.106.140:8152/ # hardline API
http://10.159.106.140:8153/ # softline API
Step 12: Integration in Frontend (App.js)
- In React frontend, make sure API calls go to correct ports:
// Hardline React App.js
fetch('http://10.159.106.140:8152/products')
// Softline React App.js
fetch('http://10.159.106.140:8153/products')