DEV Community

Cover image for AWS Static website using CI/CD Pipeline and S3 bucket
Sandipkumar Patel for AWS Community Builders

Posted on

AWS Static website using CI/CD Pipeline and S3 bucket

1. Make a repo in github with simple HTML page/s.

(sample repo)

2. Open AWS management console and search for S3 bucket. Open S3 console.

3. Create a simple bucket

  • Click on create bucket
  • Give a unique name to the bucket and choose a region.
  • Under Object Ownership click on ACLs enabled.
  • Unselect Block all public access and select I acknowledge that the current settings might result in this bucket and the objects within becoming public.
  • Finally click create bucket.

4. Once the bucket is created on the S3 console, copy it’s ARN and paste it in the notepad.

5. Then open the bucket and go to properties tab

  • Scroll down to bottom and find “Static website hosting” and click EDIT.
  • Click Enabled.
  • Under _Index _Document enter the name of the HTMl file that you have in your github repo.
    ** For ex:- index.html, app.html**

  • Click Save Changes.

6. Now under the Permission tab click Edit under Bucket Policy.

7. Click on Policy Generator.

  • Under Select Type of Policy choose S3 Bucket Policy.
  • For Principal enter * .
  • Under Actions _select _GetObject.
  • Under _ARN _paste the ARN that you copied in “Step 4”
  • Click Add Statement and then click Generate policy.
  • Copy the generated policy and paste it into the notepad.
  • Close the AWS Policy Generator tab.

8. Paste the policy under the Edit Bucket Policy tab.

  1. In the field Resource edit it to look like the following. 2.
{
…
“Resource”: “arn:aws:S3:::BUCKET-NAME/*”
…
}

Enter fullscreen mode Exit fullscreen mode

Image description

  1. Click Save Changes.

9. Now search for _CodePipeline _and open it’s console.

10. Click on Create Pipeline

  1. Give the pipeline a name then click on Next.
  2. Under Service Provider choose Github Version 2.
  • Click on Connect to GitHub.
  • Give a Connection Name.
  • Click on Install new app.
  • Select Install.
  • Click on Connect.
  • Select appropriate Repo name and Branch name.
  • Click Next _and click _Skip Build Stage.
  • In the Deploy Provider select S3 _and check the _Extract file before deploy box.
  • Click Next and click Create Pipeline.

Top comments (0)