ダディ伯爵がGCPで独自ドメインSSL対応ブログを無料で簡単に立ち上げた方法を分かりやすく解説します。
本記事では「hexoの使い方」について記載します。
GAE開発環境へのHEXOインストールについては「GCP独自ドメインSSLブログが無料で使える（3）HEXO環境構築」をご確認ください。
1.記事の作成【 hexo new draft <記事タイトル> 】
「hexo new draft <記事タイトル>」コマンドにて記事を作成します。
以下の例では記事タイトル名「test」として実行しています。
daddy_trevia ~/hexo $ hexo new draft test
INFO Created: ~/hexo/source/_drafts/test.md
daddy_trevia ~/hexo $「`post`」ではなく「`draft`」とすることで「`HEXOディレクトリ/source/_drafts/`」に記事ファイル「`<記事タイトル>.md`」を作成できます。
「`HEXOディレクトリ/source/_drafts/`」に作成された記事は「ドラフト（草稿中、作成中）」として扱われるため公開されずに安心して記事を「途中保存」することが出来ます。
2.記事の編集【 「ヘッダ（Front matter）」と「本文（MarkDown記法）」 】
hexoの記事ファイルは、大きく2個の要素（「ヘッダ」と「本文」）で構成されます。
まず1個目の要素「ヘッダ」は「Front matter」と呼ばれる「記事の基本情報」を記述する部分です。
具体例として、本記事の「Front matter」を以下に転記します。
---
title: hexoの使い方
date: 2019/5/13 12:27:03
updated:
category:
- [HEXO入門]
tags:
- [独自ドメイン]
- [SSL証明書]
- [ブログ]
- [無料]
- [簡単]
- [GCP]
- [GAE]
- [HEXO]
---次に2個目の要素「本文」は「MarkDown記法」で記述する部分です。
本文はHTML言語で記述するのではなく、MarkDown記法で記事を作成、編集します。
具体例として、本記事の「本文（MarkDown記法）～抜粋～」を以下に転記します。
ダディ伯爵が<strong class="marker_yellow">GCPで独自ドメインSSL対応ブログを無料で簡単に</strong>立ち上げた方法を分かりやすく解説します。
本記事では「hexoの使い方」について記載します。
<!-- more -->
HEXOインストールについては「GCP独自ドメインSSLブログが無料で使える（3）HEXO環境構築」をご確認ください。
## 1.ドラフト記事の作成【 hexo new draft <記事タイトル> 】
`hexo new draft <記事タイトル>`コマンドにて記事を作成します。
（後略）3.記事の確認【 hexo server --drafts 】
記事が正しく表示されるかを確認するため「hexo server --drafts」コマンドを実行します。
「http：//localhost：4000」をクリックすると「開発環境WEBサーバ」上の「コンテンツ（公開済も含む）」が表示されます。
daddy_trevia ~/hexo $ hexo server --drafts
INFO Start processing
INFO Hexo is running at http：//localhost：4000 . Press Ctrl+C to stop.「開発環境WEBサーバ」を終了するときは「Ctrl+C」を押下します。
4.ドラフト記事（草稿中、作成中）を公開する【 hexo publish post <記事タイトル> 】
「hexo publish post <記事タイトル>」コマンドにてドラフト記事（草稿中、作成中）を「公開ディレクトリ」へ移動します。
daddy_trevia ~/hexo $ hexo publish post test
INFO Published: ~/hexo/source/_posts/test.md
daddy_trevia ~/hexo $逆に「`HEXOディレクトリ/source/`」から「`HEXOディレクトリ/source/_drafts/`」へ移動するHEXOコマンドはありませんが、ファイル操作（ドラッグ＆ドロップ）にて行えます。
5.静的サイトを生成する【 hexo generate 】
「hexo generate」コマンドで静的サイトをジェネレート（生成）します。
daddy_trevia ~/hexo $ hexo generate
INFO Start processing
INFO Files loaded in 1.12 s
INFO Generated: atom.xml
INFO Generated: post-sitemap.xml
INFO Generated: page-sitemap.xml
INFO Generated: sitemap.xsl
INFO Generated: sitemap.xml
INFO Generated: content.json
INFO Generated: robots.txt
INFO Generated: index.html
（中略）
INFO Generated: css/style.css
INFO Generated: img/logo1.jpg
INFO 129 files generated in 3.18 s
daddy_trevia ~/hexo $6.静的サイトをアップロードする【 gcloud app deploy 】
「gcloud app deploy」コマンドで本番環境へ静的サイトをアップロードします。
daddy_trevia ~/hexo $ gcloud app deploy
Services to deploy:
descriptor: [/home/daddy_trevia/hexo/app.yaml]
source: [/home/daddy_trevia/hexo]
target project: [XXXXXXXX]
target service: [default]
target version: [20190415t203156]
target url: [https：//XXXXXXXX.appspot.com]
Do you want to continue (Y/n)? y
Beginning deployment of service [default]...
╔════════════════════════════════════════════════════════════╗
╠═ Uploading 129 files to Google Cloud Storage ═╣
╚════════════════════════════════════════════════════════════╝
File upload done.
Updating service [default]...done.
Setting traffic split for service [default]...done.
Deployed service [default] to [https：//XXXXXXXX.appspot.com]
You can stream logs from the command line by running:
$ gcloud app logs tail -s default
To view your application in the web browser run:
$ gcloud app browse --project=XXXXXXXX
daddy_trevia ~/hexo $数分後にプロンプト（$）が返ってくるので「gcloud app browse」で動作確認URLを表示します。
以上で「開発環境で記事を作成し本番環境へ適用する流れ」を理解できたかと思います。
あとはひたすら「記事を書く」→「動作確認」→「本番環境適用」を繰り返すのみです。
頑張ってください。
なお、文字の色や大きさ、背景の色、幅等、見栄えを変えたい場合は「hexoのカスタマイズをしてみた」へ進んでください。
コンテンツがある程度出来上がった方は、「GCP独自ドメインSSLブログが無料で使える（4）独自ドメインSSL設定」へ戻りましょう。
