simple-website-deployment-on-ec2

Simple angular website deployment on Amazan EC2 instance

Basics of deployment

1. DNS

2. Hosts (/etc/hosts)

3. Virtual Hosts

4. Ports

5. Static sites/Dynamic sites

6. ssh/scp/rsynch

Setup Server configurations

1. Launch instance t2.micro freetier

2. Download key from AWS console and save it to ~/.ssh folder and then give below permission [You can download key only once ]

   chmod 400 ~/.ssh/demo.pem

3. Set Inboud Rules: Add HTTP Port 80 source custom

Create simple Angular App on local:

1. ng new demo

2. ng serve to test demo app

3. ng build --prod

Copy Code from Local to remote server

1. scp: Same syntax like copy:

   scp -i ~/.ssh/demo.pem dist.zip ubuntu@ec2-52-66-7-24.ap-south-1.compute.amazonaws.com:/home/ubuntu

2. rsync: rsync -Pav -e "ssh -i ~/.ssh/demo.pem" dist/ ubuntu@ec2-52-66-7-24.ap-south-1.compute.amazonaws.com:/home/ubuntu/dist

3. sftp: sftp -i ~/.ssh/demo.pem ubuntu@ec2-52-66-7-24.ap-south-1.compute.amazonaws.com get and put lls, lcd etc as per need

Install Server

1. Nginx installation sudo apt install nginx -y

   a. Go to nginx site configuration cd /etc/nginx/sites-available/

   b. Backup Default config file sudo cp default default.bk

   c. Setup config in sudo vim default file, set root /var/www/html/dist/demo and fallback config try_files $uri $uri/ /index.html;

   d. Restart server sudo service nginx restart

2. Apache2 installation sudo apt install apache2 -y

   a. Go to apache site configuration cd /etc/apach2/site-available

   b. Backup default config file sudo cp 000-default.conf 000-default.conf.bk

   c. Setup config in sudo vim 000-default.conf file, set DocumentRoot /var/www/html/dist/demo

   d. Add .htaccess at root

   e. Restart the server sudo service apache2 restart

Continuous delivery

1. Jenkins/Codepipeline/Codestar/Teamcity etc

2. Git clone and create build

3. Copy deliverable directly using scp, sftp, rsync etc

   a. Create zip of dist folderzip -r dist.zip dist/

   b. Copy zip to destinsation server using scp -i ~/.ssh/key.pem dist.zip server URL:/home/ubuntu

   c. Install unzip on deplotyment server sudo apt install unzip

   d. Unzip to desired directory sudo unzip /home/ubuntu/dist.zip -d /var/www/html/

   e. Restart web server

Hosting website on S3:

1. Must have readonly access to public

2. <bucket-name>.s3-website.<AWS-region>.amazonaws.com

3. ARN: Amazon Resource name

4. Sample permission:

{
    "Version": "2012-10-17",
    "Statement": [
    {
        "Sid": "PublicReadGetObject",
        "Effect": "Allow",
        "Principal": "*",
        "Action": "s3:GetObject",
        "Resource": "arn:aws:s3:::deployment-demo-ganesh/*"
    }]
}

Hosting website on Github

1. Create the build with below command:

   ng build --prod --output-path docs --base-href /simple-website-deployment-on-ec2/

2. Copy docs/index.html and name it docs/404.html

3. Commit docs directory and push it.

4. On the GitHub project page, configure it to publish from the docs folder

5. Under your repository name, click Settings, Use the Select source drop-down menu to select master as your GitHub Pages publishing source.

6. Online github site