

# Deploying a static website to Amplify from an Amazon S3 bucket
<a name="deploy-website-from-s3"></a>

You can use the integration between Amplify Hosting and Amazon S3 to host static website content stored on S3 with just a few clicks. Deploying to Amplify Hosting provides you with the following benefits and features.
+ Automatic deployment to the globally available AWS content delivery network (CDN) powered by CloudFront
+ HTTPS support
+ Easily connect your website to a custom domain using the Amplify console
+ Bring your own Custom SSL certificates
+ Monitor your website with built in access logs and CloudWatch metrics
+ Set up password protection for your website
+ Create redirect and rewrites rules in the Amplify console

You can start the deployment process from the Amplify console, the AWS CLI, or the AWS SDKs. You can only deploy to Amplify from an Amazon S3 general purpose bucket located in your own account. Amplify doesn't support cross-account S3 bucket access.

When you deploy your application from an Amazon S3 general purpose bucket to Amplify Hosting, AWS charges are based on Amplify's pricing model. For more information, see [AWS Amplify Pricing](https://aws.amazon.com/amplify/pricing/).

**Important**  
Amplify Hosting is not available in all of the AWS Regions where Amazon S3 is available. To deploy a static website to Amplify Hosting, the Amazon S3 general purpose bucket containing your website must be located in a region where Amplify is available. For the list of regions where Amplify is available, see [Amplify endpoints](https://docs.aws.amazon.com/general/latest/gr/amplify.html#amplify_region) in the *Amazon Web Services General Reference*.

See the following topics to learn how to deploy and update a static website from Amazon S3 to Amplify Hosting.

**Topics**
+ [Deploying a static website from S3 using the Amplify console](deploy--from-amplify-console.md)
+ [Creating a bucket policy to deploy a static website from S3 using the AWS SDKs](deploy-with-sdks.md)
+ [Updating a static website deployed to Amplify from an S3 bucket](update-website-deployed-from-s3.md)
+ [Updating an S3 deployment to use a bucket and prefix instead of a .zip file](update-s3-zip-to-bucket.md)

# Deploying a static website from S3 using the Amplify console
<a name="deploy--from-amplify-console"></a>

Use the following instructions to deploy a new static website from an Amazon S3 general purpose bucket using the Amplify console.

**To deploy a static website from an Amazon S3 general purpose bucket using the Amplify console**

1. Sign in to the AWS Management Console and open the Amplify console at [https://console.aws.amazon.com/amplify/](https://console.aws.amazon.com/amplify/).

1. On the **All apps** page, choose **Create new app**.

1. On the **Start building with Amplify** page, choose **Deploy without Git**.

1. Choose **Next**.

1. On the **Start a manual deployment** page, do the following.

   1. For **App name**, enter the name of your app.

   1. For **Branch name**, enter the name of the branch to deploy.

1. For **Method**, choose **Amazon S3**.

1. For the **S3 location of objects to host**, choose **Browse**. Select the Amazon S3 general purpose bucket to use, then select **Choose prefix**.

1. Choose **Save and deploy**.

# Creating a bucket policy to deploy a static website from S3 using the AWS SDKs
<a name="deploy-with-sdks"></a>

You can use the AWS SDKs to deploy a static website from Amazon S3 to Amplify Hosting. If you deploy your website using an SDK, you must create your own bucket policy that grants Amplify Hosting permission to retrieve the objects in your S3 bucket.

To learn more about creating bucket policies, see [Bucket policies for Amazon S3](https://docs.aws.amazon.com/AmazonS3/latest/userguide/bucket-policies.html) in the *Amazon Simple Storage Service User Guide*.

The following example bucket policy grants Amplify Hosting permissions to list buckets and retrieve bucket objects for the specified AWS account, Amplify application id, and branch.

To use this example:
+ Replace *amzn-s3-demo-website-bucket/prefix* with the name of your website's bucket and prefix.
+ Replace *111122223333* with your AWS account id.
+ Replace *region-id* with the AWS Region that your Amplify application is located in, such as **us-east-1**.
+ Replace *app\$1id* with you Amplify application id. This information is available in the Amplify console.
+ Replace *branch\$1name* with your branch name.

**Note**  
In your bucket policy, the `aws:SourceArn` must be a URL-encoded (percent-encoding) branch ARN.

------
#### [ JSON ]

****  

```
{
    "Version":"2012-10-17",		 	 	 
    "Statement": [
        {
            "Sid": "AllowAmplifyToListPrefix_appid_branch_prefix_",
            "Effect": "Allow",
            "Principal": {
                "Service": "amplify.amazonaws.com"
            },
            "Action": "s3:ListBucket",
            "Resource": "arn:aws:s3:::amzn-s3-demo-website-bucket/prefix/*",
            "Condition": {
                "StringEquals": {
                    "aws:SourceAccount": "111122223333",
                    "aws:SourceArn": "arn%3Aaws%3Aamplify%3Aregion-id%3A111122223333%3Aapps%2Fapp_id%2Fbranches%2Fbranch_name",
                    "s3:prefix": ""
                }
            }
        },
        {
            "Sid": "AllowAmplifyToReadPrefix__appid_branch_prefix_",
            "Effect": "Allow",
            "Principal": {
                "Service": "amplify.amazonaws.com"
            },
            "Action": "s3:GetObject",
            "Resource": "arn:aws:s3:::amzn-s3-demo-website-bucket/prefix/*",
            "Condition": {
                "StringEquals": {
                    "aws:SourceAccount": "111122223333",
                    "aws:SourceArn": "arn%3Aaws%3Aamplify%3Aregion-id%3A111122223333%3Aapps%2Fapp_id%2Fbranches%2Fbranch_name"
                }
            }
        },
        {
            "Effect": "Deny",
            "Principal": "*",
            "Action": "s3:*",
            "Resource": "arn:aws:s3:::amzn-s3-demo-website-bucket/*",
            "Condition": {
                "Bool": {
                    "aws:SecureTransport": "false"
                }
            }
        }
    ]
}
```

------

# Updating a static website deployed to Amplify from an S3 bucket
<a name="update-website-deployed-from-s3"></a>

If you update any of the objects for a static website in general purpose S3  bucket hosted on Amplify, you must redeploy the application to Amplify Hosting to cause the changes to take effect. Amplify Hosting doesn't automatically detect changes to the S3 bucket. We recommend that you use the AWS Command Line Interface (CLI) to update your website.

**Sync updates to S3**

After you make changes to your website's project files, use the following [s3 sync](https://awscli.amazonaws.com/v2/documentation/api/latest/reference/s3/sync.html) command to synchronize the changes that you made to your local source directory with your target Amazon S3 general purpose bucket. To use this example, replace *<source>* with the name of your local directory and *<target>* with the name of your Amazon S3 bucket.

```
aws s3 sync <source> <target>
```

**Redeploy the website to Amplify Hosting**

Use the following [amplify start-deployment](https://awscli.amazonaws.com/v2/documentation/api/latest/reference/amplify/start-deployment.html) command to redeploy your updated application in an Amazon S3 bucket to Amplify Hosting. To use this example, replace *<app\$1id>* with the id of your Amplify application, *<branch\$1name>* with the name of your branch, and *s3://amzn-s3-demo-website-bucket/prefix* with your S3 bucket and prefix. .

```
aws amplify start-deployment --app-id <app_id> --branch-name <branch_name> --source-url s3://amzn-s3-demo-website-bucket/prefix --source-url-type BUCKET_PREFIX
```

# Updating an S3 deployment to use a bucket and prefix instead of a .zip file
<a name="update-s3-zip-to-bucket"></a>

If you already have an existing static website deployed to Amplify Hosting from a .zip file in an Amazon S3 general purpose bucket, you can update the application deployment to use the bucket name and prefix that contain the objects to host. This type of deployment eliminates the need to upload a separate file to your bucket that contains the zipped contents of the build output.

**To migrate a static website from a .zip file to the bucket contents**

1. Sign in to the AWS Management Console and open the Amplify console at [https://console.aws.amazon.com/amplify/](https://console.aws.amazon.com/amplify/).

1. On the **All apps** page, choose the name of the manually deployed app that you want to migrate from using a .zip file to using the application files directly.

1. On the application's **Overview** page, choose **Deploy updates**.

1. On the **Deploy updates** page, for **Method**, choose **Amazon S3**.

1. For the **S3 location of objects to host**, choose **Browse**. Select the bucket to use, then select **Choose prefix**.

1. Choose **Save and deploy**.