おでこです。自宅では Windows のデスクトップマシン、出先や勉強会では MacBook Air を使っているのですが、それぞれに作っている XAMPP のローカル環境がバラバラなのがずっと不満でした。勉強会で一からローカル環境作り直したり。自宅と MBA で同じバージョンの WordPress を2回もインストールしたり。
でも、そんなこととももうおさらば！Dropbox を使って ローカル環境を同期することにしてみました。具体的な手順は以下をご覧あれ。
XAMPP のファイル構成は OS によってまったく違う
複数クライアントの XAMPP 環境の同期と聞いて、「そんなの XAMPP フォルダを Dropbox フォルダに入れて同期すれば終了だろ、JK」と思う方もいるかもしれません。XAMPP 環境を扱うクライアントがすべて同じ OS であればこの方法でも解決できますが、Windows と Mac あるいは Linux などを使い分けていると、この方法ではうまくいきません。
それは、XAMPP のファイル構成が OS によって違うからです。たとえば、Mac の XAMPP では /xampp/xamppfiles/bin/ の中にアプリケーションファイルがまとめられていますが、Windows の XAMPP フォルダでは /xampp/apache/ や /xampp/mysql/ などそれぞれのフォルダごとにアプリケーションが分散しています。もちろん、Windows のアプリケーションは Mac では動きませんし、その逆も無理。OS をまたがった同期を行うにはこの方法は不向きです。
htdocs と mysql を同期する
そこで、公開サイトのデータの格納先であるドキュメントルートと データベースである MySQL のデータファイルをそれぞれのクライアントの Dropbox ディレクトリに配置するように設定し、Dropbox のオンラインストレージ経由で同期を取ることにします。
ぼくは htdocs を sites というフォルダをつくって同期を取りましたが、別に Dropbox 内にも htdocs を作っても問題ないきがします。
とりあえず XAMPP をインストールする
すでにインストールできて準備万端(;ﾟ∀ﾟ)=3な人は飛ばしてください。
まだの方は、APACHE FRIENDS からそれぞれの OS にあった XAMPP のパッケージを落としてください。
Windows の方は C:\xampp\ に、Mac の方はアプリケーションフォルダの中にインストールでいいんじゃないかな。
ドキュメントルートを dropbox 内のフォルダに割り当てる
通常ドキュメントルートは htdocs が割り当てられているはずで、このフォルダの中身が公開されるようになっていますが、これを dropbox フォルダの中につくった sites フォルダが公開されるように設定を変更します。以下、YOURNAME のところはコンピュータのアカウント名に適当に書き換えてくださいね。
Windows 編
C:\xampp\apache\conf\httpd.conf に以下を追加（位置はわりとどこでもおｋ）します。
<Directory “C:\Users\YOURNAME\Documents\My Dropbox\sites”>
|
1 2 3 4 5 6 |
<Directory “C:\Users\YOURNAME\Documents\My Dropbox\sites”> Options Indexes FollowSymLinks Includes ExecCGI AllowOverride All Order allow,deny Allow from all </Directory> |
また、以下のように
httpd-vhosts.conf がインクルードされていること（Include の # が外れてコメントアウトされてないこと）を確認してください。# がついていたら消してくださいね。
|
1 2 |
# Virtual hosts Include “conf/extra/httpd-vhosts.conf” ←コメントアウトされてないことを確認 |
次に、C:\xampp\apache\conf\extra\httpd-vhosts.conf を開き、NameVirtualHost が有効になっていること（コメントアウトされてないこと）を確認してください。
|
1 2 3 4 |
# Use name-based virtual hosting. # NameVirtualHost *:80 ←コメントアウトされてないことを確認 またラストに |
またラストに
|
1 2 3 4 |
<VirtualHost *:80> DocumentRoot “C:\Users\YOURNAME\Documents\My Dropbox\sites” ServerName localhost </VirtualHost> |
を追記します。
最後に、C:\xampp\htdocs\ に置いていたファイルを、C:\Users\YOURNAME\Documents\My Dropbox\sites に移動してください（上書きが発生する場合はどちらが最新なのかに注意してくださいね）。
Mac 編
/Applications/XAMPP/xamppfiles/etc/httpd.conf に以下を追加（位置はわりとどこでもおｋ）します。
|
1 2 3 4 5 6 |
<Directory “/Users/YOURNAME/Dropbox/sites”> Options Indexes FollowSymLinks Includes ExecCGI AllowOverride All Order allow,deny Allow from all </Directory> |
また、以下のように httpd-vhosts.conf がインクルードされていること（Include の # が外れてコメントアウトされてないこと）を確認してください。# がついていたら消してくださいね。
|
1 2 |
# Virtual hosts Include /Applications/XAMPP/etc/extra/httpd-vhosts.conf ←コメントアウトされてないことを確認 |
次に、/Applications/XAMPP/etc/extra/httpd-vhosts.conf を開き、NameVirtualHost が有効になっていること（コメントアウトされてないこと）を確認してください。
|
1 2 3 |
# Use name-based virtual hosting. # NameVirtualHost *:80 ←コメントアウトされてないことを確認 |
またラストに
|
1 2 3 4 |
<VirtualHost *:80> DocumentRoot “/Users/YOURNAME/Dropbox/sites” ServerName localhost </VirtualHost> |
を追記します。
最後に、/Applications/XAMPP/htdocs/ に置いていたファイルを、/Users/YOURNAME/Dropbox/sites に移動してください（上書きが発生する場合はどちらが最新なのかに注意してくださいね）。
MySQL の実データファイルを Dropbox に割り当てる
続いてデータベースも Dropbox に割り当てていきます。 Thx: ひろまささん！
Windows 編
MySQL の実データファイルは C:\xampp\mysql\data\ にあるので、こちらも Dropbox に割り当てていきます。
MySQL のデータファイルの置き場所は C:\xampp\mysql\bin\my.ini によって定義されていますので、このファイルの C:\xampp\mysql\data\ を C:\Users\YOURNAME\Documents\My Dropbox\mysql\data へと置き換えていきます。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
# The MySQL server [mysqld] basedir = “C:/xampp/mysql/” datadir = “C:\Users\YOURNAME\Documents\My Dropbox\mysql\data” log_error = “C:\Users\YOURNAME\Documents\My Dropbox\mysql\data\mysql.err” pid_file = “mysql.pid” general_log = 0 general_log_file = “C:\Users\YOURNAME\Documents\My Dropbox\mysql\data\mysql.log” slow_query_log = 0 slow_query_log_file = “C:\Users\YOURNAME\Documents\My Dropbox\mysql\datamysql-slow.log” # Uncomment the following if you are using InnoDB tables #skip-innodb innodb_data_home_dir = “C:\Users\YOURNAME\Documents\My Dropbox\mysql\data” innodb_data_file_path = ibdata1:10M:autoextend innodb_log_group_home_dir = “C:\Users\YOURNAME\Documents\My Dropbox\mysql\data” |
log_error 関連や innodb 関連でエラーが出るようであれば適宜コメントアウトしてみてください。
最後に C:\xampp\mysql\data\ にあったファイルを C:\Users\YOURNAME\Documents\My Dropbox\mysql\data へと移動します（上書きが発生する場合は最新の方を上書きするように気をつけてくださいね）。
Mac 編
MySQL の実データファイルは /Applications/XAMPP/xamppfiles/var/mysql/ にあるので、こちらも Dropbox に割り当てていきます。
MySQL のデータファイルの置き場所は /Applications/XAMPP/etc/my.cnf によって定義されていますので、このファイルの /Applications/XAMPP/xamppfiles/var/mysql/ を /Users/YOURNAME/Dropbox/mysql/data/ へと置き換えていきます。
|
1 2 3 4 5 6 7 8 |
# The MySQL server [mysqld] datadir = /Users/YOURNAME/Dropbox/mysql/data/ ←なければ追加 # Uncomment the following if you are using InnoDB tables #skip-bdb innodb_data_home_dir = /Users/YOURNAME/Dropbox/mysql/data/ innodb_log_group_home_dir = /Users/YOURNAME/Dropbox/mysql/data/ |
エラーが出るようであれば innodb 関連を適宜コメントアウトしてみてください。
最後に /Applications/XAMPP/xamppfiles/var/mysql/ にあったファイルを /Users/YOURNAME/Dropbox/mysql/data/ へと移動します（上書きが発生する場合は最新の方を上書きするように気をつけてくださいね）。
Apache、MySQL を再起動
上記までの設定が完了したら、xampp-control で Apache、MySQL を再起動します。以後、ドキュメント、データベースともに Dropbox のローカルフォルダに書きこまれ、そこからオンラインストレージとの間で同期を取るようになります。
注意事項
-
今後ローカル環境を使用する際は、コンピュータを終了する前にかならず xampp-control で MySQL をストップし、Dropbox のファイル同期を待ってから、コンピュータを終了してください。こうしないと最後まで使用中のファイルが同期されません。
- Mac 側の /Users/YOURNAME/Dropbox/mysql/data/ 内のフォルダに一時停止マークがついて同期できない場合は、ターミナルを起動し、$ sudo chmod -777 FOLDERNAME を実行してみてください。
さぁ、みんなもローカル環境を同期しよう、そうしよう！
ピンバック: 5月05日のおすすめ記事
ピンバック: links for 2011-05-05 « 個人的な雑記
ピンバック: xamppドロップボックスへお引越し | 3FACTORY 2011-WEBクリエイティブ
ピンバック: Links for 2011-05-04 [del.icio.us] « Education News & APP
ピンバック: Dropboxで同期するXAMPPとMAMPローカル環境 | masaplabs
ピンバック: XAMPPのhtdocsとmysqlデータファイルをDropboxで同期 | ツチノコラボ
ピンバック: iPad2を使ってできる革新的なweb制作 / 情報収集の方法 | Webデザインのレシピ
ピンバック: PHP開発環境の設定 | iamflyingfish
ピンバック: 【WordPress】「SugarSync」で2台のパソコンのローカル環境を同期する | Q-miz blog（きゆみずぶろぐ）
ピンバック: 勉強用WPサイトはサーバに置くか？ それともXAMPP？ | WordPressでウェブサイトを作るまで
こんにちわ、初めて投稿します。
とてもありがたい記事で参考にしました。
ただxampp×Dropboxで、win7 & win7の環境でMysqlのデータの同期ができなくて困りました。。
テーブルの構造だけは同期できてたんですけど、、
仕方なくエクスポートして、インポートして利用してます。
もし何か知っていたら教えていただければ嬉しいです。
ちなみにxamppは（1.8.3）を利用してます。
初心者なんですが、｢\｣で書かれてるのところは｢/｣でいいんですよね？