Deploying sites
GitHub Actions

Deploying with Github Actions

⚠️

This reference assumes you already have access to a Distributed Press API instance. You can either self-host your own instance of Distributed Press, use Sutty, or contact a member of the Distributed Press team for access to our managed API server.

This Github action (opens in a new tab) will tar your site together into a single file and use the Distributed Press API to create and make updates to the content published on your web server every time it is triggered. This particular project is triggered when you push to the main branch of the Github Repo the Github Action is created in.

In order to get access to use the resources provided by Distributed Press, you will need to get an API Key from whomever is hosting the instance that allows you (or in this case, Github Actions) to create and make changes to a site.

If you are used to deploying to GitHub pages or any other hosting provider that uses GitHub actions, actions-distributed-press allows you to just add a single step to your actions workflow to also deploy a bundle of static files to Distributed Press.

Distributed Press only supports deploying a folder of static files. Most frameworks like Next.js, React, and Hugo, allow you to 'export' or 'build' your site as bunch of static files.

See the source Github Action here (opens in a new tab)

To your existing action workflow, add a step to publish to Distributed Press. Additionally, add an encrypted secret in your repository (opens in a new tab) containing a valid refresh token issued your specified Distributed Press API instance.

The name of the secret should be REFRESH_TOKEN and the value should be the JWT itself. If you are unsure where to get a JWT token, see the reference on authorization.

jobs:
  deploy:
    runs-on: ubuntu-20.04
    steps:
      - uses: actions/checkout@v2
        ... steps to build your site go here 
      - name: Publish to Distributed Press
        uses: hyphacoop/actions-distributed-press@v1.1
        with:
          publish_dir: public                           # (optional) defaults to /public
          dp_url: https://your-hosted.dp.instance       # URL of Distributed Press API Instance (include http/https)
          refresh_token: ${{ secrets.REFRESH_TOKEN }}   # Refresh token 
          site_url: docs.distributed.press              # Site domain (as created through the API) 
          deploy_http: false
          deploy_hyper: true
          deploy_ipfs: true

Example Next.js Deployment

In your repository, create a new file github/workflows/deploy-distributed-press.yaml

deploy-distributed-press.yaml
name: "Publish GitHub Action"
on:
  push:
    branches:
      - main
 
jobs:
  publish:
    runs-on: ubuntu-latest
    steps:
    - uses: actions/checkout@v3
    - name: Use Node.js 18
      uses: actions/setup-node@v3
      with:
        node-version: 18
    - run: npm ci
    - run: npm run build
    - name: Publish to Distributed Press
      uses: hyphacoop/actions-distributed-press@v1.1
      with:
        publish_dir: public
        dp_url: https://your-hosted.dp.instance
        refresh_token: ${{ secrets.REFRESH_TOKEN }}
        site_url: docs.distributed.press

This will build and publish your site to the Distributed Press instance hosted at https://your-hosted.dp.instance

The with: section of the Github Action has a some fields which are required, such as refresh_token and site_url (if you are hosting an HTTP site), since they are unique to your site. The other fields that you want to specify can be also be added to your Github action to customize your site deployment.

Each of the deploy_http:, deploy_hyper:, and deploy_ipfs: can be true or false, depending on whether you want the website to be deployed via that protocol. The refresh_token should contain a Github secret that you set up earlier, and the site_url field should contain the subdomain you set up to host your website.

Powered By Distributed Press

We'd appreciate if you embedded the following HTML snippit on your DP-published sites to help spread the word. What's cool is it will load the site over the same protocol as the one used to access your site.

<div style="display: inline-block; text-align: center; margin-top: 20px; padding: 8px;">
  <div>Powered by</div>
  <a href="//distributed.press" target="_blank">
    <img
      alt="Distributed Press"
      src="//distributed.press/img/logos/logo-distributedpress-grey.png"
      style="width: 123px; height: auto; margin-top: 10px;"
    />
  </a>
  <p>
    <a href="//reader.distributed.press" target="_blank">Follow on ActivityPub</a> |
    <a href="//docs.distributed.press" target="_blank">Learn More</a>
  </p>
</div>

distributed press snippet