Bridgetown is something like Jekyll, I’m not sure how the internal works, but it helps you to create a static site. It means, any project created with Bridgetown or any other SSG needs to build or in other words exports the HTML, CSS, and JS files. It’s different with something like WordPress where each request will call something on the server, read the database and returning a response. What we get from SSG is a static files, that’s why they called Static Site Generator.
The original developer using Github Action to host the static files on his ftp server somewhere. I don’t want to rent an additional server just to host my website. So, I turn to Netlify service where they can host my static files freely. Here’s the original
deploy.yml that configured the workflow:
name: Build and deploy site on: push: branches: - main schedule: # Redeploy site at 9:00 UTC every day. - cron: "0 9 * * *" jobs: deploy: runs-on: ubuntu-latest steps: - name: Checkout code uses: actions/checkout@v3 - name: Setup Ruby and install gems uses: ruby/setup-ruby@v1 with: bundler-cache: true - name: Setup Node uses: actions/setup-node@v3 with: node-version: "16" cache: "yarn" - run: yarn install - name: Build env: BRIDGETOWN_ENV: production run: bin/bridgetown deploy - name: Deploy site uses: firstname.lastname@example.org with: switches: -rtzq --progress --del path: output/ remote_host: $ remote_key: $ remote_key_pass: $ remote_path: $ remote_user: $
As you can see on Deploy site step, it uses rsync to upload the generated static files. Here’s I change the steps from using rsync to publicly available Netlify action
- name: Deploy site uses: email@example.com with: publish-dir: output/ production-branch: main github-token: $ deploy-message: "Deploy from GitHub Actions" enable-pull-request-comment: false enable-commit-comment: true overwrites-pull-request-comment: true env: NETLIFY_AUTH_TOKEN: $ NETLIFY_SITE_ID: $ timeout-minutes: 1
Github Actions will have access to
secrets.GITHUB_TOKEN automatically each time the action was triggered. What we need to do is providing netlify auth token and the site id.
Since Netlify doesn’t know how to handle Bridgetown, I can’t choose Import an existing project or Start from a template. So, here I choose Deploy manually.
I don’t know how, but I can’t create empty Netlify site. To provide what being asked, I create a new folder, touch an
index.html file and upload it. That way I could get a new Netlify site running. Once it created, access the site and choose Site settings menu.
Here we can get the side id.
On Github repository page, open Settings tab and access Actions menu under Secrets and Variables.
Click the green New repository secre and input the data. Just make sure the name are the same.
To get Netlify personal access token, go to User settings > Application and click New access token.
Once you get the access token, add it to Github Secrets.
Now, every commit to main branch will trigger Github Action to run, build the static files and upload it to Netlify site.