Gitを使ってホームページをレンタルサーバにアップロードする方法（エックスサーバー、さくらのレンタルサーバ）

今まで、FTP経由でファイルをアップロードしていましたが、Gitを使った方法を覚えてからは、もっぱらこちらの方法を使っています。
主に、ターミナルと呼ばれるツールを使って、コマンドを入力する方法で様々な処理を行います。初めは取っつきにくいですが、慣れればさほど難しくはありません。

はじめに

良い点

・アップロードも楽ですが、更新がもっと楽。
・更新漏れや、失敗がない。
・アップロードスピードが速い。
・Gitを使っているので、バージョン管理ができる。

悪い点

・導入の敷居が高い。

以上のように、一度導入してしまえば良い事ずくめです。
さっそく、導入方法を書いていきますが、工程が結構なボリュームなので、途中、過去記事参照を挟みながら進めていきたいと思います。

ローカルのプロジェクトにGitを導入する

まずは、Gitの導入ですが、いきなりちょっと大変です（汗）
でも、以下の過去記事を参考に、とりあえず導入のみでOKなので、やってみてください。

本当に超超超初心者のためのGit入門（導入編）

本当に超超超初心者のためのGit入門（実践編）

サーバとSSH接続ができるようにする

次に、ターミナルから直接サーバを操作するために、SSHの接続を設定します。
SSHでの接続に対応しているサーバでないと、この記事の方法は使えません。エックスサーバーとさくらのレンタルサーバでは、SSH接続が可能です。

鍵の作成

鍵の作成方法については、別記事にまとめました。

SSH接続の鍵（キー）の作成

SSH接続

SSHの接続方法も、別記事にまとめました。

レンタルサーバにSSH接続をする方法（エックスサーバー、さくらのレンタルサーバ）

サーバにもGitを導入する

ローカルとサーバの間でGitを使ってやり取りするので、サーバにもGitをインストールしなければいけません。

サーバにGitをインストール

エックスサーバ、さくらのレンタルサーバ、ともにデフォルトでGitがインストールされているようです。

最新版をインストールしたい場合は、以下の記事。

Xserver（エックスサーバー）にGitをインストールする

リポジトリ作成

サーバにGitをインストールできたら、サーバ上のホームページを設置するディレクトリ内で、以下のコマンドを打って、リポジトリを作成します。

$ git init

サーバにベアリポジトリを用意する

本番リポジトリの他に、ベアリポジトリというものも用意する必要があります。
このベアリポジトリが肝になります。

サーバ上のリポジトリにアップロード（git push）する際、直接公開リポジトリにアップロードしても、ファイルが展開されないため、ホームページが更新できません。

アップロードの流れ

・ローカルリポジトリを、サーバのベアリポジトリへPush
・本番リポジトリからベアリポジトリをPullする

という流れでホームページを更新します。

ベアリポジトリ作成

ベアリポジトリの作り方は簡単で、以下のコマンドで作れます。

$ git init --bare

作成する場所は、基本的にはどこでもいいのですが、自分は非公開ディレクトリに「プロジェクト名.git」という名前でディレクトリを作ってその中に作っています。

ベアリポジトリにPushしたら自動的に本番リポジトリに反映される仕組みを作る

今のままだと、ローカルリポジトリからベアリポジトリにPushした後、更に本番リポジトリからベアリポジトリをPullしなければ、ホームページが更新されないため、手間ですね。

そこで、ベアリポジトリにPushしたら、自動的に本番環境に反映される仕組みを作っておきましょう。

post-receiveファイルの設置

「post-receive」というファイルを作って、ベアリポジトリのディレクトリ内の「hooks」というディレクトリの中に保存します。
ベアリポジトリにPushされたタイミングで自動的にこのファイルが実行されます。

内容は以下の通り。

#!/bin/sh
cd ~/[ドメイン名]/public_html/[プロジェクト名]
unset GIT_DIR
git pull origin master

パスなどは、エックスサーバーの場合の例ですが、環境に合わせて各自書き換えてください。

パーミッションの変更

「post-receive」ファイルのパーミッションを「777」に変更します。
パーミッション変更コマンドは以下の通りです。

$ chmod 777 ~/[ドメイン名]/[プロジェクト名].git/hooks/post-receive

ファイルのパスは、各自変更してください。

本番リポジトリにリモートリポジトリを登録

「post-receive」ファイル内でPull処理をしてますが、このままでは、Pull先を設定していないので、エラーになります。

というわけで、本番リポジトリにリモートリポジトリの登録をしておきます。
リモートリポジトリには、先程作ったベアリポジトリを指定します。

$ git remote add origin ~/[ドメイン名]/[プロジェクト名].git

一度登録したリモートリポジトリを変更したい場合は、以下のコマンド。

$ git remote set-url origin ~/[ドメイン名]/[プロジェクト名].git

登録内容を確認するには、以下のコマンド。

$ git remote -v

パスは自分の環境に合わせて変更してください。

ローカルからベアリポジトリへPushする

ローカルリポジトリにリモートリポジトリを登録

Pushする前に先程同様、ローカルリポジトリにもリモートリポジトリとして、サーバのベアリポジトリを登録します。

#リモートリポジトリの登録（エックスサーバーの場合）
$ git remote add origin ssh://[サーバID]@[ドメイン名]:10022/home/[サーバID]/[ドメイン名]/[プロジェクト名].git

#configファイルにHostを登録している場合
$ git remote add origin ssh://[登録した名前]/home/[サーバID]/[ドメイン名]/[プロジェクト名].git

パスは、サーバや環境によって違うので、各自書き換えてください。

Pushする

ここまでの工程をすることで、準備が整ったはずです。
早速、ローカルリポジトリからベアリポジトリへPushしてみましょう！

#ローカルリポジトリからリモートリポジトリへプッシュ
$ git push origin master

自動的に、本番リポジトリがPullしてファイル更新できましたか？
できていない場合は、コマンドの入力ミスや各所のファイルパスを見直してみてください。また、Git上でエラーが起きていないか確認して、問題を解決するとうまくいくかも知れません。

まとめ

以上が、Gitを使ったサーバへのアップロード（デプロイ）の方法ですが、結構大変ですね・・・。

でも、この工程は最初だけで、一度環境を作ってしまえば、あとは「Push」するだけで、アップロードされるので、とても簡単で便利です。
新しくホームページを作る時も、次からは、ベアリポジトリを作るところからの作業で済むので、それほど大変ではありません。

まだGitを使っていない方は、この機会にぜひ導入してみてはいかがでしょうか？