Mugi - Note.com Auto Publisher

GitHub Actionsを使用してnote.comに記事を自動投稿するリポジトリです。

📋 目次

クイックスタート
ディレクトリ構造
詳細なセットアップ
記事の作成と投稿
Markdown記法
トラブルシューティング
FAQ

🚀 クイックスタート

最速で始める3ステップ（所要時間: 約10分）

ステップ1: 認証情報を取得（5分）

# リポジトリをクローン
git clone https://github.com/YOUR_USERNAME/github-actions-mugi.git
cd github-actions-mugi

# 依存関係とブラウザをインストール
npm install
npm run install-browser

# note.comにログイン
npm run login
# → ブラウザが開くのでログイン → Enterキー
# → プロジェクトルートに .note-state.json が作成される

⚠️ .note-state.json は .gitignore で除外されているのでGitにコミットされません。

ステップ2: GitHubシークレットを設定（2分）

# 認証情報をクリップボードにコピー
cat .note-state.json | pbcopy  # macOS
# または
cat .note-state.json  # 内容を手動でコピー

GitHubで設定：

リポジトリの Settings → Secrets and variables → Actions
New repository secret をクリック
Name: NOTE_STATE_JSON
Secret: 上記でコピーした内容を貼り付け
Add secret をクリック

ステップ3: 記事を投稿（3分）

GitHubリポジトリの Actions タブを開く
Note Post via MCP ワークフローを選択
Run workflow をクリック
パラメータ入力：
- target_folder: exsample
- post_type: draft
- thumbnail_name: sample-thumbnail.png
Run workflow をクリック

✅ 完了！note.comの下書き一覧を確認してください。

📁 ディレクトリ構造

github-actions-mugi/
├── .github/
│   └── workflows/
│       └── note-post.yaml          # GitHub Actionsワークフロー
├── note/
│   ├── exsample/                   # サンプル記事フォルダ
│   │   ├── example.md              # 記事本文（Markdown）
│   │   ├── sample-thumbnail.png    # サムネイル画像
│   │   ├── note-view-like.png      # 本文中の画像
│   │   └── donuts-pop.png          # 本文中の画像
│   └── (your-articles)/            # 新しい記事フォルダを追加
├── src/
│   └── login-note.js               # 認証情報取得スクリプト
├── prompts/
│   └── personality-mugi.md         # プロンプト
├── package.json                    # npm設定
├── .gitignore                      # Git除外設定
└── .note-state.json                # 認証情報（Gitにコミットされない）

🔧 詳細なセットアップ

前提条件

note.comアカウント: ログイン可能なアカウント
GitHubアカウント: リポジトリとActions使用可能
Node.js 18以上: ローカル環境（認証情報取得用）

ローカル環境のセットアップ

1. リポジトリのクローン

# HTTPSでクローン
git clone https://github.com/YOUR_USERNAME/github-actions-mugi.git
cd github-actions-mugi

# または、SSHでクローン
git clone git@github.com:YOUR_USERNAME/github-actions-mugi.git
cd github-actions-mugi

2. 依存関係のインストール

# Node.jsのバージョン確認（18以上が必要）
node -v

# 依存関係をインストール
npm install

# Playwrightブラウザをインストール
npm run install-browser

3. 認証情報の取得

# ログインスクリプトを実行
npm run login

実行の流れ：

ブラウザウィンドウが自動的に開きます
note.comのログインページが表示されます
メールアドレス/パスワードまたは外部サービスでログイン
ログイン完了後、ホーム画面が表示されることを確認
ターミナルに戻って Enterキー を押す
プロジェクトルートに .note-state.json が生成される

認証情報の確認：

# ファイルが正しく生成されたか確認
cat .note-state.json

# 以下のようなJSON形式のデータが表示されればOK
# {
#   "cookies": [...],
#   "origins": [...]
# }

⚠️ 重要:

このファイルにはログイン情報が含まれています
.gitignore で除外されているので、Gitにコミットされません
外部に漏らさないでください

4. GitHubシークレットの設定

認証情報をGitHubに登録します：

# macOS/Linux
cat .note-state.json | pbcopy  # クリップボードにコピー

# Windows (PowerShell)
Get-Content .note-state.json | Set-Clipboard

# 手動でコピー
cat .note-state.json

GitHubでの設定手順：

GitHubでリポジトリを開く
Settings タブをクリック
左サイドバーの Secrets and variables → Actions
New repository secret ボタンをクリック
以下を入力：
- Name: NOTE_STATE_JSON
- Secret: 上記でコピーした .note-state.json の内容を貼り付け
Add secret をクリック

📝 記事の作成と投稿

新しい記事を作成

# 記事フォルダを作成（フォルダ名は任意）
mkdir -p note/my-first-article

# Markdownファイルを作成
cat > note/my-first-article/article.md << 'EOF'
---
title: はじめてのnote投稿
tags:
  - はじめまして
  - note
  - GitHub Actions
---

こんにちは！

これは私のはじめてのnote記事です。

## 自己紹介

よろしくお願いします。

## 画像の挿入

![サンプル画像](./sample.png)

## リンク

詳しくはこちら：
https://note.com
EOF

# 画像ファイルもコピー（必要に応じて）
cp /path/to/your/image.png note/my-first-article/sample.png

# Gitにコミット
git add note/my-first-article/
git commit -m "Add my first article"
git push origin main

GitHub Actionsで投稿

下書き保存（推奨：初回）

GitHubリポジトリの Actions タブを開く
Note Post via MCP ワークフローを選択
Run workflow ボタンをクリック
パラメータを入力：
- target_folder: my-first-article（note/配下のフォルダ名）
- post_type: draft（下書き保存）
- thumbnail_name: sample.png（サムネイル、任意）
Run workflow をクリック
ワークフローの実行ログで進行状況を確認
note.comの下書き一覧で記事を確認

公開投稿

下書きを確認して問題なければ、公開投稿します：

同じワークフローを実行
パラメータを変更：
- target_folder: my-first-article
- post_type: publish（公開投稿）
- thumbnail_name: sample.png
実行後、note.comで公開された記事を確認

Markdownファイルの書き方

基本構造

---
title: 記事のタイトル
tags:
  - タグ1
  - タグ2
  - タグ3
---

記事の本文をここに書きます。

## 見出し2

### 見出し3

本文が続きます...

Front Matter（メタデータ）

---
title: 記事のタイトル（必須）
tags:
  - タグ1
  - タグ2
  - タグ3
---

または配列記法も可能：

---
title: 記事のタイトル
tags: [タグ1, タグ2, タグ3]
---

📖 サポートされるMarkdown記法

見出し

## 大見出し（見出し2）
### 小見出し（見出し3）

note.comでは ## と ### がサポートされています。

テキスト装飾

**太字のテキスト**
~~取り消し線~~

引用

> これは引用ブロックです。
> 複数行にわたって
> 引用することができます。

コードブロック

```javascript
// JavaScriptのサンプルコード
function greet(name) {
  console.log(`Hello, ${name}!`);
}

greet('note');
```

```python
# Pythonのサンプルコード
def greet(name):
    print(f"Hello, {name}!")

greet("note")
```

画像の挿入

![代替テキスト](./image.png)
![サムネイル](./thumbnail.jpg)

画像の準備：

相対パスで指定（./で始める）
記事フォルダ内に配置
フォーマット: PNG, JPEG, GIF
推奨サイズ: 幅1200px以下、10MB以下

サムネイル画像：

アスペクト比: 16:9
解像度: 1280x720px または 1920x1080px

URLリンクカード

URLを単独行に書くと、note.comが自動的にリンクカードとして展開します：

https://note.com

https://www.youtube.com/watch?v=xxxxx

YouTube動画も自動で埋め込まれます。

水平線

---

3つのハイフンで水平線を挿入できます。

🔧 トラブルシューティング

認証エラーが発生する

症状: ワークフローが認証エラーで失敗する

解決方法:

# 1. ローカルで認証情報を再取得
npm run login

# 2. 新しい認証情報をコピー
cat .note-state.json | pbcopy

# 3. GitHubシークレットを更新
# Settings → Secrets → Actions → NOTE_STATE_JSON を編集

フォルダが見つからない

症状: Error: Folder note/xxx does not exist

解決方法:

note/ 配下に正しいフォルダ名で作成されているか確認
target_folder パラメータが正しいか確認
フォルダ名は任意（例: exsample, my-article）

# フォルダ一覧を確認
ls note/

# 新しいフォルダを作成
mkdir -p note/new-article

Markdownファイルが見つからない

症状: Error: No markdown file found in note/xxx

解決方法:

フォルダ内に .md 拡張子のファイルがあるか確認
ファイル名は任意ですが、フォルダ内に1つだけ配置

# ファイル確認
ls note/exsample/

# 必要なら作成
touch note/exsample/article.md

画像がアップロードされない

症状: 本文中の画像が表示されない

解決方法:

画像パスが相対パス ./ で始まっているか確認
画像ファイルがフォルダ内に実際に存在するか確認
サポートされる画像形式: PNG, JPEG, GIF

# 画像ファイルの確認
ls note/exsample/*.png

# 画像のリサイズ（大きすぎる場合）
# ImageMagick使用
convert input.png -resize 1200x output.png

# macOSのsipsコマンド
sips -Z 1200 input.png --out output.png

タイムアウトエラー

症状: ワークフローが15分でタイムアウト

原因と対策:

note.comのサーバーが重い → 少し時間を置いて再実行
画像ファイルが大きすぎる → リサイズして10MB以下に
画像が多すぎる → 分割して投稿

Node.jsのバージョンエラー

症状: node: command not found またはバージョンが古い

解決方法:

# Node.jsのバージョン確認（18以上が必要）
node -v

# nvmを使ってNode.jsをインストール（推奨）
nvm install 20
nvm use 20

# または公式サイトからインストール
# https://nodejs.org/

依存関係のエラー

症状: npm install や npm run がエラー

解決方法:

# node_modulesを削除して再インストール
rm -rf node_modules package-lock.json
npm install

# ブラウザの再インストール
npm run install-browser

💡 よくある質問

Q1: 認証情報の有効期限は？

A: note.comのセッションが切れるまで有効です（通常は数週間〜数ヶ月）。

認証エラーが発生したら：

npm run login
# → GitHubシークレットも更新すること

Q2: 複数のnoteアカウントで使える？

A: はい、ただしGitHubシークレットは1つのみ設定できます。

方法1: リポジトリごとに異なるアカウント

別々のGitHubリポジトリを作成
それぞれ異なる NOTE_STATE_JSON を設定

方法2: ローカルで複数アカウント管理

プロジェクトごとに .note-state.json を作成
投稿時にGitHubシークレットを切り替え

Q3: プライベートリポジトリでも使える？

A: はい、プライベートリポジトリでも使用可能です。

注意点:

GitHub Actionsの無料枠を確認
プライベートリポジトリは実行時間に制限あり
公開前の記事が外部に見られる心配がない（推奨）

Q4: ローカルで直接投稿できる？

A: はい、note-post-mcpをローカル環境でも使えます。

CursorやClaude DesktopなどのMCPクライアントから使用してください。詳細は元のリポジトリを参照してください。

Q5: 予約投稿はできる？

A: 以下の方法があります：

方法1: GitHub Actionsのスケジュール実行

# .github/workflows/note-post.yaml に追加
on:
  schedule:
    - cron: '0 9 * * *'  # 毎日9:00 UTC（日本時間18:00）
  workflow_dispatch:  # 手動実行も維持

方法2: 下書き保存後、note.comで公開時刻を設定

draft で下書き保存
note.comの管理画面で公開予約を設定

Q6: バッチで複数記事を投稿できる？

A: はい、シェルスクリプトで自動化できます：

#!/bin/bash
# batch-post.sh

FOLDERS=("article-1" "article-2" "article-3")

for folder in "${FOLDERS[@]}"; do
  gh workflow run note-post.yaml \
    -f target_folder="$folder" \
    -f post_type="draft"
  sleep 60  # 60秒待機（note.comへの負荷軽減）
done

実行：

chmod +x batch-post.sh
./batch-post.sh

Q7: 記事を更新できる？

A: 現在は新規投稿のみです。

代替方法:

note.comで手動編集
同じ内容で新しい記事を作成して、古い記事を削除

更新機能は今後の拡張予定です。

Q8: 認証情報を確認したい

A: 以下のコマンドで確認できます：

# 認証情報ファイルの存在確認
ls -la .note-state.json

# 内容を表示（センシティブ情報を含むので注意）
cat .note-state.json

# ファイルサイズ確認
wc -c .note-state.json

Q9: ワークフローの実行履歴を見たい

A: GitHubのActionsタブで確認できます：

GitHubリポジトリの Actions タブ
Note Post via MCP ワークフローを選択
過去の実行履歴が表示されます
各実行をクリックして詳細ログを確認

Q10: コストはかかる？

A: 基本的に無料です：

GitHub Actions:
- パブリックリポジトリ: 無料（無制限）
- プライベートリポジトリ: 月2,000分まで無料
note.com: 無料プランでも使用可能
このツール: 完全無料（MIT License）

🔐 セキュリティのベストプラクティス

1. 認証情報の管理

✅ .note-state.json はプロジェクトルートに保存
✅ .gitignore で除外されているのでGitにコミットされない
✅ 定期的に npm run login で更新
✅ GitHubシークレットも更新を忘れずに
❌ .note-state.json を他人と共有しない
❌ 公開リポジトリにコミットしない

2. GitHubシークレットの保護

✅ 必要な人にのみリポジトリアクセスを許可
✅ シークレットの値は一度設定すると見れなくなる（安全）
✅ 定期的に認証情報を更新
❌ スクリーンショットやログに認証情報を含めない

3. プライベートリポジトリの推奨

✅ 記事の下書きが公開される前に外部に見られない
✅ 実験的な記事を安全に管理できる
✅ チーム内での共同作業がしやすい

🎯 よく使うコマンド集

# 認証情報の取得・更新
npm run login

# 依存関係のインストール
npm install

# ブラウザのインストール
npm run install-browser

# 認証情報の確認
cat .note-state.json
ls -la .note-state.json

# 記事フォルダ一覧
ls note/

# 新しい記事フォルダ作成
mkdir -p note/new-article

# Gitにコミット
git add note/
git commit -m "Add new article"
git push

# Node.jsバージョン確認
node -v

# 依存関係の再インストール
rm -rf node_modules package-lock.json && npm install

📚 参考リンク

note-post-mcp - 元のMCPサーバー
note.com - note公式サイト
GitHub Actions Documentation - GitHub Actions公式ドキュメント
Playwright - ブラウザ自動化ツール

📄 ライセンス

MIT License

このプロジェクトは note-post-mcp を使用しています。

🙏 謝辞

Made with ❤️ using note-post-mcp

Happy note.com posting! 📝✨

FilesExpand file tree

README.md

Latest commit

History

README.md

File metadata and controls

Mugi - Note.com Auto Publisher

📋 目次

🚀 クイックスタート

ステップ1: 認証情報を取得（5分）

ステップ2: GitHubシークレットを設定（2分）

ステップ3: 記事を投稿（3分）

📁 ディレクトリ構造

🔧 詳細なセットアップ

前提条件

ローカル環境のセットアップ

1. リポジトリのクローン

2. 依存関係のインストール

3. 認証情報の取得

4. GitHubシークレットの設定

📝 記事の作成と投稿

新しい記事を作成

GitHub Actionsで投稿

下書き保存（推奨：初回）

公開投稿

Markdownファイルの書き方

基本構造

Front Matter（メタデータ）

📖 サポートされるMarkdown記法

見出し

テキスト装飾

リスト

引用

コードブロック

画像の挿入

URLリンクカード

水平線

🔧 トラブルシューティング

認証エラーが発生する

フォルダが見つからない

Markdownファイルが見つからない

画像がアップロードされない

タイムアウトエラー

Node.jsのバージョンエラー

依存関係のエラー

💡 よくある質問

Q1: 認証情報の有効期限は？

Q2: 複数のnoteアカウントで使える？

Q3: プライベートリポジトリでも使える？

Q4: ローカルで直接投稿できる？

Q5: 予約投稿はできる？

Q6: バッチで複数記事を投稿できる？

Q7: 記事を更新できる？

Q8: 認証情報を確認したい

Q9: ワークフローの実行履歴を見たい

Q10: コストはかかる？

🔐 セキュリティのベストプラクティス

1. 認証情報の管理

2. GitHubシークレットの保護

3. プライベートリポジトリの推奨

🎯 よく使うコマンド集

📚 参考リンク

📄 ライセンス

🙏 謝辞