gh-pagesでサイトを公開できる環境をささっと作る。

gh-pagesの使い方

gh-pagesを使うと、簡単なサイトを公開することができるのでちょっとした検証に便利。

ローカルから作成しても、リモートから作成してもどっちでも構いません

• ローカルから作成する場合
• リモートから作成する場合

ローカルから作成する場合

１. ローカルにgh-pagesに公開したいディレクトリを作成する。なんか作っておく(index.htmlとか)
２. git init, git add, git commit

ローカルの作業ディレクトリ内で

$ cd 作業するディレクトリ
	
$ git init 
	
$ git add -A
	
$ git commit -m "index.htmlを作成"
	

３. リモートにリポジトリを作成する(リポジトリ名だけでよいよ)

４. リモートの環境をローカルに登録する。

作業中のローカルディレクトリ

$ git remote add origin あなたのリポジトリ

下の画像の、[e-mail]:あなたの名前/リポジトリ名の部分

５. リモートにプッシュする

作業ディレクトリ

$ git push -u origin master

６. リモートでgh-pagesブランチを切る

７. settingsを見てみる

８. 緑色で、URLが表示されていればOK.

リモートから作成する場合

１. リポジトリを作成します(リポジトリ名だけでよいよ)
　ローカルの時と同じ

２. 作業ディレクトリを作成したい場所でgit clone

ディレクトリをつくりたいとこで

$ git clone [e-mail]:ユーザ名/リポジトリ名.git

ディレクトリができるので、

$ cd 今できたディレクトリ

４. 試しにindex.htmlを作成してみる
５. git add, git commit, git push

作業ディレクトリ

$ git add -A 

$ git commit -m "index.htmlを作成"

$ git push -u origin master

以下、ローカルの時と同じ
６. リモートでgh-pagesをきる
７. settingsを見てみる
８. 緑色で、URLが表示されていればOK.

gh-pagesの作り方でした

補足

リポジトリのトップにindex.htmlがあるならいいんだけど、dist/index.htmlのように１つ下の階層にindex.htmlがあるならアクセスするURLも１つしたの階層にアクセスしないと404 not foundになっちゃうので注意。

README.mdにURLを書いておけばめんどくさくなくて良い。

ローカルの作業ディレクトリでREADME.mdを作成。

http://あなたのURL/index.html

といった感じに

$ git add -A

$ git commit -m "README.mdにURLを記述"

$ git push -u origin gh-pages

---

gh-pagesで作業して問題なければmasterにmergeする

ローカルで作業する場合、gh-pagesで作業しておく。
gh-pagesで作業しておいて、masterにmergeすることでbranchも覚えれる(はずW)。

ローカルで作業（branchは、gh-pages)

$ git branch  # 現在のbranchを確認

masterにいるなら

$ git checkout gh-pages

作業する

$ git add -A

$ git commit -m "gh-pagesで作業した内容"

$ git push -u origin gh-pages

色々、作業して、コミットする。んで、マージする。

$ git branch # 現在のbranchを確認

$ git checkout master # masterに切り替える

$ git merge gh-pages # gh-pagesの内容をmasterにも反映させる

$ git push -u origin master # masterにプッシュする

また、作業する時はgh-pagesにブランチを変えて作業開始

$ git branch

$ git checkout gh-pages