📝

オールインワンGitHubレポジトリ駆動型Dev.to記事管理システムの紹介

2025/05/09に公開

https://github.com/ken-okabe/devto-article-cli

 オールインワンGitHubレポジトリ駆動型Dev.to記事管理システムdevto-article-cliへようこそ！
このレポジトリは、Dev.to記事を管理するための中央ハブとして設計されています。
Node.jsコマンドラインツール本体を含むだけでなく、記事コンテンツの保存とバージョン管理のための主要システムとしても機能します（通常はarticles/ディレクトリ内に配置）。付属のCLIスクリプトにより、この統合されたローカルファースト環境から、Dev.to記事の作成、編集（Markdown）、Gitによるバージョン管理、公開までをシームレスに行うことができます。
このREADMEは、AIエージェント（GitHub Copilot、VSCode AIアシスタントなど）がこのツールを利用できるように解釈可能な形式で書かれています。

 機能ローカルで記事を書き、Gitでバージョン管理
簡単なコマンドでDev.toに新規記事を公開し、既存記事を更新
公開時に自動的にDev.to記事IDをMarkdownファイルに追加

自動画像処理: 公開時にMarkdown内のローカル相対画像パスをGitHubの絶対URLに変換（ローカルファイルは変更せず、プレビューが容易）
ローカル記事とDev.toの整合性チェック
CI不要；すべてローカル環境で処理
公開ワークフローのgit add、git commit、git pushを完全自動化
最新のForem API V1 (1.0.0)に準拠

 前提条件（ユーザーおよびAIエージェント向け）Node.js（LTS推奨）
Git
Dev.toアカウントとAPIキー

 セットアップ（ユーザーおよびAIエージェント向け）このレポジトリをフォーク（推奨）：

記事管理にこのツールを使用する場合、まずdevto-article-cliレポジトリを自分のGitHubアカウントにフォークします。これにより、記事を保存する個人用コピーが作成されます。
フォークしたレポジトリをクローン：
git clone https://github.com/YOUR_USERNAME/devto-article-cli.git
cd devto-article-cli
# YOUR_USERNAMEをあなたのGitHubユーザー名に置き換えてください
依存関係のインストール：

クローン/作成したディレクトリに移動し、必要なNode.jsパッケージをインストール：
npm install
TypeScriptのビルド：

distディレクトリを生成するプロセス：
npm run build
Dev.to APIキーの設定：

APIキーはDev.toの設定 > 拡張機能ページから取得します。
OSの環境変数DEV_TO_API_KEYとして設定します。
Windows（コマンドプロンプト/PowerShell）：
# コマンドプロンプト
setx DEV_TO_API_KEY "your_api_key"
# PowerShell
[System.Environment]::SetEnvironmentVariable('DEV_TO_API_KEY', 'your_api_key', 'User')
設定後、ターミナルを再起動してください。
macOS（zshを使用の場合）：

~/.zshrcに追加：
echo 'export DEV_TO_API_KEY="your_api_key"' >> ~/.zshrc && source ~/.zshrc
Linux（bashを使用の場合）：

~/.bashrcに追加：
echo 'export DEV_TO_API_KEY="your_api_key"' >> ~/.bashrc && source ~/.bashrc
スクリプト実行時にこの環境変数が設定されていない場合、設定を促すメッセージが表示されます。
Gitの初期設定（重要！）：

GitのリモートオリジンがフォークしたGitHubレポジトリを指していることを確認します。フォークをクローンした場合、これは正しく設定されているはずです。まだ設定していない場合は、Gitのユーザー名とメールアドレスを設定する必要があります：
git config --global user.name "Your Name"
git config --global user.email "your.email@example.com"
準備完了！：

これでセットアップは完了です。以下のコマンドで記事を管理できます。変更はフォークしたレポジトリにプッシュされます。

 使用方法（ユーザーおよびAIエージェント向け）このツールは3つの主要コマンドを提供します。AIエージェントは以下のように説明されたコマンドを使用する必要があります。

 新規記事の作成（article:new）新規記事のボイラープレートを作成するには：
npm run article:new
AIエージェントの操作：
コマンドnpm run article:newを実行。
スクリプトが「記事のタイトルを入力してください：」とプロンプトを表示。希望する記事タイトルを提供。
スクリプトが「ファイル名のスラグを入力してください（例：my-awesome-post）：」とプロンプトを表示。URL対応のスラグを提供。
新しいMarkdownファイル（例：articles/YYYY-MM-DD-HH-mm-ss-slug.md）が作成されます。フロントマターにはタイトルとpublished: falseが含まれます。
AIエージェントはこのファイルに記事の内容を入力します。画像については、このレポジトリ内（例：articles/images/）に保存し、Markdown内で相対パスを使用します（例：![My Alt Text](./images/cool-pic.png)）。

 記事の公開/更新（article:publish）新規記事を公開または既存記事（articles/ディレクトリ内）をDev.toに更新し、GitHubと同期するには：
npm run article:publish
AIエージェントの操作：
articles/ディレクトリ内の.mdファイル内の記事内容が完成し、公開準備ができていることを確認。使用される画像がレポジトリにコミットされ、Markdown内で相対パスで参照されていることを確認。記事を公開する場合は、フロントマターのpublishedフィールドをtrueに設定。
コマンドnpm run article:publishを実行。
スクリプトは自動的に：

articles/ディレクトリ内のすべての.mdファイルをスキャン。
Dev.toに送信する際、ローカルの相対画像パスをGitHub Raw URLに一時的に変換。
新規記事（dev_to_article_idなし）：Dev.toに投稿し、新しいIDをローカルファイルのフロントマターに追加。
既存記事（dev_to_article_idあり）：Dev.to上の記事を更新。
処理・変更されたすべてのローカルファイル（追加/変更された画像がある場合はそれらと記事ファイル）をgit add。
これらの変更を要約メッセージと共にgit commit。
コミットをリモートGitHubレポジトリにgit push。
このステップではAIエージェントによる手動のGitコマンドは不要。コンソールログで成功または失敗が表示されます。
レポジトリからの画像を含む投稿の場合、Dev.toはプライベートGitHubレポジトリの画像にアクセスできないため、フォークしたレポジトリはパブリックである必要があります。
テキストのみの投稿の場合、フォークしたレポジトリはプライベートにできます。このような場合、Webリンクは生成されないためです。また、Dev.toがアクセスできる場所に画像が別途ホストされている場合も、フォークしたレポジトリはプライベートのままにできます。

 整合性チェック（article:check）ローカル記事とDev.to上の記事の不整合をチェックするには：
npm run article:check
AIエージェントの操作：
コマンドnpm run article:checkを実行。
スクリプトは以下を報告：
IDを持つローカル記事：Dev.to上での存在とタイトルを確認。
IDを持たないローカル記事：未公開としてリスト。
Dev.to記事：対応するローカルファイル（ID別）の存在を確認。
AIエージェントはコンソール出力を解析して整合性状態を理解し、不整合が重要な場合はユーザーに通知するか、さらなるアクションを取ることができます。このコマンドは読み取り専用です。

 フロントマター（AIエージェント向け）記事のMarkdownファイルの先頭に、以下のようなYAMLフロントマターを含めます：
---
title: "私の素晴らしい記事タイトル"
published: false # trueで公開、falseでDev.toにドラフトとして送信。デフォルトはfalse
tags: ["javascript", "tutorial", "webdev"] # タグの配列
series: "中級JavaScriptシリーズ" # オプション
# main_imageとcanonical_urlには必要に応じて絶対URLを使用
main_image: "https://..." # オプション：メイン画像のURL
canonical_url: "https://..." # オプション：オリジナルソースのURL
description: "この記事は高度なJavaScriptテクニックを説明します。" # オプション
# dev_to_article_id: 12345 # 公開時に自動的に追加/更新
---

## 記事本文はここから
Markdownで自由に書きます...

このレポジトリ内のファイルへの相対パスを使用して画像を含めます：
![私の画像の代替テキスト](./images/my-local-image.jpg)

 トラブルシューティング（AIエージェント向け）APIキーエラー：DEV_TO_API_KEY環境変数が正しく設定されていることを確認。
Gitエラー：リモートレポジトリへのプッシュ用のGit認証（SSHキーまたはHTTPS認証情報）が正しく設定されていることを確認。新規レポジトリの場合は初期ファイルがコミットされていること、およびリモートoriginが正しく設定されていることを確認。
Dev.toで画像が見つからない：画像ファイルがMarkdownで参照されているパスのレポジトリに存在し、publishを実行する前に画像を含むコミットがプッシュされていることを確認。自動URL変換は、GitHub Raw URLを通じて画像にアクセスできることに依存しています。
その他のエラーメッセージが表示される場合は、その内容を確認してください。