Deploy React project to S3 by using CI/CD pipelines (Part 1)

Dmitry Broshkov
3 min readSep 23, 2021

--

For deploying our solutions, in most cases, we use AWS. In this article we would like to look deeper on deploy to S3, which could be used as static website. In first part we will make S3 configuration, optimisation and automate manual work with CodeBuild will be in next part.

1. Create S3 bucket

Go to AWS, find it through the search bar S3. Click “Create bucket”.

Insert you bucket name

Uncheck and scroll down. Put a tick in the line that appears

Then scroll down and select “Enable” in the “Bucket Versioning” and “Default encryption” fields.

Ready. Click Create bucket

2. Setting up for hosting

In the list of buckets that opens, click on the one we just created.

Then select the “Properties” tab.
Scrolling to the bottom:

Go to Static website hosting and click Edit.

Click Enable. Go down a little lower and enter “index.html” into the index document and error document:

Save changes

4. Bucket policy

Next, go to the Permissions tab:

Scroll to Bucket policy and click Edit:

Enter this code

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

Here replace “pipeline-app-test” with the name of your bucket.

Save changes.
We are done with the creation of the S3 bucket. Now let’s move on to configuring CodeBuild.

Continue https://zenbit-tech.medium.com/react-project-ci-cd-configuration-with-s3-bucket-part-2-d99e416531bb

This instruction have been inspired by @lyuda.dzyubinska and created with @illia.filatov.hn support

--

--

Dmitry Broshkov

Custom software and cloud Solutions | Data engineering Talks about #medtech, #appdevelopment and #softwaredevelopment