作成日:2021/04/12 更新日:2022/08/10

#1 ローカルにWeb開発環境を作る(LAMP)

自分のパソコン(ローカル環境)にWebサーバと同じ環境(LAMP環境)を作る

自分でPC内に、Webサーバーと同じ環境を作るのはちょっと難しくなります。
  • ・webサーバ(Apacheアパッチnginxエンジンエックス)
  • ・データベース(MySQLマイ エスキューエルPostgreSQLポスグレMariaDBマリアディービー)
  • ・データベース管理ツール(phpMyAdminピーエイチピー マイ アドミン)
Linux(OS), Apache(サーバー), MySQL(データベース), Php(スクリプト言語)これらの頭文字をとってLAMP環境と呼ばれています。 他、PHPのダウンロード、設定、バージョン管理ができれば必要ないのですが、 最初は統合ツールを使ったほうが良いと思います。
統合ツールもいろいろあります。OSがMacの方はMAMPマンプ、 Windowsの方はXAMPPザンプがお薦めです。ダウンロードしましょう。
※両ソフトとも両OSに対応しています。解説はMac+MAMPで進めます。
MAMP

MAMPダウンロードサイトへ
XAMPP

XAMPPダウンロードサイトへ

まずは無料版で良いと思います。ダウンロードしたらインストールしてみましょう。

MAMPの初期設定

インストールが終わったら初期設定を変更します。

PHPのバージョンを選択。7.xを選択します。WebサーバはひとまずApacheで良いです。

Generalはこんな感じで。それ以外は初期設定のままで結構です。

バーチャルホストの設定

ローカルにLAMP環境が構築されましたが、設定を変えない場合MAMPで扱えるPHPプロジェクト数はひとつのみです。 そこでバーチャルホストを設定し、複数のプロジェクトがブラウザで表示できるようにしておきます。

バーチャルホストを使わない場合は、application/MAMP/htdocs/ 内にデータを入れます。
ブラウザのアドレスに、localhost:8888と入力すれば表示されます

複数プロジェクトを扱えるようにhttpd.confの設定を変更します。

バーチャルホストが使えるようにコメントを外します。
Macのパス
/application/MAMP/conf/apache/httpd.conf

Windowsのパス
\MAMP\conf\apache\httpd.conf

※httpd.confは必ずバックアップを取ってからおこなってください。

httpd.confを選択して⌘+Dで複製されます。複製したファイルの名前を変えておきます。

227行目辺り
<Directory />
    Options Indexes FollowSymLinks
    AllowOverride All
</Directory>

615行目辺り
# MACの場合
# Virtual hosts
Include /Applications/MAMP/conf/apache/extra/httpd-vhosts.conf

Windowsの場合
# Virtual hosts
Include /conf/extra/httpd-vhosts.conf

575行目辺りにある、Include 〜のコメントアウト記号の#を外し、有効化します
また、206行目辺りにあるNoneをAllに変更済ます。
ファイルを保存し、MAMPを再起動すればブラウザで表示されるようになります。

複数プロジェクトを管理するためのデータ置き場(フォルダ)を作る

PCの適当な場所にstgという名前のフォルダを作り、その中にプロジェクトフォルダを量産していきます。
Windowsの方の場合は/MAMP/htdocs内にでも作ってください。

各プロジェクトフォルダは、例えば8001-プロジェクトA8002-プロジェクトB8003-プロジェクトCといったように、自分の管理しやすい名前を自由につけて結構です。
※8001はポート番号です。ブラウザのアドレスにポート番号を入れるので、わかりやすく入れてます。
※Macの方はこのstgフォルダのエイリアスをサイドバー(⌘+option+s)のよく使う項目などにリンクさせます。
※stgはstaging(ステージング)の略で、本番環境に似せて作ったテスト環境という意味です。

httpd-vhosts.confの設定

Macのパス
/application/MAMP/conf/apache/extra/httpd-vhosts.conf

Windowsのパス
\MAMP\bin\apache\conf\extra\httpd-vhosts.conf


httpd-vhosts.confをテキストエディタで開きます。

Listen 8001
<virtualhost *:8001>
  DocumentRoot "/Users/ユーザ名/job/stg/8001-つけた名前/"
</virtualhost>

Listen 8002
<virtualhost *:8002>
  DocumentRoot "/Users/ユーザ名/job/stg/8002-つけた名前/"
</virtualhost>
・
・
・増やしていく
Mac

Listen 8001
<virtualhost *:8001>
  DocumentRoot "C:\Users\ユーザー名\stg\8001-つけた名前"
</virtualhost>

Listen 8002
<virtualhost *:8002>
  DocumentRoot "C:\Users\ユーザー名\stg\8002-つけた名前"
</virtualhost>
・
・
・増やしていく
Windows

例はポート8001にフォルダ「8001-cri-sortable」を設定しました。
httpd-vhosts.confの最後の行に、自分がつけた「ポート番号-フォルダ名」のルールで、 8002番、8003番…と増やせば多くのプロジェクトを作れます。ブラウザではポート番号を切り替えればステージング環境を表示させることができます。

毎度アクセするのは大変なので上記のようにhttpd-vhosts.confファイルのエイリアスを作り、 stgフォルダに入れておきます。動画のように移動と同時にエイリアスのコピーにならない場合は、⌘+Lでエイリアスを作って移動させましょう。

表示のテストをしてみる

テキストエディタで新規書類を作成し、以下の3行をコピーペーストしましょう。

<?php
  phpinfo();
?>
8001ポートを設定したフォルダに(例では8001-test)「phpinfo.php」というファイル名で保存します。

MAMPを再起動して、ブラウザのアドレス欄に以下のように入力してアクセスします。 http://localhost:8001/phpinfo.php
このように表示されたらOKです。
出ない場合は、MAMPを再起動するか、httpd-vhosts.confの内容をもう一度よく確認しましょう。
サンプルのユーザ名やフォルダ名を自分で決めた独自のものに変えましょう。

WindowsのMAMPで「MySQL Server」のランプがつかない場合

\MAMP\conf\mysql\my.ini に+の行(+は含まない)を追記
#26行目辺り

[mysqld]
+ explicit_defaults_for_timestamp = TRUE
+ character-set-server = utf8

# Replication Master Server (default)
# binary logging is required for replication
log-bin=mysql-bin
+ log_syslog = 0
+ log_timestamps = SYSTEM

[mysql]
no-auto-rehash
+ default-character-set = utf8
\MAMP\bin\phpMyAdmin\config.inc.php に以下を追記

+ $cfg['Service'][$i]['socket'] = '/tmp/mysql.sock';
\MAMP\db\mysql\ib_logfile0〜1を削除してみる