静的サイトジェネレータHexoをGithub Pagesにデプロイする覚書

Github pages

Github pagesは無料でサイトが公開できます。

GitHub: Where the world builds software
GitHub is where over 50 million developers shape the future of software, together. Contribute to the open source community, manage your Git repositories, review...

Gitという仕組みを使うとコマンドラインで簡単にデプロイ(今回の場合カンタンに言うとブログの更新みたいなもの)できます。

Github に pages用のリポジトリを作る

Githubのアカウントの作り方は、別途調べてください。

【2019年1月現在】GitHubアカウント作成方法 - Qiita
GitHub初心者です。自分がアカウント作った作業ログを載せていくだけです。 よろしくお願いいたします。m(_ _)m GitHubアカウント作成 Username、Email...
自分で作ったWebページをインターネット上に公開しよう!
Progateはオンラインでプログラミングを学べるサービスです。プログラミングを学んでWEBアプリケーションを作ろう。

Github pagesのためのリポジトリについて、

Repository Nameは、ユーザー名.github.io にすると、
URLがキレイに https://ユーザー名.github.io になります。

↓こちらがすごく参考になります!

Node.js製の静的サイトジェネレータ「Hexo」で無料ブログ開発 vol.1 | dotstudio
Node.jsによるNode.jsのためのサイトづくり!Node.jsが書けなくても制作できます。

Gitのインストール

GitのWindows版をインストールします。

Git - Downloads

Windowsをクリック

設定していきます

そのまま

そのまま

そのまま

Vimにしました。

そのまま

そのまま

そのまま

このまま

そのまま

Use windows default console windowに

そのまま

インストールされます

Git Bashというアプリがインストールされます。

これで、WindowsのコマンドプロンプトからGitが使えるようになりました。

デプロイツールのインストール

最初だけ

npm install hexo-deployer-git --save

で、デプロイツールをインストールします。

Configファイルの修正

Hexoをインストールしたフォルダのトップにある _config.yml ファイルをエディタで開きます。

URLとDeploymentの部分に、Gitのアドレスを入力します。

# 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

と入力して保存します。

デプロイ

あとはブログを書いたら

hexo d -g

で、ブログを生成してデプロイしてくれます。

エラーが出てデプロイできない場合は↓こちらが参考になるかもしれません。

Hexoの更新は簡単だけどわかるようになるまでが大変

静的サイトジェネレーターHexoは、初心者向けの情報が少ない為、ゆきづまると調べるのに苦労します。

設定できてしまえば更新はあっという間に簡単なんですが、そこにたどり着くまで丸一日かかりました😅

これはとてもパソコン初心者の方におすすめできるレベルのものではない気がいたします。
設定全部してあげて、更新の仕方を教えてさしあげれば出来るかもしれません。

私もまだテーマの変更やカスタマイズなんて全然できないレベルです。。。楽しみが増えたとおもってがんばりまーす。

タイトルとURLをコピーしました