How to publish a Medium post via GitHub issue tracker?

[ccniuj]

ref: GitHub webhook guide ref: Medium API doc ref: Medium node SDK ref: Webhook server

For the past one month, I use GitHub issue tracker to note what I have learned everyday. But what if I want to post these notes on Medium?

Use GitHub webhook + Medium SDK

Of course we don't need to copy-and-paste every post. We can use Github webhook and Medium SDK to achieve this goal.

There are few steps:

1. Deploy a server to receive the webhook
2. On the Github repo, setup GitHub repo's web-hook
3. On the server, extract the data from the webhook and post via Medium SDK

Let's do it step by step.

1. Deploy a server to receive the webhook

First, we need to make a very tiny server and open an endpoint github_api_callback:

var express = require('express')
var bodyParser = require('body-parser')

var app = express()
app.use(bodyParser.json());

app.get('/', function (req, res) {
  res.send('Hello World!')
})

app.post('/github_api_callback', function (req, res) {
  // do something
  res.send('callback!')
})

app.listen(3000, function () {
  console.log('Webhook server is listening on port 3000!');
})

2. Setup GitHub repo's webhook

For example, we have a GitHub repo til. Navigate to settings tab, select webhook on the sidebar, and click Add webhook:

Here Payload URL is where we need to put the the webhook url, which is the endpoint /github_callback_api we created in step 1. Next, select event issues since we need to gather issue tracker's event.

3-1. Extract data from the webhook

Every action we do on an issue will trigger the webhook. Eventually we will receive a lot of events and data. In what condition should we post to Medium? I use 2 conditions.

1. When the action is labeld, which occurs when label any tag on an issue.
2. When the issue has the label Publushed.

This means: it should be posted on medium if an issue is labeled with tag Published. Let's take a look on the implementation:

// GitHub_receiver
module.exports = {
  inspect: function(payload) {
    var labeled = (payload.action == 'labeled')
    var published = (payload.issue.labels.findIndex(function(label) {
                      return label.name == 'Published'
                    }) != -1)

    return (labeled && published) ? 
            {
              shouldPublish: true,
              payload: {
                title: payload.issue.title,
                body: payload.issue.body
              }
            } : { shouldPublish: false }
  }
}

3-2. Post via Medium SDK

Finally, we need to post on Medium. To achieve this, we need to get the access token first. Just navigate to the setting page to get the token.

Next, install medium SDK. Then we can post to Medium without a pain! Let's see what is going on:

// medium_publisher
var medium = require('medium-sdk')

module.exports = {
  publish: function(payload) {
    var client = new medium.MediumClient({
      clientId: process.env.CLIENT_ID,
      clientSecret: process.env.CLIENT_SECRET
    })
    client.setAccessToken(process.env.ACCESS_TOKEN)
    client.getUser(function (err, user) {
      client.createPost({
        userId: user.id,
        title: payload.title,
        contentFormat: medium.PostContentFormat.MARKDOWN,
        content: payload.body,
        publishStatus: medium.PostPublishStatus.DRAFT
      }, function (err, post) {
        if (err) {
          console.log(err)
        }
      })
    })
  }
}

Here is the final webhook server:

// index.js
// ...
app.post('/github_api_callback', function (req, res) {
  var result = receiver.inspect(req.body)

  if (result.shouldPublish) {
    publisher.publish(result.payload)
  }

  res.send('callback!')
})
// ...

That's it! Happy posting!

[uglow]

Hi @juinc, how would I go about doing this in reverse (modify my repo (create a new markdown file) when I post something on Medium) ? I'm running a blog on GitHub Pages but plan to publish most of my articles on Medium.