skip to Main Content

I having trouble when developing and uploading my react app to aws s3

My Folder structure is as follows

  • React App (root folder)
    • index.html
    • styles.css
    • script.js
  • src
  • infra
    • main.tf

infra folder is in the root folder React App

My code to upload all the content is below:

  resource "aws_s3_bucket_object" "react_app_files" {
  for_each = fileset("../../ReactApp", "**")

  bucket = aws_s3_bucket.test_app_bucket.id
  key    = each.key
  source = "${path.module}/../../ReactApp/${each.key}"
  etag   = filemd5("${path.module}/../../ReactApp/${each.key}")

  depends_on = [aws_s3_bucket.test_app_bucket]
}

The problem I am having is while uploading the infra folder also gets uploaded. What edits I can make in my code, to avoid the infra folder from being uploaded to s3 bucket as I do not want that. Upload everything but the infra folder. Thanks in advance

2

Answers


  1. One simple way is to move the ReactApp folder within your infra folder. Otherwise you can keep it fully separate and refer to provide absolute path to that folder(But I am not sure if fileset supports absolute paths).

    Login or Signup to reply.
  2. Its generally recommended to decouple the provisioning of the underlying infrastructure (In your case a static website hosting) from the process of populating data inside the infrastructure. By doing do, you get to re-use the process built for updating the files in the bucket without the risk of damaging the underlying infrastructure.

    You can use the following code to sync up your static assets to your S3 bucket:

    aws s3 sync . "s3://${MAIN_BUCKET_NAME}" --delete --profile $AWS_PROFILE
    

    If you need samples on how to provision a WAF and CloudFront protected S3 static site, please visit this Github repository

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search