Scribd
Upload
5 views3 pages

CC Task 2

The document outlines the deployment process for a full stack application hosted at mrinal.live, detailing the tools and configurations used, including pm2 for monitoring, certbot for security, and nginx as a reverse proxy. It describes the steps taken to set up the frontend and backend, including domain registration, server configuration, and deployment scripts. Additionally, it provides the nginx configuration necessary for routing and SSL management.

Uploaded by

Mrinal
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
5 views3 pages

CC Task 2

The document outlines the deployment process for a full stack application hosted at mrinal.live, detailing the tools and configurations used, including pm2 for monitoring, certbot for security, and nginx as a reverse proxy. It describes the steps taken to set up the frontend and backend, including domain registration, server configuration, and deployment scripts. Additionally, it provides the nginx configuration necessary for routing and SSL management.

Uploaded by

Mrinal
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 3

Used tools

For monitoring and daemonizing--> pm2


For deployment--> deploy.sh script and github webhooks
For security--> certbot
For domain name--> name.com
And nginx as reverse-proxy

Deployed site--> mrinal.live


Full stack app--> mrinal.live/todo

1) Bought domain mrinal.live from name.com


Added a CNAME and A record for EC2 instace (Elastic ip)

2) //Frontend on main
npx create-react-app@latest ./
git push <frontend-github-repo>

//SSH into remote instance


chmod 700 <pem-file-name>
ssh -i <pem-file-name>.pem ubuntu@<remote-server-ip>
sudo chmod -R 775 /var/www
sudo chown -R www-data:www-data /var/www
sudo usermod -aG www-data $USER
cd /var/www
git clone <fronted-github-repo>
cd <Frontend-dir>
npm i
npm run build

//cofigure nginx

3) full stack app


//frontend
npx create-react-app@latest ./
npm i react-router-dom

In setting up BrowserRouter set basename="/todo"


In package.json add homepage:"/todo"
setup .env for SERVER_URL

//backend
npm init -y
npm i express body-parser dotenv mongoose
vi index.js <Create a simple server listening on port 5000>

Push to <Full-stack repo> on github

SSH on remote instance


cd /var/www/
git clone <FULL-STACK-REPO>
//frontend
npm i
set .env file
npm run build
Update nginx file

//backend
npm i
pm2 start index.js --name <service-name>
pm2 startup
pm2 save
Update nginx file

Herer is nginx configuration for the same-->


server {
server_name mrinal.live www.mrinal.live;

# Redirect www to non-www


if ($host = 'www.mrinal.live') {
return 301 https://mrinal.live$request_uri;
}

# Frontend (for mrinal.live)


location / {
root /var/www/Frontend-main-cc/build;
index index.html;
try_files $uri $uri/ /index.html;
}

# Frontend for /todo (for mrinal.live/todo)


location /todo/ {
root /var/www/mrinal.live;
index index.html;
try_files $uri /todo/index.html;
}

# Backend API for /todo/api


location /todo/api {
proxy_pass http://localhost:5000;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_http_version 1.1;
proxy_set_header Connection '';
}

# Webhook location This is only for mrinal.live frontend auto deployment


location /webhook {
proxy_pass http://localhost:3000/webhook;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_http_version 1.1;
proxy_set_header Connection '';
}

# Enable Gzip Compression


gzip on;
gzip_types text/plain text/css application/json application/javascript text/xml
application/xml application/xml+rss text/javascript;
gzip_min_length 256;
gzip_vary on;

# Error Pages Configuration


error_page 404 /index.html;
location = /404.html {
root /var/www/mrinal.live;
}

error_page 500 502 503 504 /50x.html;


location = /50x.html {
root /usr/share/nginx/html;
}

# SSL Configuration
listen 443 ssl; # managed by Certbot
ssl_certificate /etc/letsencrypt/live/mrinal.live/fullchain.pem; # managed by
Certbot
ssl_certificate_key /etc/letsencrypt/live/mrinal.live/privkey.pem; # managed by
Certbot
include /etc/letsencrypt/options-ssl-nginx.conf; # managed by Certbot
ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem; # managed by Certbot
}

server {
if ($host = www.mrinal.live) {
return 301 https://$host$request_uri;
} # managed by Certbot

if ($host = mrinal.live) {
return 301 https://$host$request_uri;
} # managed by Certbot

listen 80;
server_name mrinal.live www.mrinal.live;
return 404; # managed by Certbot
}

You might also like