DEV Community

Atsushi Miyamoto
Atsushi Miyamoto

Posted on • Edited on

Automate your post to dev.to by using Github Actions

I've automated dev.to posting by using GitHub Actions and golang. Also, blog content is markdown-based managing. So you can write your blog content using your favourite IDE. Hope this solution is to improve some people's productivity.

How many minutes to set up?

It might take only 5 minutes to set up your dev.to post automation.

Let's start setting up!

You can copy my template repo from my GitHub or create your original.

This time I will describe how you set up your automation posting using my template!

There are 5 steps to setup.

  • 1. Copy template
  • 2. Create dev.to API Key
  • 3. Set dev.to API Key to GitHub actions secret
  • 4. Set up GitHub actions workflow
  • 5. Run go program to generate new blog post.
  • 6. Write your blog post!

1. Copy template

To copy the template, go to GitHub and click Use this template button to copy a template! I recommend you create the private repository. So your blog post can be safe.

Image description

2. Create dev.to API Key

It would be best if you created your API Key to post your blog post to dev.to.

Don't worry, it is easy.

First, click your icon to open the dropdown then click settings.

Image description

After that, click the ⚡️ Extensions.

Image description

Then finally, go to bottom and generate your API Key!

Image description

3. Set dev.to API Key to GitHub actions secret

I use GitHub actions to automate posts to dev.to. So need to set dev.to API Key to GitHub actions secret.

At the first, go to your dev.to template repo on your GitHub and click Settings.
Then click Secrets and Variables > Actions. It is in the Security section.

Image description

After that click the New repository secret button.

Image description

Set DEV_TO_API_TOKEN to Name and your dev.to API Key to Secret.

Image description

4. Set up GitHub actions workflow

I use the below package for content proofing.

  • textlint
  • Prettier
  • Embedme
      - name: Post
        run: DEV_TO_GIT_TOKEN=${{ secrets.DEV_TO_API_TOKEN }} yarn run dev-to-git
Enter fullscreen mode Exit fullscreen mode

The above step is important to post your blog to dev.to automatically.
During this step, set your secret variable to DEV_TO_GIT_TOKEN and then run dev-to-git.
dev-to-git is implemented by maxime1992

Thank you for implementing this awesome OSS.

name: Post to dev.to

on:
  push:
    branches: [ main ]
  pull_request:

jobs:
  build:
    name: Build
    if: github.event_name == 'pull_request'
    runs-on: ubuntu-latest
    strategy:
      matrix:
        node-version: [18]
    steps:
      - name: Checkout
        uses: actions/checkout@v3
      - uses: actions/setup-node@v3
        with:
          node-version: ${{ matrix.node-version }}
          cache: yarn
      - run: yarn

      - name: Install textlint
        run: 'yarn add -D textlint textlint-rule-common-misspellings textlint-rule-spellchecker'

      - name: Run textlint
        run: npx textlint -f checkstyle "posts/**/*.md" >> .textlint.log

      - name: Run Prettier
        run: yarn run prettier:check

      - name: Run Embedme
        run: yarn run embedme:check

  Post:
    name: Post
    if: github.ref == 'refs/heads/main' && github.event_name == 'push'
    runs-on: ubuntu-latest
    steps:
      - name: Checkout
        uses: actions/checkout@v3
      - uses: actions/setup-node@v3
        with:
          node-version: ${{ matrix.node-version }}
          cache: yarn
      - run: yarn

      - name: Post
        run: DEV_TO_GIT_TOKEN=${{ secrets.DEV_TO_API_TOKEN }} yarn run dev-to-git

Enter fullscreen mode Exit fullscreen mode

5. Run go program to generate new blog post.

I implemented the go program to create a draft post with just one cmd.

But wait, before running the cmd, you need to set your dev.to API key to .env file.
I already prepared .env.sample file so you can just type the below cmd to create a .env file.

cp .env.sample .env
Enter fullscreen mode Exit fullscreen mode

After running the above command you have to create a .env file and finally, you can add your API key to the below part of the code in your .env file.

export DEV_TO_GIT_TOKEN=
Enter fullscreen mode Exit fullscreen mode

Then now you can create your blog template by running the below cmd!

  • You must have imported golang to your PC.
go run main.go
Enter fullscreen mode Exit fullscreen mode

the prompt shows the below question. You can type the name of the article.

Enter the name of the new article:
Enter fullscreen mode Exit fullscreen mode

Then, the directory is automatically created under the posts/ dir. In this case, I typed the test as a name.

Image description

And also, the dev-to-git.json was updated, program added {"id":***,"relativePathToArticle": ***}. It is necessary to manage your post.

You can manage whether your post will be a draft or public to change the published section on generated .md file.

---
title: ***
published: false
description: description
tags:
---
Enter fullscreen mode Exit fullscreen mode

6. Write your blog post!

Finally, write your blog post to generate a .md file!
If need to add an image to your post, you can save image into /assets folder and then add the relative path to your post!

e.g.
![alt](https://raw.githubusercontent.com/atsushii/dev.to/master/posts/Automate-your-post-to-dev.-to-by-github-actions/assets/** 'title')

Enter fullscreen mode Exit fullscreen mode

Conclusion

That's it!!
Now push your files to Github and merge them into the main branch. The CI automatically post your content!

Reference:

Manage your dev.to blog posts from a GIT repo and use continuous deployment to auto publish/update them - DEV Community

Top comments (0)