Githubページを使用してブログでセットアップあなたの自由ポートフォリオ

この記事はどのように迅速かつ自由に構築し、自分自身をホストする方法を示すシリーズの一部ですJekyll ブログを書くGitHub Pages . このシリーズはまた、直接私たちのコードを使用してコメントシステムを追加するようなより高度なトピックをカバーしますStaticman とプライバシーを使用してまだ無料の分析を使用してUmami .
チュートリアルをいくつかの部分に分けました.

Introduction

あなたを設定する

Create Content

Customize Display

Commenting System - Part 1

Commenting System - Part 2

Analytics

さて、どのように設定し、ウェブサイトを展開するかを見てみましょう.

ページのリポジトリを作成する
Githubページを使用してWebサイトを展開するには、次の規約を使用して新しいパブリックリポジトリを作成する必要があります.<username>.github.io .

一旦これをしたら、あなたの倉庫の内容はhttps://<username>.github.io . を追加することができますindex.html 「Hello World」を使用してリポジトリのルートをファイルします.
任意のリポジトリからウェブサイトを展開することができますが、この場合、関連URLはhttps://<username>.github.io/<repository-name> . この機能は、たとえばプロジェクトのドキュメントを展開するのに非常に便利です.
このチュートリアルでは、gp-blog ( Githubページのブログ用)https://simondosda.github.io/gp-blog , しかし、おそらくあなたはおそらくルートフォルダにあなたのポートフォリオを展開したいです.
Gitリポジトリの準備が整いましたので、ジキルのセットアップ方法を見てみましょう.

あなたのジキル静的ウェブサイトをつくってください
JekyllはRubyの宝石ですので、すべての前提条件をインストールする必要があることを確認します.あなたのOSでそれらをインストールする手順と手順を見つけることができますhttps://jekyllrb.com/docs/installation/ .
これを済ませたら、JekyllとBundle Gemをインストールします.

gem install jekyll bundler

我々は現在、次のコマンドで作成したリポジトリ内のJekyllプロジェクトを初期化できます.

jekyll new .

次に、Gemfileファイルを開き、gem "jekyll" 行とコメントの解除gem "github-pages" 一つ

# This will help ensure the proper Jekyll version is running.
# Happy Jekylling!
# gem "jekyll", "~> 4.2.0"
# If you want to use GitHub Pages, remove the "gem "jekyll"" above and
# uncomment the line below. To upgrade, run `bundle update github-pages`.
gem "github-pages", "~> 214", group: :jekyll_plugins

バージョン(ここ214)の場合は、最新バージョンを見つけることができますhere .
次に、コマンドを入力できますbundle update あなたの依存関係をインストールして、ローカルであなたのウェブサイトを提供するためにbundle exec jekyll serve --livereload .
あなたの新しいブログはlocalhost:4000 . ご覧の通り、カスタマイズが必要です.

グローバル設定
我々は、現在我々の新しいブログをカスタマイズし始めることができます.最初にすべきことは_config.yml ファイル.そこにあなたのブログのタイトル、その説明、あなたのメールアドレス、およびGitHubのユーザー名を編集することができます.
また、あなたのTwitterのユーザー名を入力したり、対応する行をコメントしていない場合.
また、プロパティを追加することができますてshow_excerpts: true ホームページの記事の抜粋を表示するには.
その他の逸話は、ページのpermalink生成を変更することができますpermalink 属性.以下のような入れ子構造を使用するのが好きです.

permalink: /:collection/:year-:month-:day-:title:output_ext

使っても--livereload オプションでは、_config.yml ファイル.お使いのサーバーをkillし、それを再起動する必要があります.
すべてがOKなら、変更をコミットしてプッシュできます.
設定であなたのgithubリポジトリにあなたのウェブサイトを展開するブランチを編集することができます→ ページ→ ソース.
はい.我々は今、私たちのブログのバックボーンをアップして実行している!
この部分のコードを見つけることができますhere .
次のステップはadd some content to our website .