Closed13

Zennを利用するにあたりGithub連携とやらを試してみる

horoniumhoronium

普段ITインフラ関係の勉強をしているのですが、ブログやQiita、noteなどにまとめて記事を投稿しようとすると全然全然投稿しなかった。
なのでTwitter感覚とブログ感覚の間くらいで何かないかと思ってたら、ZennのScrapsの機能を知ったので試しに使用してみる。

使用するにあたってのとりあえずのお題として、ZennにGithub連携の機能があるのでそれを試しに使い、ここに残してみる。

horoniumhoronium

Zennの右上にある「GitHubからのデプロイ」にアクセスしてみると、丁寧にもGitHubで管理する方法へのリンクがあるのでそこをまずは読んでみる。

horoniumhoronium

ざっくりとした手順は以下の感じっぽい。

  1. 空のリポジトリを作成(public/privateどっちでもよい)
  2. Zennのダッシュボードから連携設定
    リポジトリは2つまで選択できるらしく、安全のための意図的な使用とのこと。意図が今のところ分かってないがとりあえず読み進める
  3. 同期するブランチ名の確認・変更
    ここで記事投稿用のブランチ(masterとか)を設定して、記事修正中ブランチ(devlop)で一段落したら、masterにマージすれば記事が投稿されるのかな?と想像

と、読み進めてたらファイルの作成やプレビューはZenn CLI使えって書いてあった。MACのインストール手順しか書いてなさそうに見えるが、調べてみたら非公式でVSCodeの拡張機能があるらしい

horoniumhoronium

ざっくり方針
新しいソフトとかはインストールせず、GitHub上でごにょごにょするだけでどうにかできないかかと思っていたのでちょっと想定外。
とりあえずGitHub連携を試してみて挙動とかを把握してみる。

horoniumhoronium

まずは適当にリポジトリを作成。
そしてGitHub連携の設定。

とりあえず連携の設定はできたっぽい。

設定したリポジトリ設定を見てみると、デフォルトではmainになっているようす。
あとリポジトリへのリンクを表示しないになっているのは、リポジトリを恥ずかしがってプライベートにしたからっぽい。

horoniumhoronium

GitHub上から更新することで投稿したかったため、Zennとの連携を解除してリポジトリ再作成(ファイルが一つもないとGitHub上でファイルの追加ができないようだったため)。
またデプロイ対象ブランチを普段使用しているmasterに変更。

ここで試しにREADME.mdを更新してみる。一応画像もちゃんと反映されるのか確認のため、適当にキャプチャした画像も追加。

horoniumhoronium

Zennのデプロイ履歴を見ると、デプロイ成功とはなっているが「更新されたファイルはありません」となっている。
表示されているお知らせの内容を見てみると、Zennにデプロイするためのルール守れ、みたいな感じですね。

GitHub上からコミットするだけでどうにかなりそうな気配がしてきたので、ちゃんとドキュメントを読んでルールを把握します。

horoniumhoronium

以下のZenn公式の記事を見てみると、articlesのディレクトリなどが必要らしい。また上記のお知らせに出ていたように、booksディレクトリもあるようなので、articlesでmdファイルを作成すれば記事が作成され、booksでmdファイルを作成すれば本がZennで作成できそう。
https://zenn.dev/zenn/articles/zenn-cli-guide

また作成するmdファイル内では以下を記載すれば記事のタイトルなどが反映されるっぽい。

---
title: "" # 記事のタイトル
emoji: "😸" # アイキャッチとして使われる絵文字(1文字だけ)
type: "tech" # tech: 技術記事 / idea: アイデア記事
topics: [] # タグ。["markdown", "rust", "aws"]のように指定する
published: true # 公開設定(falseにすると下書き)
---
ここから本文を書く

一旦articles, booksディレクトリを作成し、articlesディレクトリでmdファイルを作成してみる。

horoniumhoronium

最近のデプロイを確認すると、どうやらmdファイルは半角英数字でないといけないようです。

なので適当にyyyymmdd_<英語で一言概要>.mdくらいの命名ルールとして再作成実施してみましたが、先程作成した日本語ファイル名のmdファイルが引っかかってしまい、また同じ理由でデプロイ中断となってしまいました。
そのため日本語ファイル名のmdファイルを削除して再コミット実施。

horoniumhoronium


ファイルを削除しただけのコミットになってしまったので、記事の内容を更新しましたが記事登録されてないためか反映され内容でした。
再作成すると面倒なので、いったんリネームで対応してみます。
20221207_githubIntegration→20221207_githubIntegration2

horoniumhoronium

リネームしても反映されず、また記事を再作成しましたがそれでも更新されたファイルはありませんとなります。

その後typeの指定が誤っているっぽいことや、topicsを設定してみたり、publishedがtrueになっていなかった、github上ではだめでpushで更新しないとだめなのか?とか試していたのですが、結局行き詰り待ってました。

scrapsの仕様感を確かめるためだけにやっているので、いったん今日はここまでにしようかと考えていたところ、単純に拡張子「.md」が設定し忘れていることに気付きました。
それを直したところちゃんとgithub連携されるように。
こういうケアレスミスみたいなので1,2時間を無駄にするの、ホント時間がもったいないですね。

horoniumhoronium

一通り試してみての感想

Zenn-cliをインストールしないとだめかと途中思いましたが、以下4点を注意すればインストールしなくてもGitHubだけで更新可能なことが分かりました。

  • articles, booksのディレクトリを作成する
  • 記事の設定をファイルの頭にyaml形式で記載する ※emoji毎回指定するのは面倒と思い試しに空白にしたら自動で割り当てられました
  • ファイル名(slug)は半角英数字(a-z0-9)、ハイフン(-)、アンダースコア(_)の12〜50字の組み合わせ
  • .mdの拡張子を忘れずに(ぼくだけか)

使用できることを確認した後に言うのもなんですが、私が個人で利用する分にはむりやりgitを挟まなくてもいいかなって気はします。大作の記事などを作成したりするときはちょくちょくコミットしながらすることで、過去にどんなことを記載していたのかなどの履歴を残せたりするのでよいかもしれませんが、今のところその予定はないですし。
あとはチームでドキュメントを更新する必要がある場合などはGitHub連携はレビュー内容などを残せたりすると思うので良さそうですかね。

Scrapsを試してみて

気軽にちょくちょく現状を更新できるので使用感よかったです。
普段チャットツールに自分が試したことをメモしているため、全然パブリックにアウトプットできてませんでした。今後は自分で管理しているサーバのエラー対応とか試行錯誤したことをここに書いていけばいいのかな、と思ったのでアウトプットの機会が増やせそうです。(がんばれよ自分)

ということで、ここでクローズとさせてもらいます。

このスクラップは2022/12/07にクローズされました