3
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

GitHub Pagesの使い方について

Last updated at Posted at 2025-02-26

1. リポジトリを作成する

GitHub Pagesでは、GitHubを利用してWebページを公開することができます。 また、Webページをを公開する時に以下のものが必要となります。
  • GitHubのアカウントの作成
  • Gitの開発環境用意(任意)

GitHubアカウントのみあればWebページを公開することができます。
まずリポジトリを作成する必要があります。

  1. 右上のアイコンをクリックしてYour repositoriesを選択します。
  2. NewもしくはNew Repositoryを選択します。
  3. Repository nameにリポジトリ名を入力します。
  4. リポジトリがPublicになっていることを確認して create repositoryをクリックします。
  5. リポジトリの完成!

2. ファイルをアップロードする

ファイルのアップロード方法は2つあります。 どちらでもアップロードは可能なのですが、Gitの開発環境がない場合は1つ目の方法でアップロードをしましょう。
1つ目は、GitHubリポジトリに直接アップロードする方法です。
  1. 「ユーザ名/リポジトリ名」下の上部バーでcodeが選択されているか確認する。
    (リポジトリを開くとデフォルトで選ばれている)
  2. add file ▽を選択する。
  3. Upload filesを選択する。
  4. Drag files here to add them to your repositoryのところに対象のフォルダをDrag and Dropするか chose your filesで対象のフォルダを選択する。
  5. アップロード完了!

2つ目は、Gitを使ってpushしてファイルをアップロードする方法です。

  1. mkdir リポジトリ名でリポジトリを作成する。
  2. cd リポジトリ名で対象のリポジトリに移動する
  3. git init で gitリポジトリを作成する
  4. レポジトリをVSCodeなどのエディターで開いてファイルをアップロードする
  5. git addコマンド git commitコマンドを実行する。
  6. git remote addコマンドをGitHubのリポジトリからコピーして実行する。
  7. git push origin mainでリモートリポジトリにフォルダを送信。
  8. アップロード完了!

補足
mainブランチと作業用ブランチを分けているときは「git push origin 作業用ブランチ名」を実行してから
pull requestを出してmainブランチにmergeすればmainブランチにアップロードできます。

3.GitHub pagesを公開するには

  1. 対象のリポジトリに移動する。(移動してなかったら)
  2. 「ユーザ名/リポジトリ名」下の上部バーでsettingが選択する。
  3. サイドバーのpagesを選択する
  4. branchがNoneとなっているのでmainに変更してSaveを押します。
  5. Webページの公開完了!
また、Webページを確認する際には
  1. Saveを押した後http(s)://.github.ioというようなURLが表示されるのでコピーします。
  2. リポジトリが複数ある場合はサイトに上記のURLを貼り付けて
    http(s)://.github.io/となるように書き加えます。
  3. WebサイトでGitHub Pageが公開されたことが確認できます。
  4. 確認完了!

補足
GitHub Pagesの内容を変更するには修正したファイルのアップロードを行えば数分後に自動で更新されます。
またURLの右側にある「•••」のマークを押してUnpublish siteを選択すれば公開が取り下げられます。

3
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
3
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?