【第二回】PHPでシステム開発を実践!開発環境構築(後編)

前回のおさらい

前回の記事「【第一回】PHPでシステム開発を実践!開発環境構築(前編)」では、PHPについて簡単にお伝えした後、開発環境構築としてMAMPというソフトのダウンロードとインストール、そしてVisual Stadio Codeというエディタのダウンロードとインストールを行いました。

今回の記事では、今後開発で使用するブラウザの選定やMAMPの設定を行っていきます。

開発環境構築の際、前回の記事でもそうでしたが当方Windowsユーザーとなります。
そのためWindowsでの操作がメインとなるためMacユーザーの方にとって一部違う操作があるかもしれません。

基本的に操作に大きな違いは無いですが、Macでの開発環境構築方法についても可能な限り取り上げるよう努力いたします。

ブラウザの選定

Windowsの場合

Windowsの場合ですとパソコンに既にMicrosoftのEdgeというブラウザが標準で入っています。

こちらお好みにもよりますが、このような開発作業をする際にEdgeはあまり使いやすくはありませんので、開発に適したGoogle Chromeというブラウザを使っていこうと思います。

まずはGoogle Chromeの公式サイトを開きましょう。
Google Chrome

トップページ内に「Chromeをダウンロード」というボタンがありますので、そちらをクリックします。
Google Chromeダウンロード

するとダウンロードが始まりますので、終わるまで待ちます。

終わりましたらダウンロードしたファイルをダブルクリックしてインストールします。
インストールが終わり、Google Chromeが開きましたらブラウザの準備は終わりです。

Macの場合

Macの場合ですと標準ブラウザは、Safariで設定されています。

ただこちらもWindowsの時と同様、開発作業ではあまり使いやすくありませんので、開発に適したGoogle Chromeというブラウザを使っていこうと思います。

まずはGoogle Chromeの公式サイトを開きましょう。
Google Chrome

トップページ内に「Chromeをダウンロード」というボタンがありますので、そちらをクリックします。

クリックしますとMacの場合、「お使いのMacに適したChromeのバージョンを選択します」という画面が表示されるかと思います。
「Intelプロセッサ搭載のMac」と「Appleプロセッサ搭載のMac」の2つの選択ボタンがあります。

ここで使用しているMacがどのようなものかを確認するために左上にありますリンゴのマークをクリックしますと「このMacについて」という選択肢が表示されますのでクリックします。
表示された画面内にあります「概要」をクリックしますと詳細が表示されますので、「プロセッサ」を確認します。

「プロセッサ」の中にIntel CoreなどIntelという文言が入っていましたらIntel版、Apple M1などAppleという文言が入っていましたらApple版ということになります。

使用されているパソコンのプロセッサに合わせて、先ほどの「Intelプロセッサ搭載のMac」か「Appleプロセッサ搭載のMac」かを選択してください。

選択しましたらダウンロードが開始します。
Macの場合ですとアプリケーションメニューへ登録するための画面が表示されますので、Google Chromeのアイコンを下に表示されていますフォルダのアイコンにドラッグ&ドロップをし、アプリケーションメニューに追加しましょう。
最後にGoogle Chromeのアイコンをダブルクリックし問題なく開きましたらブラウザの準備は終わりです。

ここまででMAMP、Visual Studio Code、Google Chromeのダウンロードとインストールが完了しました。
次はMAMPの設定を行っていきましょう。

MAMPの設定

まずはMAMPを起動します。

Windowsの場合

Windowsの場合ですと以下の画像のような画面が表示されるかと思います。
左上に「MAMP」という選択肢がありますのでクリックします。

すると下にメニューが展開されますので、メニューの中の「Preferences」をクリックします。
MAMP起動
設定画面が開きましたら「Ports」をクリックします。
既に入力されている数値(80、80、3306)があるかと思いますが、この状態ですと他のソフトと競合してしまうので変更します。

下にあります「MAMP default」と書かれたボタン、あるいは「Set MAMP ports to default」と書かれたボタンをクリックしますと入力されている数値が8888、7888、8889に変わるかと思います。
変更されましたら、最後に「OK」ボタンをクリックしましょう。
MAMP設定

以上で「Ports」の設定は終わりです。

次は「PHP」をクリックして画面を切り替えましょう。
既にバージョンが指定されていますが、こちらはスタンダードバージョンというもので、このままで問題ないかと思いますのでそのままにします。
MAMP設定PHPのバージョン
その他の「Server」と「Cloud」もそのままで問題ありません。
最後に念のため「OK」ボタンをクリックし、変更した設定を保存します。

すると変更した設定を適応させるために自動的にMAMPが読み込みを行う場合がありますが、こちらでも変更した設定を適応させるために右側にあります「Stop Servers」をクリックし、サーバーを一旦停止させます。
そして再度「Start Servers」をクリックし、サーバーを再起動しましょう。
MAMPサーバー停止
MAMPサーバー再起動
3つの中でCloud以外に緑色のライトがついていましたら問題ありません。
もしこの作業の中でエラーが出てしまったりした場合は、他のソフトが別で動いており競合している可能性があります。
そちらのソフトを終了してから再度試してみて下さい。
それでもうまくいかなければWindows自体を再起動し、MAMPを起動すると正しく動くかと思います。
その際に念のため、先ほど変更しましたPortsの設定を確認しておきましょう。

Macの場合

Macでも基本的にWindowsと同様の設定を行っていきます。

Macの場合ですと左上に歯車マークがありますので、そちらをクリックします。
設定画面が開きましたらそれぞれタブごとに分かれていますので、1つ1つ確認していきましょう。

まずは「General」タブですが、こちらは変更の必要はありません。
次に「Ports」タブですが、標準ですと上から80、80、3306という数値が入っているかと思います。
もしその場合は他のソフトと競合してしまい正常に動かないことがありますので、下にあります「Set Web & MySQL ports to:」という所の「MAMP default」というボタンをクリックし、数値を8888、8888、8889にして下さい。

他の「Server」タブと「Cloud」タブは特に変更は必要ないかと思います。
最後に「OK」ボタンをクリックしましょう。

設定画面が閉じられましたら、トップにあります「PHP version」を確認していきます。

PHPのバージョンはダウンロードした時期により選択できるバージョンが変わりますが、基本的に標準で設定されているバージョンで問題はないかと思います。
「PHP version」はそのままにし、右上にあります「Start」というボタンをクリックします。
しばらくしますと「Stop」という表記に変わるので、その場合は適切にMAMPが起動したことになります。

もしこの作業の中でエラーが出てしまったりした場合は、他のソフトが別で動いており競合している可能性があります。
そちらのソフトを終了してから再度試してみて下さい。

それでもうまくいかなければMac自体を再起動し、MAMPを起動すると正しく動くかと思います。
その際に念のため、先ほど変更しましたPortsの設定を確認しておきましょう。

以上でMAMPの設定は終わりです。

まとめ

前回の記事と2回に分けてPHPの開発環境の構築について取り上げました。

ここまでいかがでしたでしょうか?
現在は、便利なツールがたくさん出ており、開発環境を整えるのに手間をかけず簡単に構築することが出来るようになりました。

開発現場により使用するツールはさまざまですので、色々なツールの情報を得て試しに使ってみて下さい。

この記事をシェアしましょう!