GitHub（ギットハブ）って何? Webディレクター&デザイナー向け活用方法

Webディレクター、デザイナー、エンジニアが使っているGitHub（ギットハブ）というサービスをご存じでしょうか? なんだか難しそう、自分にはあまり関係ない、と思っている方も多いと思います。しかし、GitHub（ギットハブ）は使い方しだいでは劇的にワークフローを進化させる可能性を秘めているものです。 

今回は、そのGitHub（ギットハブ）を使うことで実現できることや、自分のPC内のファイルをGitHub（ギットハブ）と連携させるツールであるGitHubDesktopの使い方を紹介します。

GitHub（ギットハブ）とは

GitHub（ギットハブ）とは、バージョン管理システムの1つであるGit(ファイルの変更履歴を管理するツール)を利用して、ソフトウェア開発プロジェクトのためのソースコードを保存、公開することができるようにしたウェブサービスです。簡単なバグ管理機能、SNSの機能、wiki（メモ書き）やタスク管理ツールなど、コラボレーションのための機能も充実しているのが特長です。                                                                              

GitHub（ギットハブ）はGitHub社という会社によって運営されており、個人・企業問わず無料で利用することができます。

※無料プランの場合、原則すべて公開。非公開にする場合は有料。

GitHub.com

Gitのようなバージョン管理システムを利用するユーザは、ファイルに対して「いつ」「誰が」「何を変更したか」といった情報を記録することができ、過去のある時点の状態を復元したり変更内容の差分を表示できるようになります。

Gitの操作方法は基本的にコマンドラインツール（ターミナルなどを使ってキーボードで扱うこと）ですが、GitHub（ギットハブ）はWeb上でグラフィカルに扱う（マウスで操作する）ことができます。

プログラミングを行うエンジニアにとってGitHub（ギットハブ）は、日々の業務を助ける機能を備えています。では、ディレクターやデザイナーが、GitHubを使うメリットは何でしょうか?

例えば、Webサイトを作る時に、次のようなことを経験したことはありませんか?

• 以前使っていたテストデータがどれか調べたい
• 誰がこのファイルを変更したのか知りたい
•  このファイルのどこが変わったのか比較したい
•  ×日前のファイルに戻したい
•   ファイルが先祖返りしていた

GitHubを使えば上記のような課題を解決できます。その結果、ほかの作業者に影響を与えずに、自分の作業分を進めることができるのです。

GitHub（ギットハブ）の始め方

まず、はじめにGitHub（ギットハブ）のアカウントを作成しましょう。[こちら](https://www.GitHub.com)からユーザ名とメールアドレス、パスワードを登録すればアカウントが作成できます(ユーザ名はほかのGitHubユーザと重複するものは使えません)。

GitHubのSign up画面

アカウントを作成したら、次はリポジトリを作りましょう。リポジトリとは、ファイルや変更履歴などを置いておく場所のことで、画面右上のボタンからcreate repositoryを選択します。次にリポジトリ名を入力し、createボタンを押せばリポジトリができあがります。

ここまでで、いったんGitHub（ギットハブ）側の作業は終わりです。

上部の＋ボタンからNew repository を選択

これだけでリポジトリが作成できます

次はお手持ちの環境で、Gitが使えるように準備しましょう。環境構築にはいろいろな仕方がありますが、ここでは、[GitHubDesktop](https://desktop.GitHub.com/)というアプリケーションを使う方法を紹介します。

GitHub Desktopのトップページ。ここからダウンロードできます

なぜGitHubDesktopを使うかというと、先ほども説明しましたが、Gitは俗に「黒い画面」とよばれるターミナルやコマンドプロンプトで、キーボードからコマンドを入力して使います。これは慣れていなければ非常にハードルは高く、実際エンジニアでも完璧に使いこなすのは難しいものです。

そこでGUIを備えて、操作も容易なGitHubDesktopを利用します。

GitHub（ギットハブ）とGitHubDesktop（ギットハブデスクトップ）の連携

GitHubDesktop（ギットハブデスクトップ）インストールしたらまず、先ほど作成したGitHub（ギットハブ）のアカウントでログインします。そうすると先ほど作ったリポジトリも確認することができますし、それを自分のPCにダウンロードすることもできます。

ログインして

File > Clone repository を選択

リポジトリの中身をダウンロード

そして、ファイルを修正した場合、変更前との差分が表示されるので、問題なければコミット(ファイルをアップロードする準備)してGitHubにアップロードします。

自分のPCでファイルを作成/更新したら、変更理由などを入力して左下のボタンを押下します

すると、右上のボタンがPush originに変更されるので、そこを押下します

ファイルがアップされます

GitHub（ギットハブ）では、はじめにファイル一式をダウンロードすることをクローン(clone)、更新したファイルをアップロードすることをプッシュ(push)、そして更新部分を反映することをマージ(merge)もしくはプル(pull)と言います。

まとめ

GitHub（ギットハブ）やGitHubDesktop（ギットハブデスクトップ）の使い方を簡単にまとめました。

確かにこれらのツールは慣れるまでは使いこなすことが難しいです。しかし、慣れてしまえば、ツールを使っていなかった頃が信じられない、というほどワークフローを効率化する可能性があります。誰でも無料で始めることができるので、ぜひ一度試して見てください。