Collage including the logos of Remix.run, fly.io & GitHub Actions followed by the articles headline

How to deploy Remix πŸ’Ώ to fly.io using GitHub Action

Published:Β 
Last updated:Β 

Table of contents

fly.io access token

When you've registered for an account with fly.io, you can go to your account settings to get yourself an active token.

Click on the "Create access token" button and give it a descriptive name, I named mine "gh_worker_canrau.com".

Copy the token (it's the only time you'll get to see it) and then go to your GitHub repository's settings, and select "Secrets" in the left menu then click on "New repository secret".

OR

type your GitHub username/repo to generate the settings link

Give it the name FLY_API_TOKEN and value of the before copied access token you've got from fly.io, click "Add secret" and your done.

GitHub Action

This one is independent of your package manager, it just cancels any previous builds, checks out your repo and tells fly to build it. So it completely depends on it beeing fly.io compatible, probably via a Dockerfile.

# .github/workflows/deployment.yml

name: πŸš€ Deploy to Fly πŸš€
on:
  push:
    branches:
      - main
  pull_request: {}

jobs:
  deploy:
    name: πŸš€ Deploy
    runs-on: ubuntu-latest
    steps:
      # Although I'm not building that often, so far
      # it seems pretty useful to have in place,
      # for example when trying to debug something you need to deploy πŸ§‘β€πŸ”§
      - name: πŸ›‘ Cancel Previous Runs
        uses: styfle/cancel-workflow-[email protected]

      # This step checks out a copy of your repository.
      - uses: actions/[email protected]

      # This step runs `fly(ctl) deploy`.
      - name: πŸš€ Deploy
        uses: superfly/flyctl-[email protected]
        env:
          FLY_API_TOKEN: ${{ secrets.FLY_API_TOKEN }}
        with:
          args: "deploy --build-arg COMMIT_SHA=${{ github.sha }}"

Updated to reflect the PR #3 by @MichaelDeBoey93 which updates styfle/cancel-workflow-action from 0.6.0 to 0.9.1 and defaults to use the GITHUB_TOKEN so no need to pass it manually - Thanks πŸ™

I'm going to keep it updated with my actual Action.

If you want more inspiration on what you can do with your Remix app in a GitHub Action, check out Kent C. Dodds deployment.yml, this is also where I got mine from. πŸ˜‡

Cloudflare Workers

If you're using Cloudflare Workers you might get results with this workflow I've found in the Remix Discord. Not using Workers so can't vouch for it.

Can Rau
Can Rau

Doing web-development since around 2000, building my digital garden with a mix of back-to-the-roots-use-the-platform and modern edge-rendered-client-side-magic tech πŸ“»πŸš€

Living and working in Cusco, PerΓΊ πŸ¦™