MAMPを使ってMacにEC-CUBEのテスト環境を構築する方法

こんにちは。ネットショップコンサルタントの「たぶ」(@yusuke_tanaka34)です。

今日は「MAMPを使ってMacにEC-CUBEのテスト環境を構築する方法」をご紹介します！

「EC-CUBE」でこれからネットショップを作る時や「EC-CUBE」でネットショップを運営している時に、こんなことを思いませんか？

ファイルをいじって、直接ネット上にアップするのは恐いなぁ。パソコン上でテストしてからアップしたいなぁ。

分かります。直接、ファイルをいじってそのままアップロードするのって恐いですよね。

そんな時に便利なのが「MAMP」。

パソコン上にデータベースなどのテスト環境を構築することができる、とっても便利なアプリケーションです。

僕も「EC-CUBE」や「WordPress」でWebサイトを構築する時は、必ず「MAMP」を使いテスト環境で試してから、本番環境にアップロードします。

この記事に書いている順番に読み進めてもらえれば、パソコン上に「MAMP」を使ってテスト環境を構築することができます。

テスト環境を構築することで、一度パソコン上で試してからファイルをアップロードできるので安心です。

それでは、実際に「MAMP」をインストールする手順から「EC-CUBE」のインストールまで、詳しくお伝えをしていきますね。

「MAMP」とは

「MAMP(マンプ)」とは、Webアプリケーションを動かすために必要な「Apache」「MySQL」「PHP」という3つのソフトウェアをパッケージにしたものです。

【MAMP公式サイト】

「Windows」では「XAMPP(ザンプ)」というアプリケーションが有名です。(できることはほぼ一緒。)

【XAMPP公式サイト】

ただ、「MAMP」は「データベース管理ツール」が「MySQL」なのに対し、「XAMPP」は「MariaDB」を使用している点が違います。

「MariaDB」は「MySQL」が派生して開発された「データベース管理ツール」なのですが、「MySQL」の方が一般的に使われているので、今回は「MySQL」を使用してる「MAMP」でテスト環境を構築していきます。

「MAMP」は「Macintosh」「Apache」「MySQL」「PHP」の頭文字を取ったもので、最初はMac専用の「データベース管理ツール」として開発されていました。

しかし、現在(2018年11月)では、「Windows」でも「MAMP」を使用できるようになっています。

「MAMP」は「Apache」「MySQL」「PHP」をパッケージとして一気にインストールすることができるので、ダウンロードしてドラッグ＆ドロップするだけで簡単にパソコン上に本番と同じ環境を作ることができるのです。

「EC-CUBE」や「WordPress」のようなPHPプログラムの開発には必須のアプリケーションですね。

「MAMP」をダウンロードすると分かるのですが、無料の「MAMP」と有料の「MAMP PRO」があります。

「MAMP PRO」はプロのWeb開発者やプログラマーのために設計されたアップグレードバージョン。

メールサーバーの機能が使えたり、PHPやApacheのバージョンの切り替えができたりと、かなり多機能になっています。

あと、最近では「MAMP Cloud」というサービスもあり、クラウド上に開発環境を置くことができるようになっています。

ただ、『「EC-CUBE」や「WordPress」のテスト環境を作りたい。』という意味では、無料の「MAMP」で十分です。

それでは、次に「MAMP」のインストール方法をご紹介していきますね。

「MAMP」のダウンロードとインストール

まず、「MAMP公式サイト」から、インストールに必要なプログラムファイルをダウンロードします。

【MAMP公式サイト】

1.左真ん中あたりにある「MAMP」の「Free Download」ボタンをクリック。

2.windowsの場合は右の「MAMP & MAMP PRO 4.0.1」ボタンを、Macの場合は左の「MAMP & MAMP PRO 5.2」ボタンをクリック。

windowsは「MAMP & MAMP PRO 4.0.1」ボタンを、Macは「MAMP & MAMP PRO 5.2」ボタンをクリック

WindowsとMacのロゴがついているので、分かりやすいですね！

2018年11月15日時点でのバージョンは、Windowsは「MAMP & MAMP PRO 4.0.1」、Macは「MAMP & MAMP PRO 5.2」でした。

3.ダウンロードが開始され、下記のような画面が表示されます。

4.ダウンロードフォルダに入った「MAMP_MAMP_PRO_○.○.pkg」というファイルをダブルクリックします。

5.MAMPのインストーラが開くので、「続ける」をクリックします。

6.「大切な情報」が表示されるので、「続ける」をクリックします。

7.「使用許諾契約」が表示されるので、「続ける」をクリックします。

ちなみに、この「使用許諾契約」は言語を「英語」と「ドイツ語」しか選択できないので、全部読むのは至難の業です。(笑)

8.「このソフトウェアのインストールを続けるには、ソフトウェアの使用許諾契約の条件に同意する必要があります。」と表示されるので、「同意する」をクリックします。

9.インストールの確認画面が表示されるので、「インストール」をクリックします。

10.「インストーラが新しいソフトウェアをインストールしようとしています。」と表示されるので、「ユーザー名」と「パスワード」を入力して「ソフトウェアをインストール」をクリックします。

11.インストールが開始されます。

12.数分でインストールが完了します。

13.「”MAMP & MAMP PRO ○.○”のインストーラをゴミ箱に入れますか？」と表示されるので、「ゴミ箱に入れる」を選択しちゃって大丈夫です。

以上で、「MAMP」のダウンロード&インストールは完了です。お疲れ様でした！

次に「MAMP」の設定を行います。

「MAMP」の設定

次に「MAMP」の設定を行っていきます。

1.「アプリケーションフォルダ」の中に「MAMP」フォルダが入っているので、クリックします。

2.「MAMP」フォルダの中の「MAMP」のアイコンをクリックします。

3.「MAMP」が立ち上がります。

4.メニューの「MAMP」を押し「Preferences…」をクリックします。

5.「Ports」の「Set Web & MySQL ports to 80 & 3306」ボタンをクリックします。

6.各ポートの数字が「80」と「3306」に変わるので「OK」をクリックします。

7.「MAMP needs to launch its helper tool to be able to start and stop servers, change users and use cloud functions.」と表示されるので、「ユーザー名」と「パスワード」を入力して「OK」をクリックします。

以上で、「MAMP」の設定は終了です。お疲れ様でした！

次に、データベースに「EC-CUBE」用のテーブルを作成します。

データベースに「EC-CUBE」用のテーブルを作成

次に「MAMP」に入っている「phpMyadmin」を使用し、データベースに「EC-CUBE」用のテーブルを作成していきます。

1.「MAMP」を立ち上げ「Start Servers」をクリックします。

2.真ん中の「Open WebStart Page」をクリックします。

3.ブラウザが立ち上がるので、下の方にスクロールします。

4.「phpMyadmin」というリンクがあるので、クリックします。

5.データベースが表示されるので「Databases」をクリックします。

6.赤枠の部分にお好きなデータベース名を入れ、「Create」ボタンをクリックします。

この時、真ん中の部分は「utf8_general_ci」になっていることを確認してください。

8.左側のデータベース一覧に新しいデータベースが作成されています。

以上で、「EC-CUBE」用のデータベースの作成が完了です。お疲れ様でした！

次の項目で使うので、作ったデータベースのテーブル名は覚えておいてくださいね。

「EC-CUBE」のダウンロードとインストール

次に「EC-CUBE」をダウンロード&インストールしていきます。

「EC-CUBE」のダウンロードに関しては、下記の記事でも説明していますが、念のため再度ダウンロード方法を解説しますね。

EC-CUBE2のインストール方法と具体的な手順

2018年7月30日

EC-CUBE3のインストール方法と具体的な手順

2018年7月3日

「EC-CUBE」のダウンロード

最初に「EC-CUBE」のダウンロードから解説します。

まず、EC-CUBE公式サイトから、「EC-CUBE」のデータをダウンロードします。

【EC-CUBE公式サイト】

1.メニューにある「無料ダウンロード」ボタンをクリックします。

2.「無料ダウンロード」ページに入り、下にスクロールしていきます。

3.「最新版ダウンロード」ボタンをクリックします。

今回は「EC-CUBE3.0.16」で設定を行います。

4.「EC-CUBEメンバー」の方はログインしてください。

5.「EC-CUBEメンバー」ではない方は「新規メンバー登録(無料)」ボタンをクリックします。

6.「EC-CUBEメンバー新規登録画面」で必要事項を入力してください。

「EC-CUBEメンバー新規登録画面」で入力する項目は以下の通りです。

【EC-CUBEメンバー新規登録画面で入力する項目】

会社名
お名前※必須
都道府県※必須
メールアドレス※必須
職種※必須
業種※必須
希望するパスワード※必須
メールマガジンが不要な場合はチェック

7.次に利用規約を読んで「上記の利用規約に同意する」にチェックを入れ「確認ページへ」をクリックします。

8.登録内容を確認して「完了ページへ」をクリックします。

9.「仮登録が完了いたしました。」と表示されます。

10.「EC-CUBEメンバー登録のご確認メール」が送られてくるので、本登録URLをクリックします。

11.「登録が完了いたしました。」と表示されます。

12.「EC-CUBEメンバー登録のご完了メール」を確認します。

13.再度、画面上部の「無料ダウンロード」をクリックします。

14.再度「最新版ダウンロード」ボタンをクリックすると、ダウンロードが開始されます。

15.ダウンロードした「EC-CUBE」のファイルをダブルクリックします。

16.解凍された「EC-CUBE」のフォルダをダブルクリックします。

17.フォルダを開くと以下のようなファイルが入っています。

18.もう一度「MAMP」を開き、中にある「htdocs」フォルダを開きます。

19.先ほど開いた「EC-CUBE」フォルダから「htdocs」フォルダにファイルを移動します。

「EC-CUBE3」の場合、移動するファイルは、

app
html
src
vendor
autoload.php
cli-config.php

の6つ。

20.「EC-CUBE」のファイルを移動するとこんな感じになります。

21.再度「MAMP」を立ち上げ、「Start Server」をクリックします。

22.「Google Chrome」などのWebブラウザに「localhost/html/」と打ち込みます。

23.すると、URLが「localhost/install/step1」に変わり、EC-CUBEのインストール画面が開きます。

【EC-CUBEのインストール画面】

以上で、「EC-CUBE」のダウンロードが完了です。お疲れ様でした！

「EC-CUBE」のインストール

次に「EC-CUBE」のインストールを行っていきます。

1.「EC-CUBE」のインストール画面で「次へ進む」ボタンをクリックします。

2.「権限チェック」画面で問題がなければ「次へ進む」ボタンをクリックします。

3.次に「サイトの設定」画面で必要事項を入力します。

入力する項目は以下の通り。

あなたの店名※必須	お好きなお店の名前を入力。
メールアドレス※必須	お店の運営で使用するメールアドレスを入力。
管理画面ログインID※必須	お好きな半角英数4文字以上50文字以内を入力。
管理画面パスワード※必須	お好きな半角英数8文字以上32文字以内を入力。
管理画面のディレクトリ名※必須	管理画面へのURLを入力します。(下記のURLの□部分) http://○○.com/□□□□/ お好きな半角英数4文字以上50文字以内を入力。
サイトへのアクセスを、SSL(https)経由に制限します。	SSLサーバー証明書をインストール済で、URLがSSL(https://で始まるアドレス)経由の場合、チェックを入れます。チェックをしなくても先に進めます。
管理画面へのアクセスを、以下のIPに制限します。	管理画面へのアクセスを許可したIPアドレスのみにしたい場合、IPアドレスを入力します。入力しなくても先へ進めます。

※オプションは入力しなくて大丈夫です。

4.こんな感じで必要項目を入力したら、「次へ進む」ボタンをクリックしてください。

5.次に「データベースの設定」画面で必要項目を入力し、「次へ進む」ボタンをクリックします。

入力する項目は以下の通り。

データベースの種類※必須	「MySQL」を選択してください。
データベースのホスト名	localhost
ポート番号	3306
データベース名※必須	先ほど作成したデータベースの「データベース名」を入力。
ユーザ名※必須	root
パスワード※必須	root