僕は僕でだれかじゃない

ビジネスとテクノロジーと健康についてあれこれ

MENU

【初心者向け】GitHub Pagesを3分で作るための覚え書き

f:id:sitk:20160713222513p:plain

前回の記事「【初心者向け】コーディングガイドラインをGitHubで管理する覚え書き」はいかがでしたか?

www.kobatatakayuki.com

もう少し、実用的な視点でGitHubを見ていきたいと思います。

GitHubのおさらい

まずは、前回あまり突っ込んで話してなかったことを書いてみます。

github.com

Gitとは

分散型バージョン管理システムの一つです。

Gitでは、ファイルの状態を好きなときに
更新履歴として保存しておくことができます。

そのため、一度編集したファイルを過去の状態に戻したり、
編集箇所の差分を表示したりすることができます。

また古いファイルを元に編集したファイルで、 他人の編集した最新ファイルを上書きしようとすると サーバーにアップロードした時に警告がでます。

そのため、知らず知らずのうちに他人の編集内容を 上書きしてしまうといった失敗は起こりません。

Subversionとの違い

  1. SVNではチームの成果しか管理できないがGitは個人の作業をバージョン管理できる
  2. Gitはリカバリーが非常に手軽に出来る。SVNだとリカバリーに手間がかかる
  3. マージする範囲をSVNでは調べる必要があるが、Gitでは必要ない

GitHub とは

ウィキペディアには、こう書いてあります。

GitHub(ギットハブ)はソフトウェア開発プロジェクトのための共有ウェブサービスであり、Gitバージョン管理システムを使用する。

https://ja.wikipedia.org/wiki/GitHub

使ってみた感じ、Subversionよりもサクサク動いてる気がします。

それでは、本題に入っていきましょう。

GitHub Pages

GitHubの機能で「GitHub Pages」というものがあります。

pages.github.com

これが、重宝するんだなぁ。

では、みていきましょう。

Github Pages とは

  • HTMLを Git で管理して、Github へ プッシュすれば公開できる
  • 基本、静的ページのみの公開となる
  • 公開リポジトリで作れば無料でできる

サーバーの契約を必要としないですし、さくっとページを公開したい際には、とても良いです。

実際にGitHub Pagesを作ってみる

まずは、リポジトリをつくります。

気をつけておくのが、リポジトリ名。

xxxxx.github.io

という形式で命名しておきます。

これが、後々URLになりますので!

僕の場合は、こちら。

kobatatakayuki.github.io

ですね。

f:id:sitk:20160714062953j:plain

名前を決めたら、テンプレートを作っていきます。

テンプレートに必要情報を記載する

f:id:sitk:20160714063615j:plain

テンプレートに、必要情報を記載していきます。

Google Analyticsの設定も可能です。

設定が終わりましたら、テーマを選びます。

テーマを選ぶ

Github Pages 用のテーマが予め用意されています。

f:id:sitk:20160714063733j:plain

こんな感じ。

詳しくは、下記の記事が参考になるでしょう。

qiita.com

テストページ

出来上がったのは、こんな感じ。

f:id:sitk:20160714055417p:plain

https://kobatatakayuki.github.io/

このURLは、ギークな感じですね(๑´ڡ`๑)

(サンプル用なので、中身はありませんが。。。)

はい、だいたい3分でできてしまいました!

簡単ですね!

僕が、ここ最近お世話になっているアクセシビリティのコミュニティ「AccTalk」のサイトでも、GitHub Pagesが使われております!

ソーシャルコーディング

フォークして、プルリクエストすれば、複数人での作業が可能になります。

GitHUbがソーシャルコーディングと言われる所以です。

これこそが、GitHubの醍醐味ですね。

Github で管理するなら Sourcetree は必須!

https://ja.atlassian.com/software/sourcetree/overview

SourceTree は Mac や Windows で使える、開発者のための強力な Git/Mercurial デスクトップ クライアントです。

ということで、これはぜひインストールしておきましょう。

参考サイト

www.backlog.jp

liginc.co.jp

www.find-job.net

はじめてのGit @ schoo

GitHub 実践入門 の著者 大塚 弘記 さんの授業です。

schoo.jp

ぼちぼち見始めましたー。

書籍紹介

前回もご紹介しました、GitHub 実践入門

GitHub実践入門 ~Pull Requestによる開発の変革 (WEB+DB PRESS plus)

GitHub実践入門 ~Pull Requestによる開発の変革 (WEB+DB PRESS plus)

GitHubをもっと使いこなしたいなぁ。

おわり。