はぴすぷ

【MAMP】3分でMacのWeb開発環境(Apache,MySQL,PHP)を用意・初期設定する方法!

      2015/11/09

スクリーンショット 2015-11-09 5.56.22

実家に帰るなどで外泊する時にも、ちょっとした開発やメンテナンスが出来るように、Mac Book Airの開発環境を準備したいなーと思っていました。

VagrantとVirtual Boxで用意しようと思ってたんですが、サクッと片付けるには敷居が高い!

そしてちょうど今、実家に帰ってきていて、急ぎで更新したいファイルがある…。

というわけで、サクッとMAMPを入れて片付けちゃいました(^q^)

せっかくなので、インストール手順や初期設定の方法を紹介したいと思います!

あ、ちなみにタイトルの3分というのは、ダウンロードにかかる時間は含めてません!

スポンサーリンク

MAMPとは?

Macで簡単にWeb開発環境を整えてくれるフリーソフトです。

下記の4つの単語の頭文字を取って名付けられています。

  • Macintosh:Mac
  • Apache:Webサーバ
  • MySQL:データベースサーバ
  • PHP:Web系プログラミング言語

他にもWeb開発を行う上であると便利な機能などが豊富に含まれています。

ブラウザからデータベースにアクセスして編集できる「phpMyAdmin」や、PHP以外のWeb系のプログラミング言語「Perl」「Python」なども使用できます。

どういうわけか、Windows版もあります(゚A゚;)

Windowsでは、ほぼ同じ内容のソフトウェアの「XAMPP」をおすすめします。

XAMPPにもMac版がありますが、MacではMAMPの方が利用者が多く、評価も高そうです。

MAMP PROとの違い

MAMP単体では無料なのですが、「MAMP PRO」になると有料(¥7,520)になります。(2015/11/8時点)

MAMP PRO」では、MAMPの機能に加え、便利な機能がいくつか追加されています。具体的には以下の様なことが出来ます。

  • ホスト毎にPHPのバージョンを変更
  • 複数の仮想サーバーの設定が出来る
  • WordPress、Drupal等をワンクリックインストール出来る
  • ダイナミックDNSに対応
  • メールサーバーの機能を使える
  • ApacheのモジュールをGUIで切り替え出来る

14日間は無料で試すことが出来ますが、特におすすめではないので、この記事では深く説明しません。

MAMPのインストール

まずは「MAMPの公式サイト」にアクセスして、MAMPの「DOWNLOAD」をクリック。

MAMP

Mac OS Xの「Download」をクリック。

スクリーンショット 2015-11-09 0.11.29

ダウンロードしたファイルをダブルクリックするなりして実行。

スクリーンショット 2015-11-09 5.01.10

続ける」をクリック。

スクリーンショット 2015-11-09 0.13.45

続ける」をクリック。

スクリーンショット 2015-11-09 0.13.50

続ける」をクリック。

スクリーンショット 2015-11-09 0.14.03

同意する」をクリック。

スクリーンショット 2015-11-09 0.14.09

カスタマイズ」をクリック。

スクリーンショット 2015-11-09 0.14.23

MAMP PROのチェックを外してインストール」をクリック。

スクリーンショット 2015-11-09 0.15.00

パスワードを入力して「ソフトウェアをインストール」をクリック。

スクリーンショット 2015-11-09 0.15.12

インストールが完了するまで、少し待ちます。

スクリーンショット 2015-11-09 0.15.30

インストール完了。「閉じる」をクリック。

スクリーンショット 2015-11-09 0.15.41

MAMPの基本的な使い方

インストールが完了すると、LaunchpadMAMPが追加されているので、クリックしてMAMPを起動します。

スクリーンショット 2015-11-09 0.18.21

サーバーの起動と停止

サーバを起動」をクリックすると、ApacheサーバーとMySQLサーバーが起動します。

スクリーンショット 2015-11-09 0.18.42

初回は「アプリケーション”mysqld”へのネットワーク受信接続を許可しますか?」と出てくるので「許可」をクリックします。許可しないとMySQLが使えません。

スクリーンショット 2015-11-09 1.02.32

サーバを停止」をクリックすると、ApacheサーバーとMySQLサーバーが停止します。

スクリーンショット 2015-11-09 5.19.21

サーバが起動している間は、ApacheサーバーとMySQLサーバーの横のボックスに、緑色のチェックが入り、日本語が不自由過ぎる「オープンWebStartの」というボタンが有効になります…!

MAMPのスタートページを開く

先ほどのオープンWebStartの」というボタンをクリックすると、MAMPのスタートページがブラウザで開かれます。

スクリーンショット 2015-11-09 1.03.13

ここでは、私のウェブサイト(開発中のウェブサイト)にすぐにアクセス出来たり、PHP設定の確認や、「phpMyAdmin」「phpLiteAdmin」などのツールへのリンクが用意されています。

特にFAQ(よくある質問)を見れば、日本語で説明されているので、困ることは無さそうです。

まともに日本語訳されているので、何故一番肝心なアプリのトップ画面でオープンWebStartの」というボタン名になってるのかが理解できませんねw

初期設定のままだと気になるのが、URLにある謎の数字です。

http://localhost:8888/MAMP/?language=Japanese

これはWebサーバの使用ポートの数値で、標準で使用される80番以外の時だけ表示されます。

気にならない人なら、そのままで良いんですが、私は気になるので80番に変更します。

MAMPの初期設定を変更する

アプリのトップから「設定…」ボタンをクリック。

スクリーンショット 2015-11-09 6.02.49

設定のダイアログが現れるので、ポートタブに切り替えます。ついでなのでMAMP PROを確認」のチェックを外しておきましょう。

スクリーンショット 2015-11-09 2.31.07

WebとMySQLのポートを80と3306に設定」を選択して、「OK」をクリック。

スクリーンショット 2015-11-09 2.31.37

他に80と3306を使用していることは無いと思いますが、もしバッティングして問題が起こるようであれば「MAMPポートをデフォルトに設定」で元に戻せます。

もしかしたら、Skypeが80番使ってる可能性がありますが、その場合はSkype側の設定から使用ポートを変更することをおすすめします。

開発を始めるにはどうしたら良い?

この辺りは、スタートページにあるFAQにも書いてあります。

/Applications/MAMP/htdocs」の中に、htmlやphpファイルを置くことで、スタートページのヘッダーにあった「私のウェブサイト」から表示することが出来ます。

スクリーンショット 2015-11-09 1.35.06

ちなみに「私のウェブサイト」は「http://localhost」のことなので、毎回スタートページから移動する必要はありません。

 

終わりに

やっぱりXAMPPやMAMPを使うとめっちゃ楽ですねw

とりあえず、先月から月次報告でMacの開発環境整えることを、課題にあげてたので少しは達成できて良かった!

初心者向けのソフトにいつまでも頼っているのはマズイとは分かっているんですが、このお手軽さ、たまらん(^q^)

ちょっとMAMPの中を見てみると、「Sequel Pro」が含まれていて驚きました。(最後のFinderのキャプチャ画像にある通り)

Sequel Pro」はMySQLクライアントアプリで、キャプチャ見て分かる通り、私は既にインストールしてましたw

かなり便利なアプリなので、次回はSequel Pro」の使い方を紹介しようかなと思ってます。

それでは!

 - Webサイト構築, フリーソフト