Zennで記事を書くはじめのいっぽ

はじめに

この記事は、はじめてZenn上に記事を作成した時の覚え書きになります。

やること /　やりたいこと

• GitHubのリポジトリを作成する
  • private repositoryにしました
  • zenn-contents という名前にしています
• 公開用のブランチを決める
  • published にしました
• リポジトリにzennに必要なものを入れる
  • 手順に従いました
  • npx zenn コマンドが使えることを確認しました
• npx new:article で記事の雛型（この記事の元になっているMarkdownファイル）を作成しました

# helpで確認
zenn-contents $ npx zenn help

Command:
  zenn init         コンテンツ管理用のディレクトリを作成. 初回のみ実行
  zenn preview      コンテンツをブラウザでプレビュー
  zenn new:article  新しい記事を追加
  zenn new:book     新しい本を追加
  zenn -v           zenn-cliのバージョンを表示
  zenn help         ヘルプ

  👇詳細
  https://zenn.dev/zenn/articles/zenn-cli-guide

# 新しい記事を追加
zenn-contents $ npx zenn new:article
📄7c5cdd1df60811bb053c.md created.

# プレビュー
zenn-contents $ npx zenn preview
👀Preview on http://localhost:8000

# ディレクトリの中身を確認
# node_modules の中はたくさんあるので除外
zenn-contents $ tree -L 2 -I node_modules
.
├── README.md
├── articles
│   └── 7c5cdd1df60811bb053c.md # 今回のファイル
├── books
├── package-lock.json
└── package.json

2 directories, 4 files

masterにマージではなくタグを打ったらpublishedにマージしたい

記事の公開は、masterブランチにマージのタイミングではなくて、publishedにマージしたタイミング。その上で、こんな感じでやってみたい。

• masterにマージ
• タグを打ってタグをpush (article-xxxx)
• タグを検知してGitHub Actionsでpublishedにマージ

かなりベタですが、こんな感じでやってみました。

# .github/workflows/publish.yml

name: release

on:
  push:
    tags:
      - 'article-*'

jobs:
  build:
    # The type of runner that the job will run on
    runs-on: ubuntu-latest
    # Steps represent a sequence of tasks that will be executed as part of the job
    steps:
      # Checks-out your repository under $GITHUB_WORKSPACE, so your job can access it
      - uses: actions/checkout@v2

      - name: merge_into_pulished
        run: |
          echo Merge into published!
          git config --global user.email "[e-mail]"
          git config --global user.name "Akiko Takano"
          git fetch --unshallow
          git checkout master
          git pull
          git checkout published
          git pull
          git merge --no-ff master -m "Auto-merge published for release into Zenn."
          git push origin published

userとかemailは環境変数などで渡しておけばもっとスッキリするはず...。
とりあえず最初の一歩としてはOKそう。

わかったこと

• プレビューのトップページは記事のリンク集とかデフォルトのガイドを表示
• Node.jsで動いている
• プレビューするとZenn Editor というタイトルのトップページが出るけど、ブラウザからは編集できないので、意味的には本当にライブプレビュー
  - 画像はリポジトリ内に含めることもできそうだけど、Zennの管理下にアップしてURLを貼り付ける方法もできそう
  • GitHubのリポジトリに配置させると、キャッシュやパフォーマンスの面で高速ではないかも？
  • Zennの管理下に持っておくのが良いかな
• 記事をブランチにマージしても、published: false だと勝手には公開されません！