🐾

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

2020/11/25に公開

はじめに

この記事は、はじめて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 "akiko.pusu@gmail.com"
          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 だと勝手には公開されません!

Discussion