Github Pagesとjekyllでホームページを作成する

GitHubの準備

GitHubに接続

1. GitHubのアカウントを作成する
2. GitHubにホームページ用のリポジトリを作成する

ローカルPCの準備

ソフトウェアのインストール

• Git
• Github Desktop
• Ruby ※Windowsのみ
• VS Code

jekyllでホームページを作成する

GitHub Desktop

• GitHubで作成したホームページ用のリポジトリをローカルにクローンする

VS Code

• クローンしたフォルダを読み込む
• ターミナルでjekyllのコマンドを実行してインストールする
• jekyllの設定を変更する
  

_config.yml

# baseurl: ""
# url: ""
# baseurl と url を GitHub Pages のリポジトリに合わせる。 
baseurl: "/****" # *.github.io/[ここ]
url: "https://********.github.io"

GitHubへプッシュする

VS Codeの拡張機能

1. Japanese Language Pack for Visual Studio Code
2. HTML CSS Support
3. HTML Snippets
4. HTML Preview
5. IntelliSense for CSS class names in HTML
6. Live HTML Preview
7. Bracket Pair Colorizer
8. indent rainbow
9. Rainbow CSV
10. Log File Highlighter
11. Pretter
12. Local History
13. ESLint
14. EditorConfig for VS Code
15. Git Graph
16. Git Lens
17. Git History
18. Material Icon Theme
19. Path Intellisense
20. json
21. Paste JSON as Code