- レンタルサーバはお金がかかる
- Javascriptなどを使用したサイトを簡単に公開したい
ウェブサイトを公開したい。しかしいろいろなハードルがあって、簡単にはいかないですよね。
ブログ公開等なら、はてなブログやWordPressなどを使ってとりあえずどうにかできます。
しかし自分でHTMLやJavascriptをがっつり書いたサイトを公開したいなら少し難しくなりますよね。
そこで今回は、GitHub Pagesを使用した静的なページの公開方法を紹介します。
GitHub Pagesの公開の仕方
さて早速手順を紹介します。
公開するリポジトリの作成
まずは公開する用リポジトリを作成していきます。
GitHubのリポジトリの右上のほうにある「New」をクリックします。
リポジトリの名前を入力します。
このリポジトリ名は後々のデフォルトURLに影響するので、こだわりがある人はその辺を意識して名づけてください。
先ほど作成したリポジトリをローカルにクローンします。
ここではTortoiseGitでクローンしてますが、コマンドでもSourceTreeでもなんでもいいです。
index.htmlのコミット
実際に公開するindex.htmlを用意します。
今回は過去に公開している ヒプノシスマイクのキャラクターソートを公開してみようと思います。
リポジトリのマスターブランチにコミット＆プッシュします。
実際にPagesを公開する
実際に公開する手順を紹介します。
リポジトリのページの右の上のほうにある「Setting」をクリックします。
ページの中程にあるGitHub Pagesの設定欄にあるNoneを「Master Branch」に変更します。
公開されたサイトの確認
上記手順後に、URLが表示されます。
そのURLをコピペしてブラウザに貼り付けます。
無事にサイトが表示されました。
Javascriptも無事に動作しています。
https://imura-moto.github.io/JavascriptPageTest/
まとめ
今回はGitHub Pagesを使って静的なWebページを公開してみました。
思った以上に簡単にできたので、正直拍子抜け位です。
こんなに簡単に公開できるのなら、もっと早く手を出しておけばよかった。
これから使い方をいろいろ考えようと思います。