awspage

Project to create a basic AWS page The inital goal of this project is to be able to create a static web page, that can be editable using the github repo and github pipeline

Prerequisites

1. Create or have an AWS account
2. Create an github repo

Step-by-Step

1. Hosting a static website using AWS S3
   1. Create an S3 Bucket on AWS
   2. Assign permission to host an http website
2. Create an IAM User
   1. Create an Policy to allow user to S3
   2. Create an user on IAM
   3. Create access key for an user
3. Create the github pipeline
   1. Upload AWS keys to github as secrets
   2. Create the github action

Hosting a static website using AWS S3

Create an S3 Bucket on AWS

Access to the AWS main page, type S3 on the nav tool and click on the button to access to the S3 console

In the S3 console, click on buckets and then Create Bucket

The most important things to configure are

• Bucket Name
• Public Access configuration

For more information about how to create an S3 bucket you can checkout the create first bucket page on AWS You can go onto the create IAM User

Assign permission to host an http website

In the S3 console select the created bucket and properties, scroll down until the hosting a website option is present and edit

In the page choose allow In type choose hosting a static website An write down a file for the index an error

At the bottom of the page select save changes

In the S3 console select the created bucket, and then permissions, under bucket policy, check edit and paste

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

Create an IAM User

Create an Policy to allow user to S3

In the AWS console, type IAM and click on IAM to access the IAM console

Select on policies and create policy

In the specify permissions choose JSON an paste this policy

{
	"Version": "2012-10-17",
	"Statement": [
		{
			"Sid": "S3ListBucket",
			"Effect": "Allow",
			"Action": ["s3:ListBucket"],
			"Resource": "arn:aws:s3:::<BUCKET_NAME>"
		},
		{
		    "Sid": "S3UploadObjectToBucket",
			"Effect": "Allow",
			"Action": ["s3:PutObject"],
			"Resource": "arn:aws:s3:::<BUCKET_NAME>/*"
		}
	]
}

This policy allow you to upload files to your bucket, but only in your bucket

After this, it requires the policy name, and a description

Create an user on IAM

In the AWS console, type IAM and click on IAM to access the IAM console

• Select users and create user
• Type an userName
• For the permission and policies select directly put policies, and search for the policy you just have created
• Now review and accept

Create access key for an user

In the AWS console, type IAM and click on IAM to access the IAM console Go to the user tab and find the created user Go to security credencials, and in access keys select create access key

In the console, choose CLI, scroll down, enable the confirmation button and click on next

After that you will be prompted with your access keys, copy them on a secure file.

For more information about creating an IAM user checkout the AWS creating an IAM user in your AWS account

Create the github pipeline

Upload AWS keys to github as secrets

On the repository page click the settings bar, and go to the security and select secrets and variable, in actions

click on new repository secret, and create a secret for the access key and the secret key

For more information about secrets checkout the using secrets in github actions

Create the github action

Click on the action option in the repository view Then click in set up a workflow yourself

Script this in the space

name: Upload Website

on:
  push:
    branches:
    - master

jobs:
  deploy-site:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
      - uses: jakejarvis/s3-sync-action@master
        with:
          args: --delete
        env:
          AWS_S3_BUCKET: <NAME_OF_BUCKET>
          AWS_ACCESS_KEY_ID: ${{ secrets.<NAME_ACCESS_KEY> }}
          AWS_SECRET_ACCESS_KEY: ${{ secrets.<NAME_SECRET_KEY> }}

For more information about github actions checkout the actions

For more information about hosting a website on AWS checkout the hosting a static website using Amazon S3