コンテンツにスキップ

a-Shellとobsidian-gitを使用してプライベートリポジトリで管理するMarkdownファイル(Mkdocs)をマルチデバイス(Windows/Mac/iPhone/iPad)で更新する方法

経緯

  • 技術系のTips記事(静的サイト)をMaterial for Mkdocs（以降MkDocsと表現する）で作成したドキュメント(Markdown)をGitHubで管理し、Netlifyでデプロイすることでwebサイトとして公開していた。
  • 個人の作業ログやメモはObsidianアプリを使用して管理していた。
  • データはWindows/Mac/iPhone/iPadで参照、更新するため、データの保存先（保管庫：Obsidian vault）はiCloudを指定して保存していた。
  • MkDocsはWebページとして生成されるが、materialテーマにより統一的なデザインで構成されるためスマートフォンやPCで見やすい。ただし、ドキュメント更新は主にPCでVSCodeから行う必要があった。
  • 文章量が多い場合はPCでも良いが、毎回起動するのは手間だと感じていた。そこで、スマートフォンでもドキュメントを更新する方法がないか検討していた。
  • 一例として、はてなブログでは、スマートフォン向けもアプリが公開されており、PC、スマートフォンで両方で更新可能な例も存在する。

仕様検討

要件

  • ドキュメント表示はMkDocs、更新はObsidian、または、VSCodeとする。
  • ドキュメント（コード）はGitで管理し、セキュリティを考慮してGitHubのプライベートリポジトリで管理する。
  • 費用はなるべく抑えたい。希望は無料で利用できること。

技術選定

  • Obsidianでは、ウェブサイト上に公開するサービスとしてObsidian Publishが提供されているが、月額制のサービスであるため対象から除いた。1

  • マルチデバイスで更新可能にするために保管庫はiCloudで設定することが前提になる。ローカル保管庫の変更を自動的に同期するサービス（リモートでも設定次第で可能）として、Obsidian Syncが提供されているが、こちらも有料の月額サービスであるため対象から除いた。2

  • ObsidianでGitを利用する方法として、Obsidian-Gitプラグインを利用することで、元データをgitのリポジトリの情報で設定できる。PCでは任意のローカルディレクトリを指定可能なので問題なし。iPhone,iPadの場合は、ファイル（ローカル）のobsidianフォルダ以下のみ対象であるため、ここにgit cloneする必要があるが、これはa-Shellアプリを使用すれば対応可能であった。3

設定方法

事前準備

  • GitHubのPAT(Fine-grained-token）> ContentsにRead and writeを付与する
  • Tokens (classic)の場合はrepo スコープを付与する

リポジトリのクローン

iPhone / iPadの向け
  1. a-Shellアプリをインストールし、gitコマンドをインストールする
  2. a-ShellアプリでpickFolderコマンドを実行してファイル > obsidianフォルダに移動する
  3. git cloneコマンドでプライベートリポジトリのURLを指定してクローンする
  4. passwordが表示されるため、PATを入力する
  5. obsidianアプリでクローンしたリポジトリをvaultに設定する
Windows / Macの向け
  1. リポジトリをクローンする（PATによる認証が要求された場合は入力する）
  2. obsidianアプリでクローンしたリポジトリをvaultに設定する

コミット&プッシュ

操作について以下でまとめています。

トラブルシューティング
  • push時にRemote did not reply using the "smart" HTTP protocol.となる場合はa-ShellアプリでPATを再設定する。
  • 設定してもうまくいかない場合はクローンからやり直す。

{{ link_card( url="/ja/development/tools/document/pkm/obsidian/community_plugins/Obsidian_Git/#_3", title="Obsidian Git - 7rikazhexde PKM", description="Obsidian Git関連のtipsをまとめる" ) }}

デプロイ環境構成

概要

本構成の設計方針は、プライベートリポジトリでセキュアかつコストをかけない運用の実現です。
そこで、ホスティングサービスとしてNetlifyを使用し、ドキュメント（コード）の生成とデプロイ処理はGitHub Actionsを使用する構成とします。

処理フロー
1
2
3
Git Push → GitHub Actions → Netlifyデプロイ → CDN
     ↓         ↓
   自動実行   ビルド完了
技術選定の理由
1. Netlify選択の背景
  • プライベートリポジトリ対応：Netlify無料プランでもプライベートリポジトリから静的サイトのホスティングが可能
  • GitHub Pagesとの比較：GitHub Pagesではプライベートリポジトリ利用に月額$4のGitHub Proが必要 4
  • 豊富な機能：CDN配信、自動SSL、カスタムドメイン、リダイレクト設定等が無料で利用可能
2. GitHub Actions採用の利点
  • セキュリティの向上：ソースコードはGitHub環境内でのみ処理され、Netlifyには静的ファイルのみ送信
  • コスト効率：プライベートリポジトリにおける、GitHub Actionsの利用では、GitHubの無料プランで月2,000分まで利用可能4
  • ビルド速度の改善：従来のNetlify単独方式と比較して処理時間が5-8分→3-5分に短縮
運用コスト
項目 従来方式（Netlify単独） 現在方式（GitHub Actions + Netlify）
GitHub 無料（無制限リポジトリ） 無料（Actions 2,000分/月）
Netlify ビルド分数：60分/月消費 ビルド分数：0分消費
月額コスト $0（無料枠内） $0（無料枠内、余裕率98%）
年間換算 $0 $0
セキュリティ設計
  • 最小権限アクセス：Netlifyにはデプロイ専用トークンのみを付与
  • ソースコード非公開：GitHub環境でビルドし、成果物のみをNetlifyへ送信
  • 認証情報管理：GitHub Secretsで一元的に管理
実装詳細

GitHub Actionsワークフローは下記の通りです。
このワークフローでは以下のパフォーマンス最適化を考慮しています。

  • 依存関係キャッシュ：Poetryおよびnpmパッケージのキャッシングにより高速化
  • 段階的デプロイ：エラー時の早期終了で無駄なリソース消費を防止
  • 自動通知：Discord連携によるデプロイ状況の即時通知
private-repo_build_mkdocs_deploy_netlify.yml

{{ gist_codeblock( gist_url="https://gist.github.com/7rikazhexde/fad76ac095eadc10459ed1ceded0ab0b", indent=1 ) }}

その他

obsidian gitプラグインを使ってみてドキュメント更新をした感想として、確かにスマホで更新できるのは楽だと感じた。ただ、文章が増えるとPCでの更新の方が楽だと感じた。今後しばらく運用するが、今後も継続する場合は、便利なプラグインやショートカットなどをうまく活用して、いかにスマホでも更新しやすい環境を作るかことがポイントになると考える。

  1. 興味はあるので今後使用する可能性はある。調べると、tadashi-aikawaのPKMとして公開されているMinervaではObsidian Publishを使用して運用されている。使用する場合は内容が参考になるため共有させていただきます。 ↩

  2. Obsidian Syncに記載の通り、機能も充実しているので利用価値は高いと言える。 ↩

  3. gitコマンドのインストールが必要(インストール方法詳細) ↩

  4. 2025年5月10日現在 ↩↩