GitHub Pagesがブログを構築

3168 ワード

テキストリンク

概要


簡単な個人ブログを構築するだけであれば、Github Pagesは絶対に試してみる価値のある案であり、静的なウェブサイトコードの管理サービスを提供しています.
一方、HexoやJekyllのような静的ブログ生成ツールは、静的コードを生成することができます.
以上のツールを使用すると、著者は書くことに専念するだけで、他の仕事はそれらによって完成します.
筆者はHexoを採用し、NexTのテーマに合わせてこのブログを構築した.

GitHub構成


新しいrepository、名前はusernameです.github.io、これも最終的なブログサイトで、そのうちusernameはGitHubのユーザー名でなければなりません.
静的Webサイトコードがある場合は、clone repository後、コードを対応するディレクトリにコピーし、GitHubにpushします.
#   repository  
git clone https://github.com//.github.io

Hexo


Hexoのインストール


インストール前にGitとNodeがインストールされていることを確認する必要があります.js MacはGitを持参し、直接スキップし、筆者はHomebrewを使用してNodeをインストールした.
#   Node
brew install node

#   hexo  
npm install -g hexo-cli

/usr/local/bin/hexo -> /usr/local/lib/node_modules/hexo-cli/bin/hexo

> [email protected] install /usr/local/lib/node_modules/hexo-cli/node_modules/fsevents
> node install

[fsevents] Success: "/usr/local/lib/node_modules/hexo-cli/node_modules/fsevents/lib/binding/Release/node-v64-darwin-x64/fse.node" already installed
Pass --update-binary to reinstall or --build-from-source to recompile
+ [email protected]
added 171 packages from 369 contributors in 29.855s

新規プロジェクト

# folder  
hexo init  
cd 
npm install
hexo serverまたはhexo s --debug(デバッグモード)が呼び出されると、http://localhost:4000/を介してローカルブログにアクセスできます.

NexTトピック


インストールする前に、Hexoプロジェクトを作成し、NexTをプロジェクトディレクトリの下にコピーする必要があります.
cd 
git clone https://github.com/iissnan/hexo-theme-next themes/next
_config.ymlのthemeフィールドを変更し、その値をnextに変更します.これで、NexTテーマのインストールが完了しました.次に、トピックが正しく有効になっていることを確認します.注:トピックを切り替えた後、hexo cleanを使用してキャッシュをクリアすることが望ましい.
hexo clean
#   Hexo  , 
hexo -s --debug
#  , 
INFO  Hexo is running at http://localhost:4000/. Press Ctrl+C to stop.

NexT相関はthemes/next/_config.ymlに配置される.
いろいろなSchemeがありますが、個人の好みに応じて修正できます.
# Schemes
# scheme: Muse
scheme: Mist
#scheme: Pisces
#scheme: Gemini

その他の詳細設定は、NexTの使用開始を参照してください.

文章を書く

hexo newで新しい記事を作成します.
hexo new [layout]  # <title>  
#    hexo new GitHub_Pages_ 

記事のレイアウト(layout)を指定できます.デフォルトはpostで、_config.ymldefault_layoutパラメータを変更してデフォルトのレイアウトを指定します.
詳しくはHexoを参考に書く
書き終わったら、静的ファイルを生成します.
hexo generate

配置


生成された静的ファイルは、publicディレクトリの下にあり、どこにでもコピーできます.構成によって、一般的なプラットフォームに自動的に配置することもできます.

GitHub Pagesへの自動配備


取付hexo-deployer-git
npm install hexo-deployer-git --save

構成の変更
deploy:
  type: git
  repo: 
  branch: [branch]
  message: [message]

ワンタッチ配置
hexo deploy

参考資料


Github PagesはNexTの使用を開始