Uploading Medium Articles with AWS Lambda

Medium itself does not support editing code blocks, and while the reason behind this is unclear (perhaps engineers are not the primary audience), one way to highlight code is by directly pasting images, or by posting it on Gist and then embedding it into the article.

While using images to showcase code can achieve the highlighting effect, it is quite unfriendly for engineers, as they cannot test the code through copy and paste, nor can they edit the article without manually editing the images, which can be quite cumbersome.

However, using Gist also comes with several issues:

• The mobile version cannot display it, and instead shows a link rather than the embedded content.
• Posting code to Gist can be too tedious. (However, using extensions like those for VSCode or Sublime to upload to Gist is a nice alternative.)

To enable highlighted code blocks on Medium, I ultimately decided to use AWS Lambda to address this issue.

AWS Lambda

For readers unfamiliar with Lambda, there are plenty of resources available online, so I won't dwell on that here. Lambda allows you to have AWS execute the functions you desire without needing to set up an actual server (though there is still a server behind the scenes). This way, you don't need to deploy a function to a machine or maintain it; you simply execute it.

Github Issue

To connect to the Lambda endpoint, I decided to trigger it via a GitHub webhook. GitHub allows you to write Markdown in issues, upload images (hosted by GitHub), preview, and use code blocks, which is quite convenient. When you're ready to publish an article, you can close the issue to trigger the webhook, which in turn uploads the code block to Gist via Lambda, and finally calls the Medium API to create the article.

Medium API

• https://github.com/Medium/medium-api-docs

The Medium API is concise and lightweight, yet very user-friendly. First, go to your personal page's settings > Integration tokens to generate a token, then use that token to call the API for creating articles.

Gist API

The Gist API operates similarly. To keep your Gist organized, it’s advisable to create a separate account specifically for storing code used in articles. Go to settings > developer settings > personal access token > generate token to create a token, making sure to check the Gist permission.

Connecting to Lambda

Once you've completed the preliminary work, you can start integrating with Lambda.

First, place the created Lambda endpoint into the GitHub webhook, and then find a package that can convert Markdown to HTML (I used marked). Combine these components, and you're good to go!

A simple implementation can be found here. Although it may seem a bit tedious, it’s actually quite convenient. I wonder when Medium will finally support code blocks. QQ.