モチベーション
・自分のWebページが欲しいけど、レンタルサーバ代は払いたくない
・動的なページである必要性はない
→ Github Pagesでいい感じのものを作ってしまえばいいじゃん！
という感じ
どうやって作るか
https://qiita.com/okmttdhr/items/82ecb0332835472e905f
にあるように、Github Pagesでブログ構築ができる静的サイトジェネレーターはたくさんあるっぽい。
Railsベースのものはなんとなく使いたくないので、ノリでHexoを選んだ。
制作環境
MacOS Sierra 10.12.6
Homebrewはインストール済
作っていく
Github Pages用のRepository作成
Githubにアクセス → 右上の「+」ボタンから「New Repository」を選択
Repository Nameは username.github.io にすること！
URLがめんどくさくなります。
※この記事内でusernameと書かれているところは適宜Githubのユーザ名に置き換えて実行してください。
Hexoのインストール
nodebrewとかいうバージョン管理ツール?(RubyのrbenvとかPythonのpyenvみたいな立ち位置のもの)があるらしいのでそれを使っていく
Homebrewを使ってnodebrewをインストール
$ brew install nodebrew
今時の若者のShellはfishなので、~/.config/fish/conf.d/config.fishに以下の通り追記する。
set -x PATH $HOME/.nodebrew/current/bin $PATH
Shellを起動し直してから、最新のNode.jsをインストール
$ nodebrew setup
$ nodebrew install-binary latest
$ nodebrew list
v11.9.0
current: none
$ nodebrew use v11.9.0
$ nodebrew list
v11.9.0
current: v11.9.0
$ npm -v
6.5.0
npmを更新しておく
$ npm update -g npm
$ npm -v
6.7.0
Node.jsが入ったのでHexoとデプロイツールを入れていく
$ npm install -g hexo
$ sudo npm install hexo-deployer-git --save
とりあえず立ち上げてみる
適当なディレクトリを作ってそこに環境を構築する
$ mkdir blog
$ cd blog
$ hexo init
$ hexo server
localhost:4000にアクセス出来たらとりあえず成功です。
configの修正
以降ではhexo initを実行したディレクトリ下で作業する
デプロイ先などの設定が_config.ymlにあるので修正する
# Site
title: hoge
subtitle: hogefuga
description:
keywords:
author: piyo
language: ja
timezone: Asia/Tokyo
# URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: https://username.github.io/
root: /
permalink: :year/:month/:day/:title/
permalink_defaults:
# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
type: git
repo: git@github.com:username/username.github.io.git
branch: master
この辺を修正してあげれば良い
デプロイしてみる
$ git init
$ git remote add origin git@github.com:username/username.github.io.git
$ hexo deploy -g
しばらく待って、https://username.github.io にアクセス出来たら成功です！
お疲れ様でした。
新しい記事を作る場合
hexo new <記事名>と打てばsource/_posts/<記事名>.mdというものが生成されるので、生成された<記事名>.mdにMarkdown形式で入力すれば良い。
記事が完成したらhexo deploy -gと打てば良い感じにデプロイしてくれます。