![AWS – CI/CD Pipline with Github & S3 Bucket static website AWS – CI/CD Pipline with Github & S3 Bucket static website](https://askjoechan.com/wp-content/uploads/2022/11/Capture.png)
AWS – CI/CD Pipline with Github & S3 Bucket static website
Using the cloud to build Static website with AWS Pipeline. We will need Github help as well.
- AWS S3 Bucket
- Git Hub account
- AWS pipline
- Connect AWS codebuild to Github (Source Stage).
- Pipeline select S3 (Deploy stage)
![](https://askjoechan.com/wp-content/uploads/2022/11/s3.png)
![](https://askjoechan.com/wp-content/uploads/2022/11/GitHub-Mark.png)
![](https://askjoechan.com/wp-content/uploads/2022/11/aws-code.png)
Create S3 Bucket & Static Website + Bucket Policy
First, we will create an S3 bucket and pickup an unique Name for your bucket.
- Bucket set to be Public
- Static website hosting turn on
- ACL enable ( arn you will need to put your own ARN)
![](https://askjoechan.com/wp-content/uploads/2022/11/joebuild-bucket-policy-edited.png)
![](https://askjoechan.com/wp-content/uploads/2022/11/s3-1-1024x461.png)
Git Hub Account
Create an Git Hub account, if you use Git hub as Source code.
- then you will need to create an repository for your static website
- Adding Git Hub to your AWS Pipeline source stage
![](https://askjoechan.com/wp-content/uploads/2022/11/github-connect-1024x466.png)
AWS Pipeline
On AWS Pipeline, source stage we will select “Github version 2 ” , on deploy stage we will select ” AWS S3″.
Once AWS connect to your Github, a respository will be selected for this deployment. We didn’t use codebuild here, so we can skip that part. What happen is, what we had done in Github, editing txt, adding jpg…etc
All these will be sync with S3 bucket file. Which will save your time in some how. you can more focus on code, design…etc
![](https://askjoechan.com/wp-content/uploads/2022/11/joebuild-1-1-1024x487.png)
![](https://askjoechan.com/wp-content/uploads/2022/11/joebuild-2-1024x487.png)
Made changes in Github
After the First txt has been made in Github. we can see “index.html” has been added to S3 bucket. When we click on provided url. we can see our page “Hello guys”
![](https://askjoechan.com/wp-content/uploads/2022/11/joebuild-3-1024x443.png)
![](https://askjoechan.com/wp-content/uploads/2022/11/joebuild-4-1024x406.png)
What if, we changes the text file on git hub and add jpg. So the website will be automatically updated via aws pipeline process. Also through the source code in aws pipeline, it will refer to github revision page. It will indicate that what has been changes, added, deleted …etc
![](https://askjoechan.com/wp-content/uploads/2022/11/joebuild-7-1024x390.png)
![](https://askjoechan.com/wp-content/uploads/2022/11/joebuild-6-1024x486.png)
![](https://askjoechan.com/wp-content/uploads/2022/11/joebuild-8-1024x428.png)