「macのWeb開発環境って何があるの?」
「macでXAMPPって使えるの?インストール方法や初期設定は?」
どうも、タカフです。
Macのローカル環境でのWeb開発って色々ありますよね。
・Macに最初から入っているapacheやphp
・XAMPPをインストール
・MAMPをインストール
・docker
こんなところでしょうか。
世間的にはdocker全盛の気もしますが、時にはXAMPPの方が役立つケースもあります。
今回は、WindowsユーザーがMacユーザーに移行した時でもXAMPPを同じように使う方法を主な内容として記事にしていきます。
Mac版XAMPPのインストール
XAMPPのサイトからインストーラーをダウンロード
XAMPPのサイトにアクセスします。
https://www.apachefriends.org/jp/index.html
ここのサイトからインストーラーをダウンロードするのですが、インストーラーには、VM版(仮想マシン版)とMacに直インストールするインストーラー版の2種類があって、僕はインストーラー版の方をオススメします。
XAMPPを選ぶようですから、恐らくWindowsでXAMPPを使っていたとか、周りがWindowsユーザーだけど開発環境を合わせる、というようなWindowsと合わせるケースかと思います。
そういう時に、Windows版はインストーラー版なのでその環境を合わせるのに都合がいいからです。
「OS X向けXAMPP」はVM版なのでそれを押さずに「ダウンロード」の方を押しましょう。
次のページでMacのカテゴリのところで、ダウンロードしたいVersionのSizeの少ない方の「Downloads」をクリックします。
これがインストーラー版の方です。もうひとつのSizeが大きい方もダウンロードしてみればわかりますが、Sizeが大きい方がVM版となっています。
落としたファイルがxampp-osx-7.3.5-0-installer.dmg というように -installer.dmg となっていればOKです。
XAMPPのインストーラーを開く
インストーラーが開くので真ん中のXAMPP.appをダブルクリックします。
Windows版でもよく見たBitnamiのインストーラーが開かれます。
Nextを進めていくとセットアップが始まります。
インストールが完了して「Finish」を押すとMac版コントロールパネルが開きます。この時apacheも起動します。
これだけでローカルにWebサーバーが起動出来ました。
ブラウザでlocalhostからアクセス出来ます。簡単ですね。
XAMPPアプリ(コントロールパネル)のDock追加
XAMPPアプリ(コントロールパネル)はよく使うと思うのでDockに追加しておきましょう。
XAMPPアプリのパスは
/Applications/XAMPP/manager-osx.app
です。上記までの作業でXAMPPアプリが起動しているのならばDock上でそのまま追加でもいいですね。
Mac版XAMPPの初期設定
DocumentRootを任意の場所にしよう
デフォルトのDocumentRootの場所は
DocumentRoot “/Applications/XAMPP/xamppfiles/htdocs”
となっています。正直アプリケーションフォルダ上であんまりファイル編集ってしたくないので、どこか任意の場所に変更します。
/Applications/XAMPP/xamppfiles/etc/httpd.conf
をテキストエディタで開きます。そこで、上記の記述を任意のパスに変えてあげます。
またDirectoryのところもそのDocumentRootのところと合わせておきましょう。
#DocumentRoot "/Applications/XAMPP/xamppfiles/htdocs"
DocumentRoot "/Users/suzuki/Web"
#<Directory "/Applications/XAMPP/xamppfiles/htdocs">
<Directory "/Users/suzuki/Web">
このテキストファイルを保存して、XAMPPアプリでapacheを再起動すればDocumentRootが切り替わります。
任意のindex.htmlでも置いてアクセスしてみましょう。
MySQLでの初期文字コードをutf8mb4にしておく
デフォルトのMySQLでの文字コードはlatainなどになっています。
昨今の開発環境だとutf8mb4の方が幸せになれるので設定しておきましょう。
詳しい説明は下記記事です。
今回のMac版XAMPPの環境だと、
/Applications/XAMPP/xamppfiles/etc/my.cnf
のファイルを編集します。
mysqldとmysqlのセクションのところに下記のように追記します。
[mysqld]
...
character_set_server=utf8mb4
...
[mysql]
...
default-character-set=utf8mb4
これでファイル保存してXAMPPアプリからMySQLを起動すればOKです。無事文字コードがutf8mb4に切り替わるはずです。
MAMPとXAMPPの違い
MAMPはMac, Apahce, MySQL, PHPの頭文字をとって作った名前で、
XAMPPはXがクロスプラットフォーム、Apache、MySQLまたはMariaDB、PHP、Perlの頭文字をとって作った名前です。
昔はMac版XAMPPと言ったらMAMPみたいな流れがあった気がしたのですが、今はどっちでもいい感じですが、WindowsでXAMPPに慣れているならXAMPPを使った方がいいでしょう。
機能はほとんど一緒なので。
まとめ
Mac版のXAMPPの基本的なセットアップは以上です。
これでローカル環境でWordPressやPHPアプリケーションの開発が出来るはずです。
現場からは以上です。