Point the deploy file at your bucket

Read the two buildspecs, then change the hard-coded bucket in your fork. This is the step that makes the original repo unusable.

About 15 min · Verified 8 October 2026

0 of 4 steps done0%

On this page

buildspec-web.yml: test and build
buildspec-web-deploy.yml: publish to S3
Change it in your fork
Make sure you are on main in your own clone
Replace the bucket and the Region
Check the result
Commit and push to your fork

Two files drive the frontend pipeline. One of them contains something that must be edited for your AWS account.

buildspec-web.yml: test and build#

deploy/buildspec-web.yml

version: 0.2
phases:
  install:
    runtime-versions:
      nodejs: 20
  build:
    commands:
      - npm --prefix shortlink-web ci
      - npm --prefix shortlink-web test
      - npm --prefix shortlink-web run build
artifacts:
  files:
    - shortlink-web/dist/**/*
    - deploy/buildspec-web-deploy.yml
  exclude-paths:
    - shortlink-web/dist/**/*.map

It installs, tests and builds. Any failing command stops the pipeline before anything is published.
The artifacts list contains the built site and the next stage's buildspec. The deploy project reads its buildspec from the artifact it receives, which is why that file is shipped along.
Source maps (*.map) are left out of the artifact, so they never reach the public bucket.
VITE_API_BASE_URL is not in this file. It is set as an environment variable on the CodeBuild project (next chapters), so the API address is configuration, not code.

buildspec-web-deploy.yml: publish to S3#

This is the file as it exists in the original repository. Look at the bucket name:

deploy/buildspec-web-deploy.yml (original)

version: 0.2
phases:
  build:
    commands:
      - test -f shortlink-web/dist/index.html
      - aws s3 sync shortlink-web/dist/ s3://INSTRUCTORS-BUCKET-NAME/ --delete --region INSTRUCTORS-REGION
      - aws s3 cp shortlink-web/dist/index.html s3://INSTRUCTORS-BUCKET-NAME/index.html --cache-control 'no-cache' --content-type 'text/html' --region INSTRUCTORS-REGION

(In the real file INSTRUCTORS-BUCKET-NAME is a concrete bucket that belongs to the instructor's AWS account.)

Command	Purpose
`test -f …/index.html`	A safety check: if the build produced no home page, stop before `--delete` can empty the site
`aws s3 sync … --delete`	Make the bucket match the build exactly: upload new files, remove old ones
`aws s3 cp … index.html --cache-control 'no-cache'`	Hashed asset files can be cached forever, but `index.html` must be re-checked on every visit so visitors see new releases

Change it in your fork#

Make sure you are on main in your own clone#

Your computerStart from a clean main

git switch main
git pull origin main
git remote -v

The origin URL must contain your username.

Replace the bucket and the Region#

This changes every s3://… bucket and every --region … in the file, so you cannot miss one.

Your computerEdit deploy/buildspec-web-deploy.yml

sed -i.bak -E 's#s3://[^/ ]+#s3://<WEB_BUCKET>#g; s#--region [a-z0-9-]+#--region ap-south-1#g' deploy/buildspec-web-deploy.yml
rm deploy/buildspec-web-deploy.yml.bak

Replace <WEB_BUCKET> with your own value (or fill in the known ones once under My values at the top of the page).

Your computerEdit deploy/buildspec-web-deploy.yml

(Get-Content deploy/buildspec-web-deploy.yml) `
  -replace 's3://[^/ ]+', 's3://<WEB_BUCKET>' `
  -replace '--region [a-z0-9-]+', '--region ap-south-1' |
  Set-Content deploy/buildspec-web-deploy.yml

Replace <WEB_BUCKET> with your own value (or fill in the known ones once under My values at the top of the page).

Open deploy/buildspec-web-deploy.yml and replace the bucket name (three places: two s3://… and the one in the cp line) and the two --region values by hand.

Check the result#

Your computerReview exactly what changed

git diff deploy/buildspec-web-deploy.yml

The file should now look like this, with your bucket and Region:

deploy/buildspec-web-deploy.yml (yours)

version: 0.2
phases:
  build:
    commands:
      - test -f shortlink-web/dist/index.html
      - aws s3 sync shortlink-web/dist/ s3://<WEB_BUCKET>/ --delete --region ap-south-1
      - aws s3 cp shortlink-web/dist/index.html s3://<WEB_BUCKET>/index.html --cache-control 'no-cache' --content-type 'text/html' --region ap-south-1

Replace <WEB_BUCKET> with your own value (or fill in the known ones once under My values at the top of the page).

Only the bucket and Region lines may differ from the original. If anything else changed, run git checkout deploy/buildspec-web-deploy.yml and start again.

Commit and push to your fork#

Your computerCommit and push

git add deploy/buildspec-web-deploy.yml
git commit -m "chore(deploy): publish the website to my own bucket"
git push origin main

Prefer a setup without a bucket name in Git?

A cleaner design keeps the bucket and Region out of the repository entirely and reads them from the CodeBuild project's environment. Change the file to:

deploy/buildspec-web-deploy.yml (alternative)

version: 0.2
phases:
  build:
    commands:
      - test -f shortlink-web/dist/index.html
      - aws s3 sync shortlink-web/dist/ "s3://$WEB_BUCKET/" --delete --region "$AWS_DEFAULT_REGION"
      - aws s3 cp shortlink-web/dist/index.html "s3://$WEB_BUCKET/index.html" --cache-control 'no-cache' --content-type 'text/html' --region "$AWS_DEFAULT_REGION"

Then give the shortlink-web-deploy project a plaintext environment variable WEB_BUCKET set to your bucket name. The same file now works for every participant, which is why this is better for real projects. The guide follows the simple, explicit version above because it matches the reference setup and is easier to read.

Next: connect GitHub.

Found a mistake? Edit this page on GitHub.