Claude CodeだけでZenn環境構築から記事作成・公開まで全自動化した
はじめに
Claude Codeを使って、ZennのGitHub連携用リポジトリの環境構築から、この記事の作成・公開まですべてを自動化してみました。複数のGitHubアカウント(仕事用と個人用)を使い分ける設定も含めて、コマンドラインから一度も離れることなく完了できました。
補足:GitHubの複数アカウントについて
仕事用アカウントが有料のGitHub Organizationに所属している場合、個人用アカウントと分けて管理することは問題ありません。実際にGitHubサポートへの問い合わせでも「雇用主が仕事用と個人用のアカウントを分けることを要求できる」との回答があり、公私を分けるための複数アカウント利用は認められています。
背景
COMPASSでは全社的にAIの利活用を推進しています。開発現場ではDevinやCursor、Claude Codeなどのツールを積極的に採用し、またClaude Code Dayなどのイベントも開催してAI時代に対応しようとしています。
そんな中、EMとして開発現場から少し離れている立場の自分でも、AIを前提に考えればこれまではできなかった貢献ができるようになるのではないかと考えていました。最初はAIを使ったコードのリファクタリングで貢献しようと試みましたが、想定よりも工数がかかった上、そもそも開発から離れた自分がやるべきことではないと感じました。
そこで目をつけたのが、テックブログの執筆です。
ZennのGitHub連携機能を使えば、記事を書けば書くほどリポジトリにコンテンツが蓄積され、それがそのままAIへの学習データになります。過去の記事から自分の文体や口調をAIが学習し、より「自分らしい」記事を低コストで執筆できるようになるのではないかと期待しました。
実現したこと
- Git設定の自動切り替え - 特定ディレクトリで個人GitHubアカウントを自動使用
- SSH認証の設定 - 複数GitHubアカウントのSSH設定
- Zennプロジェクトの初期化 - Zenn CLIのセットアップ
- GitHubリポジトリへのプッシュ - 個人アカウントでのリポジトリ作成と連携
- この記事の作成と公開 - Zenn記事の作成からGitHub経由での公開まで自動化
手順
1. Git設定の自動切り替え
仕事用PCで個人プロジェクト用のディレクトリを作るため、includeIf
を使った自動切り替えを設定。
~/.gitconfig_personal を作成:
[user]
name = [個人アカウント名]
email = [個人メールアドレス]
~/.gitconfig に追加:
[includeIf "gitdir:~/Documents/techblog/"]
path = ~/.gitconfig_personal
これでtechblog
ディレクトリ内では自動的に個人アカウントの設定が適用されます。
2. SSH設定
個人GitHub用のSSHキーを生成し、複数アカウントを使い分けられるように設定。
SSHキーの生成:
ssh-keygen -t ed25519 -C "[個人メールアドレス]" -f ~/.ssh/id_ed25519_personal -N ""
~/.ssh/config の作成:
# 仕事用GitHubアカウント
Host github.com
HostName github.com
User git
IdentityFile ~/.ssh/id_ed25519
IdentitiesOnly yes
# 個人用GitHubアカウント
Host github-personal
HostName github.com
User git
IdentityFile ~/.ssh/id_ed25519_personal
IdentitiesOnly yes
生成された公開鍵をGitHubに登録。
3. Zennプロジェクトの初期化
# package.json作成
npm init -y
# Zenn CLIインストール
npm install zenn-cli
# Zennプロジェクト構造を初期化
npx zenn init
これでarticles/
とbooks/
ディレクトリ、.gitignore
が自動生成されます。
4. Gitリポジトリの設定とプッシュ
# リポジトリ初期化
git init
# 個人設定が適用されているか確認
git config user.name # [個人アカウント名] と表示
git config user.email # [個人メールアドレス] と表示
# 初回コミット
git add .
git commit -m "Initial commit: Zenn content repository setup"
# リモート設定(SSH設定のHost名を使用)
git remote add origin git@github-personal:[username]/[repo-name].git
git push -u origin main
5. Zennとの連携
- Zennのデプロイ設定ページにアクセス
- 「GitHubからのデプロイ」で「リポジトリを連携」
- 作成したリポジトリを選択して連携完了
6. この記事の作成と公開
環境構築が完了したら、Claude Codeで実際に記事を作成してみました。
# Zenn記事を作成
npx zenn new:article --slug claude-code-zenn-setup --title "Claude CodeだけでZenn環境構築から記事作成・公開まで全自動化した" --type tech --emoji "🤖"
# 記事の内容をClaude Codeが自動生成
# published: false(下書き)で作成し、内容確認後に true に変更
# GitHubにプッシュして自動デプロイ
git add .
git commit -m "Add article: Claude CodeだけでZenn環境構築から記事作成・公開まで全自動化した"
git push
Claude Codeが記事の構成から内容まで自動生成し、適切なMarkdownフォーマットで作成してくれました。
ポイント
SSHを選んだ理由
- パスワード不要 - 一度設定すれば認証が自動化される
- 複数アカウントの管理が簡単 - SSH configで簡単に切り替え可能
- セキュリティ - 公開鍵/秘密鍵による強固な認証
includeIfの利点
- ディレクトリベースでGit設定を自動切り替え
- 手動でのconfig変更が不要
- 仕事用と個人用のコミットを間違えるリスクがない
感想
Claude Codeを使うことで、環境構築から記事作成まで全プロセスを対話的に進められました。特に以下の点が便利でした:
- 設定ファイルの作成・編集が自動化される
- SSH接続テストなどの確認作業も自動実行
- エラーが出た場合の対処も即座に実施
- 記事の内容も自動生成 - 実施した作業内容を基に適切な技術記事を作成
- メタ情報も適切に設定 - Zennのフロントマター(title、topics等)も自動設定
複数GitHubアカウントを使い分ける必要がある開発者にとって、この自動化アプローチは大きな時間節約になります。
まとめ
Claude Codeを使えば、複雑な環境構築も対話的かつ自動的に実行できます。今回は以下をすべて自動化しました:
- Zenn用GitHubリポジトリの環境構築(約10分)
- 複数GitHubアカウントの設定
- この記事自体の作成と構成
- GitHubへのプッシュによる自動公開
特にミスもなく、あなたが今読んでいるこの記事もClaude Codeが作成したものです。
これからZennで技術記事を書き始める方、複数GitHubアカウントの管理に悩んでいる方、そしてClaude Codeの可能性に興味がある方の参考になれば幸いです。
なお、AIによる文体の模倣については、今後記事を蓄積していく中で様子を見ていきたいと思います。
最後に、、、
株式会社COMPASSでは一緒に教育をより良くしていく仲間を募集しています。
少しでも興味を持っていただけた方は、以下よりお気軽にご応募ください。
とりあえず話をきいてみたい!という方はぜひカジュアル面談に来ていただけると幸いです。
Discussion