大雑把な流れ
- Node.jsのインストール
- 該当フォルダーでQuatzの初期化コマンドを入力
- 構成ファイルをいじる
- contentフォルダーに保管庫を作る
- メモを書く
- リモートリポジトリ・ymlの設定
今回はQuatzの公式ドキュメント通りに進めていきます。
詳細
1.Node.js・Gitのインストール
Node.jsはここからダウンロードします。LTSでOKですが、WindowsはNode.js管理パッケージ「n」が使えないので注意。
2.Quartzの初期化コマンドの入力
ターミナル系のソフトウェアを起動して、保存したいディレクトリーまで移動します。移動したら、ドキュメントの通り以下の4つのコマンドを入力。
$ git clone https://github.com/jackyzha0/quartz.git
$ cd quartz
$ npm i
$ npx quartz createこれでQuartzのファイルがディレクトリーの中にできたはず。
3.構成ファイルをいじる
最初に設定ファイルquartz.config.tsをいじります。私は下記の項目をいじりました。
- pageTitle（サイトのタイトル）
- enablePopovers（リンクのポップアップを表示するか否か）
- analytics（アナリティクス）
- locale（地名とか言語とか）
- baseUrl（ドメイン）
- ignorePatterns（サイトで表示しないフォルダー）
- typography（フォント）
- colors（配色）
詳しくは公式ドキュメントを読んでください（雑）
レイアウトも変えれるとのことですが、私はまだそこまで手を付けてません。なのでその辺をいじりたくなったら公式ドキュメントを読んでください（雑その2）
4.contentフォルダーに保管庫を作る
Obsidianを立ち上げてcontentフォルダーに保管庫を作成します。この際、他の保管庫をコピーしたりシンボリックリンクすることも可能（らしい）
5.メモを書く
上記サイトを参考にしつつ、フロントマターの設定・メモを記入していきます。（index.mdがそのままトップページになるので、新規に作り直すなり内容を変えちゃってください）
ちなみに私が設定したフロントマターはこんな感じです。
- title：H1のタイトル
- date：作成日
- draft：下書き（Obsidian Publishと設定が逆なので注意）
- aliases：エイリアス
- description: リンクカードに出てくる説明文みたいなの
- tags：タグ
ある程度メモが完成したら、ローカルサーバーでプレビューを行います。quartzフォルダーのディレクトリーで下記コマンドを入力すると、http://localhost:8080/で表示されます。（この時Ctrl+Cを押すまでずっと起動しています。リアルタイムで更新できます）
$ npx quartz build --serve6.リモートリポジトリ・ymlの設定
GitHubやGitLabなどでリモートリポジトリを作成します。作成後、下記のコマンドを入力して、リモートリポジトリの状態を確認・設定します。
$ git remote -v
$ git remote set-url origin <リモートリポジトリのURL>もしgit remote -vをやった際にupstreamが設定されてなかったら、下記のコマンドも入力しておきます。
$ git remote add upstream https://github.com/jackyzha0/quartz.gitymlの作成
Push後、自動でデプロイを設定するファイルを作成します。各サービスごとに違うので、自分が使うサイトの部分を探して設定してください（雑・その3）
これらが終わったら、下記のコマンドでPushをします。
$ npx quartz sync --no-pull初回のPushコマンドと2回目以降のコマンドが違うので注意。ちなみに2回目以降はこちらになります。
$ npx quartz sync無事にデプロイされたらひとまず完成です。お疲れさまでした。
余談：カスタムドメインについて
この辺りはドメイン業者とデプロイ先でやり方が違うので……。基本はこんな感じです。
- ドメイン取得
- DNSの設定（ネームサーバーは不要）
- デプロイ先の設定
DNSの切り替えに1・2時間くらいかかるので、最初にやっておいた方がいいかもしれません。ちなみにムームードメインを使ってる人は、ネームサーバーをムームーDNSに切り替えておきましょうね。（一敗）
