Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
1059
Help us understand the problem. What is going on with this article?
@tonkotsuboy_com

GitHubのmasterブランチをWebページとして公開する手順(GitHub Pages)

GitHubでは、サーバーを自前で準備しなくてもWebページを公開できる「GitHub Pages」という機能があります。これまでは、gh-pagesという別ブランチを作成して、そこにソースコードをプッシュする必要がありました。しかし、本日(2016/08/18)実装された新機能により、masterブランチのみでWebページを公開できるようになりました

本エントリーでは、具体的な設定手順を紹介します。

手順

masterブランチにて、「docs」フォルダーを作成します。このフォルダーに公開したいWebページのソースコードを入れます。

masterブランチをプッシュします。

GitHubのリポジトリページ上で、[Setting]→[GitHub Pages]→[Source]で、[master branch/docs folder]を指定します。

[Save]を押すと、下図の赤枠部分に公開されたWebページのURLが表示されます。URLはhttps://(ユーザー名).github.io/(リポジトリ名)/となります。

URLにアクセスすると、docsフォルダー以下にWebページが閲覧できます。サンプルページを公開しました。

■ リポジトリ
https://github.com/tonkotsuboy/16018_myProject

■ 公開Webページ
https://tonkotsuboy.github.io/16018_myProject/

image.png

▲ 公開Webページのキャプチャー

HTML、CSS、画像ファイル、JavaScript(コンソールログを出力しています)が正しく反映されているのがわかります。

masterブランチで作業できるのは非常に便利

サーバーを別途準備せずにWebページを公開できるGitHub Pages機能は重宝していましたが、これまで別ブランチgh-pagesで作業する必要があり、masterブランチとの差分をマージするのが手間でした。今回の新機能により、最新ファイルをmasterブランチで管理できるようになり、利便性が高まりました

是非ご利用ください。

1059
Help us understand the problem. What is going on with this article?
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
tonkotsuboy_com
フロントエンド / 九州大学卒 / ウェブ制作 / JavaScriptコードレシピ集の著者 / CSS Nite 2017〜2019ベストセッション / TechFeed公認エキスパート /お仕事依頼はDMまで
moneyforward
「お金を前へ。人生をもっと前へ。」をMissionとして、個人向け、法人向け様々なFintechサービスを開発、提供しています。

Comments

No comments
Sign up for free and join this conversation.
Sign Up
If you already have a Qiita account Login
1059
Help us understand the problem. What is going on with this article?