前回
GitHub PagesとJekyllを使ってポートフォリオページを作ろう①GitHub Pages構築編
今回はJekyllの環境構築編です。
参考にしている良記事様
Jekyllって?
Webサイトを構成するHTMLファイル一式を出力するツールです。
特徴としては
・Rubyベースで動作する
・テーマを簡単に取得できる
・MarkDownで書ける
・GitHubPagesが公式サポート
といった感じです。MarkDownで書いたものをHTML出力してくれるみたいです。便利ですね。
Jekyllの環境構築
①まずはRuby
(Mac前提)
JekyllはRubyベースなのでまずはRubyをインストールします。これについては良い記事がたくさんあるので割愛させていただきます。
こちらの記事を参考にしてください。(投げやり)
homebrew
→rbenv
→ruby
の順番でインストールする感じです。
https://qiita.com/Ficus/items/bdef5c2b504d7a4008fb
②Jekyllをインストール
ruby -v
あるいはrbenv versions
でrubyの生存確認とバージョンをチェックしておきましょう。
確認ができたらgem install bundler jekyll
でJekyllをインストールします。
※gemとはライブラリのことです。gemをインストール→ライブラリをインストールです。pip的なやつ。
※Bundlerはgem管理のライブラリです。詳細はこちら
Jekyllの生存確認もしておきましょう。
jekyll -v
Jekyll 使ってみよう
①Jekyllのプロジェクト作成
jekyll new [プロジェクト名]
でプロジェクトを作成できます。
GitHub Pagesのリポジトリ名に合わせると良いでしょう。(***.github.io)
カレントディレクトリにフォルダが作成されるので、あらかじめJekyll用のディレクトリを作ることをお勧めします。
※リポジトリをクローンしても大丈夫です
②Jekyllスタート
作成したプロジェクトディレクトリに移動し
bundle exec jekyll serve
でJekyllを起動します。
起動したらhttp://127.0.0.1:4000/
にアクセスします。
**Welcome to Jekyll!**と表示されたページにアクセスできれば成功です。
構築完了
これでJekyll構築は終了です。次回以降、実際にJekyllを使用してページを編集してみようと思います。
ありがとうございました。
前回→GitHub PagesとJekyllを使ってポートフォリオページを作ろう①GitHub Pages構築編
次回→