# Using GitHub Actions to build and deploy my site to Fastly

Published: 2023-05-11

In my [previous post](https://speek.dev/blog/migrating-to-fastly), I showed you how I migrated my [Astro](https://astro.build/) site and blog (this very one you’re reading) from [Netlify](https://netlify.com) to [Fastly](https://fastly.com)’s [Compute@Edge](https://www.fastly.com/products/edge-compute) using [Static Publisher](https://github.com/fastly/compute-js-static-publish). Now I'm gonna walk you through how to build and deploy it using [GitHub Actions](https://github.com/features/actions).

First, create yourself a new `.github` directory at the root of your project. Within the `.github` directory, add another directory called `workflows`. Finally, add a `deploy.yml` file inside the `workflows` directory. It should look like this:

```
.github/
  workflows/
    deploy.yml
```

Next, inside your `deploy.yml` file, add the following:

```yaml
name: Deploy Application
on:
  push:
    branches: [main]

jobs:
  build:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v3

      - name: Install project dependencies
        run: npm install

      - name: Build project
        run: npm run build

      - name: Install Fastly dependencies
        run: npm install
        working-directory: ./compute-js

      - name: fastly compute deploy
        uses: fastly/compute-actions@v5
        with:
          project_directory: “compute-js”
          comment: “Deployed via GitHub Actions”
        env:
          FASTLY_API_TOKEN: ${{ secrets.FASTLY_API_TOKEN }}
```

This will create a workflow called “Deploy Application”. The workflow will run every time you push changes to the `main` branch.

Under `jobs`, we are using the latest version of Ubuntu, installing the dependencies I’ve specified in my root directory’s `package.json` file. Then it’ll run a build of the site, placing the static build files in the `./dist` directory (default for Astro). Next, it’s going to install the dependencies specified in the `./compute-js` directory that was created by Static Publisher. Finally, it’s going to use the Fastly Compute Action to deploy the build to my Compute@Edge service, using the `compute-js` directory as the `project-directory` option.

For that deploy action, we will need to use a Fastly API token - which you can [grab from the Fastly UI](https://docs.fastly.com/en/guides/using-api-tokens#creating-api-tokens). To store and use this token, you can head into your project’s settings, click on “Settings and variables” and then click on “Actions”. Here, you can create a “New repository secret”.

![Setting Action secrets in the GitHub UI](https://speek.dev/images/github-secret.webp)

Once you’ve added that, you’re ready to push your latest changes up to GitHub (assuming you’ve done so on the branch you specified for you Action) and see it running.

![Completed GitHub Action](https://speek.dev/images/github-action.webp)

If you were to go change some content on your site - you’d be able to go see the new changes have in-fact been deployed 🎉 Since it’s running on Fastly’s Compute@Edge, there’s no need to purge the cache either 🙌