ホームに戻る
出典 :
GitHub Pagesのドキュメンテーション - GitHub Docs
目次 :

WebページをGitHubで公開

GitHub Pages の機能を用いることで、WebページをGitHubでホストすることができる。
クライアントサイドスクリプトも使用可能。

手順

  1. 新しいリポジトリを作成する。
    その際、リポジトリ名を [ユーザ名].github.io とすると共に、公開範囲を Public とする必要がある。
    (GitHub Premium を契約している場合を除き、プライベートリポジトリは公開できない。)


  2. Settings > Code and automation > Pages を開き、公開元を選択後、Save を押す。
    Source : Deploy from a branch
    Branch : main / (root)

  3. リポジトリ下にWebページを配置し、プッシュ(デプロイ)する。
    即座には公開されない場合があるため、10分程度待機する。
  4. 1. で設定したURLをWebブラウザに入力すると、ページが表示される。

アセット(CSS / JS / 画像 / その他ファイル)について (※重要)

HTML文書以外のアセットは、パスの指定が異なるため注意が必要。

画像およびバイナリファイル


通常のWebサイトと異なり、画像や音声、動画などのバイナリファイル(BLOB)は格納先が強制的に変更される。
https://raw.githubusercontent.com/[ユーザ名]/[リポジトリ名]/[ブランチ名]/[リポジトリルートからの相対パス]
または
https://github.com/[ユーザ名]/[リポジトリ名]/blob/[ブランチ名]/[リポジトリルートからの相対パス]?raw=true
の形式(直接パス)で指定する。

スタイルシート(CSS)、スクリプトファイル(JS)


CSSおよびJSはルートディレクトリに配置する必要がある。 (ルートディレクトリ下の他のディレクトリに配置した場合、パスの指定が正しくても動作しない。)
BLOBと異なり、base からの間接パスとして指定が可能である。

URLの指定について


通常のWebサイトと同様、index.html はディレクトリ名のみでアクセス可能。
ただし、README.md が存在する場合はそちらが優先される。
即ち、アドレスバーにディレクトリを指定した場合の挙動は となる。