Jekyllで静的ページをつくる

Jekyll環境構築のメモです。

# Jekyllとは
Markdownで書かれたページを静的Htmlに変換してくれるジェネレーターになります。
Githubリポジトリを静的ページとして公開できるGithub Pageサービスを利用することで
簡単にブログなどを公開できます。



# 環境構築
Rubyとbundlerインストール済の前提(Rubyは2.5以上)

## Jekyllインストール
```
$ gem install jekyll 
```

## デフォルトのJekyllサイトを作成してみる
```
$ jekyll new test
$ cd test
test $ tree
.
├── 404.html
├── Gemfile
├── Gemfile.lock
├── _config.yml
├── _posts
│   └── 2020-08-31-welcome-to-jekyll.markdown
├── _site
│   ├── 404.html
│   ├── about
│   │   └── index.html
│   ├── assets
│   │   ├── main.css
│   │   ├── main.css.map
│   │   └── minima-social-icons.svg
│   ├── feed.xml
│   ├── index.html
│   └── jekyll
│       └── update
│           └── 2020
│               └── 08
│                   └── 31
│                       └── welcome-to-jekyll.html
├── about.markdown
└── index.markdown
```
about.markdown, index.markdown, 2020-08-31-welcome-to-jekyll.markdown が 静的HTMLに変換され _siteディレクトリ配下に配置されている。


## ローカルサーバを起動してサイトを確認してみる
```
test $ bundle exec jekyll serve
Could not find gem 'minima (~> 2.5)' in any of the gem sources listed in your Gemfile.
```
デフォルトテンプレートである `minima` が見つからないとエラーになるので bundle intallをする

```
test $ bundle install
The dependency tzinfo (~> 1.2) will be unused by any of the platforms Bundler is installing for. Bundler is installing for ruby but the dependency is only for x86-mingw32, x64-mingw32, x86-mswin32, java. To add those platforms to the bundle, run `bundle lock --add-platform x86-mingw32 x64-mingw32 x86-mswin32 java`.
The dependency tzinfo-data (>= 0) will be unused by any of the platforms Bundler is installing for. Bundler is installing for ruby but the dependency is only for x86-mingw32, x64-mingw32, x86-mswin32, java. To add those platforms to the bundle, run `bundle lock --add-platform x86-mingw32 x64-mingw32 x86-mswin32 java`.
The dependency wdm (~> 0.1.1) will be unused by any of the platforms Bundler is installing for. Bundler is installing for ruby but the dependency is only for x86-mingw32, x64-mingw32, x86-mswin32. To add those platforms to the bundle, run `bundle lock --add-platform x86-mingw32 x64-mingw32 x86-mswin32`.
Fetching gem metadata from https://rubygems.org/..........
Fetching gem metadata from https://rubygems.org/.
Resolving dependencies...
Using public_suffix 4.0.5
Using addressable 2.7.0
Using bundler 2.1.4
Using colorator 1.1.0
Using concurrent-ruby 1.1.7
Using eventmachine 1.2.7
Using http_parser.rb 0.6.0
Using em-websocket 0.5.1
Using ffi 1.13.1
Using forwardable-extended 2.6.0
Using i18n 1.8.5
Using sassc 2.4.0
Using jekyll-sass-converter 2.1.0
Using rb-fsevent 0.10.4
Using rb-inotify 0.10.1
Using listen 3.2.1
Using jekyll-watch 2.2.1
Using rexml 3.2.4
Using kramdown 2.3.0
Using kramdown-parser-gfm 1.1.0
Using liquid 4.0.3
Using mercenary 0.4.0
Using pathutil 0.16.2
Using rouge 3.22.0
Using safe_yaml 1.0.5
Using unicode-display_width 1.7.0
Using terminal-table 1.8.0
Using jekyll 4.1.1
Fetching jekyll-feed 0.15.0
Installing jekyll-feed 0.15.0
Fetching jekyll-seo-tag 2.6.1
Installing jekyll-seo-tag 2.6.1
Fetching minima 2.5.1
Installing minima 2.5.1
Bundle complete! 6 Gemfile dependencies, 31 gems now installed.
Use `bundle info [gemname]` to see where a bundled gem is installed.
```

これでサーバ起動できた

```
test $ bundle exec jekyll serve
Configuration file: /test/_config.yml
            Source: /test
       Destination: /test/_site
 Incremental build: disabled. Enable with --incremental
      Generating...
       Jekyll Feed: Generating feed for posts
                    done in 0.695 seconds.
 Auto-regeneration: enabled for '/test'
    Server address: http://127.0.0.1:4000/
  Server running... press ctrl-c to stop.
```


# http://localhost:4000 で確認
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/532385/83932494-f38b-004b-d728-c67482361c69.png)