Web制作をしていると必ずと言って良いほど行うのがGitやSubversionを利用したバージョン管理。プログラマーの方にとっては当たり前かもしれませんが、デザインを中心に行っているデザイナーにとってはあまり馴染みがないかもしれません。
しかし、実際の仕事は今日から始めるバージョン管理でも書いたように複数人で作業を行うため、誤ってファイルを上書きしたり、削除したりといった事故が発生します。
こういった事故を防ぐことができるのがバージョン管理なのです。バージョン管理システムを使うことでアップデートしたファイルを細かく保存でき、いつでも以前の状態に戻すことも可能。う〜んすばらしい!
ということで、もっとたくさんの人にバージョン管理システムを導入してもらうため、3ステップで簡単に始めるGitの使い方を紹介します。
3ステップでGitを使う!
ではさっそくいってみましょう。まずはインストールからです。
ステップ1:Gitのインストール
Macを使っている人はすでに入っているので次のステップへ。WindowsでまだGitを入れていない場合は以下の手順でGitをインストールします。
まずはこちらのサイトからGit for Windowsをダウンロードしましょう。
ダウンロードしたファイルを実行してインストーラを立ち上げます。インストールはとくに設定の必要なくnextを押してどんどん先へ進めばOK。
インストールが完了すると以下のようにスタート画面にアプリが表示されていればOK(win7)。
ステップ2:SourceTreeをインストール
Gitというと必ず出てくるのがターミナルやコマンドプロンプトというもの。コマンドを入力して様々な操作を行うのですが、わざわざキーを打たなくてもGUIで操作する方が簡単。
ここではSourceTreeという便利なソフトを使ってさくっとGitを使ってみます。
ソフトはこちらからダウンロードします。
ダウンロードしたらインストーラを立ち上げ、ソフトをインストール。Macの場合はアプリケーションフォルダへ入れるだけの簡単操作で完了。
ステップ3:Gitを使ってみる
準備が整ったところで、さっそくGitを使ってみます。あまり細かいところは考えずGitの基本であるリポジトリ作成からプッシュまでやってみます。用語の説明については今日から始めるバージョン管理を参照して下さい。
ではまずローカルリポジトリを作成します。SourceTreeを立ち上げるとこちらのようにブックマークパネルが表示されるので、リポジトリを作成をクリック。
そのあとローカルリポジトリに設定したいフォルダを選択します。今回はとりあえずデスクトップにrepo-testを作りました。
作成すると、ブックマークに登録されるのでダブルクリックしてメイン画面を起動しましょう。
できたら、ローカルリポジトリに何かファイルを作ります。ここではREADME.mdを作成し、以下のように記述しました。
# 初めてのGit
## 初めてのコミット
するとメイン画面に作成したファイルが表示されます。このファイルをステージに登録する必要があるので、ファイルを選択している状態でドラッグ&ドロップ。
ステージに登録されたら、ツールバーにあるコミットボタンを押してコミットします。その際にコメントを入れておきます。
すると画面にmastarブランチが作成され、中身を見ると先ほどコミットしたファイルが登録されました!あとはファイルを更新して保存するたびにコミットすればどんどんバージョンが追加されていきます。
ここからがスタート!!
ここまでで基本的なGitの使い方が分かったと思います。特に難しいことはなく、ファイルを更新したらコミットすれば良いだけ。
でもこれでマスターできたと思ってはいけません。Gitの世界はまだまだ置くが深く宝の山が待っているのです。その名もGithub。
Githubがヤバい理由
Githubとは世界中のデベロッパーが様々なコードを公開してくれている場所です。例えばマウスオーバーの綺麗なエフェクトやスライダーなどのコンポーネント、使い勝手の良いHTMLテンプレートなどなど。
もちろんこれらを利用してWeb制作に活用しても良いし、ここからオリジナルのコンポーネントを作成してもOK。これを活用しないのは目の前の宝の山を素通りするようなものです。
それをこの場で解説してもよいのですが、最近ものすごい本が出版されました。それがこちら。
Githubの使い方から、実際の仕事の現場で使用する際のワークフローまで非常に分かりやすく書かれています。今からでも遅くありません。Githubの魅力を実感したら、あとはどんどん活用していきましょう!