Slide 1

Slide 1 text

dev.toの記事もGitHubで管理し てみた 1

Slide 2

Slide 2 text

Name:ユータ Occupation:SRE Twitter:@Y0u281 (オーでなくゼロです) ブログ:https://zenn.dev/yuta28 自己紹介 Twitter 2

Slide 3

Slide 3 text

目次 ● 背景 ● dev.toについて ● dev.to管理用テンプレートリポジトリ ● dev.toとGitHubとの連携 ● まとめ 3

Slide 4

Slide 4 text

背景 ● Zennでブログ執筆中 ○ GitHub Actionsを使って記事の自動投稿を実現 ● dev.toでも同じように自動投稿を実現したい ● すでに実践している人がいたので参考にしてみた 詳しくはこちら↓ GitHub ActionsでZennブログの 校正を自動化してみた 4

Slide 5

Slide 5 text

dev.toについて ● 英語版Qiitaみたいなもの ● 爆速であることで有名 ○ 阿部寛さんのHPとどちらが速いか比較されたこともある ● スマホアプリ版もある DEV is a community of software developers getting together to help one another out. The software industry relies on collaboration and networked learning. We provide a place for that to happen. Aboutページより引用 5

Slide 6

Slide 6 text

dev.to管理用テンプレートリポジトリ 以下のリポジトリをコピーしてもらえたら皆さんもdev.toの記事をGitHubで管理できま す。 https://github.com/Yuhta28/dev-to-blog-template 6

Slide 7

Slide 7 text

DEV Community APIキー生成 GitHubにセットするAPIキー DEV API (beta) | Forem Docs APIはベータ版なのか若干動作不安 7

Slide 8

Slide 8 text

GitHub Actions用の変数セット 先ほど生成したAPIキーをセット 8

Slide 9

Slide 9 text

GitHub Actionsワークフロー設定 deploy: # 長いので記事投稿部分のみ抜粋 name: Deploy if: github.ref == 'refs/heads/main' && github.event_name == 'push' runs-on: ubuntu-latest steps: - name: Checkout Repo uses: actions/checkout@master - name: Install Dependencies uses: bahmutov/npm-install@v1 - name: Deploy to dev.to run: DEV_TO_GIT_TOKEN=${{ secrets.DEV_TO_GIT_TOKEN }} yarn run dev-to-git Yarnパッケージ ↑参照 dev-to-gitにAPIキーを渡す 9

Slide 10

Slide 10 text

記事の初期作成 dev.toのAPIリクエストで作成する curl -X POST -H "Content-Type: application/json" \ -H "api-key: API_KEY" \ -d \ '{"article":{"title":"Template","body_markdown":"Body","published":false,"tags":["tag1", "tag2"]}}' https://dev.to/api/articles 環境変数でセット 10 Goで作った

Slide 11

Slide 11 text

記事の初期作成 ドラフト記事作成 この記事のIDを取得する 11

Slide 12

Slide 12 text

記事IDの取得 curl -H "api-key: API_KEY" https://dev.to/api/articles/me/(un)published | \ jq '.[].id' プログラミング言語でも取得できますが、一部の言語では取得できませんでした。 例:Python dev-to-git.json 12

Slide 13

Slide 13 text

記事の校正 簡単な誤字脱字はtextlintと reviewdogでCI時に自動検知 13

Slide 14

Slide 14 text

記事のデプロイ 14

Slide 15

Slide 15 text

記事のデプロイ 15

Slide 16

Slide 16 text

まとめ ● ブログもGitHubで管理 ● 好きなエディターで記事を書こう ● GitHub Actionsはいいぞ! 16

Slide 17

Slide 17 text

ありがとうございました より詳しい内容は以下のブログで↓ dev.toの記事もGitHubで管理してみた (zenn.dev) 17