開発環境をwindowsのWSL2で用意します。
はじめに
今回、PHPの開発環境として、WindowsのWSL2にてLinuxOSのUbuntuをインストールし、Ubuntu上にPHP、Apache、PostgreSQLを用意します。
従来、WindowsでPHPを用いてWebシステムを開発するときは、Windows上にApache、PostgreSQLなどをインストールして開発していました。しかし、本番運用は、WindowsではなくLinuxサーバーです。開発環境では動作していたものが本番環境では動作しないということがよく起こっていました。
それならば、最初からLinux上で開発をすればということになりますが、Linuxマシン1台だけでは不便なこともありWindowsとの併用で2つのマシンが必要となっていました。
しかし、最新のWindowsで導入されたWSL2とVSCODEのリモート開発拡張機能によって、Windowsマシン1台でLinuxでの開発環境を用意することができるようになりました。
WSL2のインストール
公式サイトにインストール手順が記載されています。 https://docs.microsoft.com/ja-jp/windows/wsl/install-win10
上記ページの「手動インストールの手順」に沿ってインストールを行ってください。
前提条件として、Windows 10 バージョン 2004 以降 (ビルド 19041 以降) または Windows 11 がインストールされている必要があります。
次に管理者として PowerShell を開きコマンド プロンプトに次のコマンドを入力します。
wsl --install
「管理者として PowerShell を開く」方法は下記になります。
- ［Windows］＋［R］キーで、［ファイル名を指定して実行］ダイアログを開きます。
- powershell と入力
- ［Shift］＋［Ctrl］キーを押しながら［Enter］キーを押します。（管理者としてPowerShellが起動）
もしくは、Winアイコンを右クリックしてメニューから「Windows Power Shell (管理者）を選んでください
初回のユーザー作成
手順6完了後に、スタートメニューから Ubuntu を選んで起動します。 コマンドプロンプトの画面が開き、ユーザー作成となります。
Installing, this may take a few minutes...
Please create a default UNIX user account. The username does not need to match your Windows username.
For more information visit: https://aka.ms/wslusers
Enter new UNIX username:
ID:developer
New password:
Retype new password:
Password:developer
vscode
Visual Studio Code(以下"VSCode"とする)とは、Windowsの開発元であるMicrosoftが開発したオープンソースの開発環境です。このVSCodeが優れているのは、追加機能にて、リモートOSにログインして開発ができることです。
インストール
下記からダウンロードしてインストールしてください。
https://code.visualstudio.com/
リモート開発拡張機能（Remote Development extensions）の追加
VSCodeに、「Remote development in WSL」という追加の拡張機能をインストールします。 VSCodeを起動している場合は、一旦、終了してください。
下記にアクセスして、Installをクリックしてください。 https://marketplace.visualstudio.com/items?itemName=ms-vscode-remote.remote-wsl
Visual Studio Codeを開きますか？ と確認ダイアログが表示されます。 Visual Studio Codeを開くをクリックしてください。
VSCODEが起動して、画面右下にInstall and Reload のボタンが表示されるのでクリックします。
ubuntu
ubuntuにログインして、必要なアプリなどをインストールしていきます。
WSL2上のubuntuにログイン
VSCODE メニューバーのTerminalのNew Terminal を選んでください。 画面下部に下記が表示されます。
To run a command as administrator (user "root"), use "sudo <command>".
See "man sudo_root" for details.
developer@Ryzen:~$
developer@Ryzen:~$ の @の前にあるdeveloperがユーザー名、@の後ろのRyzenがマシン名になります。マシン名は各自異なります。変更したい場合は、Windowsの設定にて、「PC名を表示する」を検索してください。すると「このPCの名前」を変更というボタンが現れますので、そこで変更できます。
もしくは、PowerShell を開いて、下記のコマンドを入力することでubuntuにログインできます。
WSL
ログイン直後のカレントディレクトリは、 /mnt/c/Users/XXXXXX$ です。（XXXXXはユーザー名）
Ubuntuのホームディレクトリに移動します。
developer@<Ryzen>:/mnt/c/Users/XXXXXX$ CD ~
パッケージのアップグレード
Linuxでは、アプリはパッケージ管理システムで管理されています。 パッケージリストを最新にして、アップデートされたアプリを更新します。
developer@<Ryzen>:~$ sudo apt -y update && sudo apt -y upgrade
[sudo] password for developer:
アプリのインストールなどはルートの権限が必要なためsudoにてコマンドを実行します。 コマンド実行時にパスワードの入力を求められますので、パスーワードを入力してくだdさい。
追加アプリ
通常のアプリで追加が必要となってくるようなものをインストールします。
developer@<Ryzen>:~$ sudo apt -y install supervisor \
libcap2-bin \
curl \
sqlite3 \
git \
libzip-dev zip unzip \
postgresql-client \
libpq-dev \
libicu-dev \
locales \
libmcrypt-dev \
libfreetype6-dev \
libjpeg-turbo8-dev \
libpng-dev \
libwebp-dev
apache をインストール
apache2をインストールします。
developer@<Ryzen>:~$ sudo apt -y install apache2
グループ追加
ログインユーザーのdeveloperをwww-dataに所属させます。
www-dataグループは、apacheの実行ユーザーのグループです。
-aG オプションで現在の副グループにグループを追加できます。
developer@<Ryzen>:~$ sudo usermod -aG www-data developer
グループの追加を反映させるためには、VSCODEを再起動します。
developerが所属するグループの一覧にwww-dataが含まれているかを確認します。
developer@Ryzen:~$ id
uid=1000(developer) gid=1000(developer) groups=1000(developer),4(adm),20(dialout),24(cdrom),25(floppy),27(sudo),29(audio),30(dip),33(www-data),44(video),46(plugdev),117(netdev)
33(www-data)が表示されています。
ディレクトリの設定
apacheの公開ディレクトリー（document root)である/var/www/htmlの所有者を developer 所有グループをwww-dataに変更します。
また、権限を755に変更します。
developer@<Ryzen>:~$ sudo chown -R developer:www-data /var/www/html
developer@<Ryzen>:~$ sudo chmod -R 755 /var/www/html
apacheの起動と動作確認
apacheを再起動させます。
sudo service apache2 restart
ブラウザで『http://localhost/』にアクセスします。
下記の Apache2 Ubuntu Default Page が表示されればOKです。
PHPをインストール
php7.4をインストールします。
developer@<Ryzen>:~$ sudo apt -y install php7.4
PHPの拡張モジュールをインストールします。
PHPには、PHPを拡張するためのモジュールがあります。 通常、いくつかのモジュールをインストールすることになります。
Laravel のシステム要件
Laravelでは、以下の拡張モジュールが必要と公式ドキュメントに記載されています。
- BCMath PHP拡張
- Ctype PHP拡張
- Fileinfo PHP拡張
- JSON PHP拡張
- Mbstring PHP拡張
- OpenSSL PHP拡張
- PDO PHP拡張
- Tokenizer PHP拡張
- XML PHP拡張
インストール済みのphp拡張モジュールを調べます。
現状、インストール済みのphp拡張モジュールを調べます。
developer@<Ryzen>:~$ php -m
[PHP Modules]
calendar
Core
ctype
date
exif
FFI
fileinfo
filter
ftp
gettext
hash
iconv
json
libxml
openssl
pcntl
pcre
PDO
Phar
posix
readline
Reflection
session
shmop
sockets
sodium
SPL
standard
sysvmsg
sysvsem
sysvshm
tokenizer
Zend OPcache
zlib
[Zend Modules]
Zend OPcache
不足しているphp拡張モジュールを特定します。
先程の表示されたリストと必要となるリストを照らし合わせてチェックします。
- BCMath PHP拡張 =>
- Ctype PHP拡張 => ctype OK
- Fileinfo PHP extension => fileinfo OK
- JSON PHP拡張 => json OK
- Mbstring PHP拡張 =>
- OpenSSL PHP拡張 => openssl OK
- PDO PHP拡張 => PDO OK
- Tokenizer PHP拡張 => tokenizer OK
- XML PHP拡張 =>
以下が追加でインストールが必要なPHP拡張モジュールです。
- BCMath PHP拡張
- Mbstring PHP拡張
- XML PHP拡張
拡張モジュールの追加
不足しているPHP拡張モジュールに加えて、よく使われる拡張モジュールも追加します。
developer@<Ryzen>:~$ sudo apt -y install php7.4-cli \
php7.4-dev \
php7.4-pgsql \
php7.4-sqlite3 \
php7.4-gd \
php7.4-curl \
php7.4-memcached \
php7.4-imap \
php7.4-mysql \
php7.4-mbstring \
php7.4-xml \
php7.4-xmlrpc \
php7.4-zip \
php7.4-bcmath \
php7.4-soap \
php7.4-intl \
php7.4-ldap \
php7.4-redis \
php7.4-uuid \
php7.4-pcov \
php7.4-msgpack \
php7.4-igbinary
apacheを再起動させます。
sudo service apache2 restart
PHP動作確認用の画面作成
/var/www/html/html/index.phpの作成
VSCODEのメニューバーのFile の NewFile をクリックします。 下記を入力します。
<?php
phpinfo();
?>
メニューバーのSave As で、/var/www/html/index.php で保存します。
ブラウザで『http://localhost/index.php』にアクセスします。
下記が表示されれば、PHPが正常にインストールできています。
PostgreSQLのインストール
PostgreSQLと追加のアドオンをインストールします。
developer@Ryzen:~$ sudo apt -y install postgresql postgresql-contrib
バージョンを確認します。
developer@Ryzen:~$ psql --version
psql (PostgreSQL) 12.5 (Ubuntu 12.5-0ubuntu0.20.04.1)
PostgreSQLの起動
PostgreSQLを起動します。
developer@Ryzen:~$ sudo service postgresql start
* Starting PostgreSQL 12 database server [ OK ]
ユーザー作成 ＆ DB作成
ログインユーザーのdeveloperから、postgres の管理者にスイッチします。
developer@Ryzen:~$ sudo -i -u postgres
PostgreSQLにdeveloperというユーザーを追加します。
パスワードはdeveloperにしてください。
postgres@Ryzen:~$ createuser developer -P
Enter password for new role:
Enter it again:
todoという名称のデータベースを作成します。
postgres@Ryzen:~$ createdb -O developer todo
念のためtodoが作成されたかを確認します。
確認のため psql というpostgresのツールにログインします。
psqlは、データの追加や取得をするためのコマンドラインベースのツールです。
postgres@Ryzen:~$ psql
psql (12.5 (Ubuntu 12.5-0ubuntu0.20.04.1))
Type "help" for help.
postgres=#
データーベース一覧を表示します。
\lを入力してenter を押してください。
postgres=# \l
List of databases
Name | Owner | Encoding | Collate | Ctype | Access privileges
-----------+----------+----------+---------+---------+-----------------------
postgres | postgres | UTF8 | C.UTF-8 | C.UTF-8 |
template0 | postgres | UTF8 | C.UTF-8 | C.UTF-8 | =c/postgres +
| | | | | postgres=CTc/postgres
template1 | postgres | UTF8 | C.UTF-8 | C.UTF-8 | =c/postgres +
| | | | | postgres=CTc/postgres
todo | dev | UTF8 | C.UTF-8 | C.UTF-8 |
(4 rows)
todo があることが確認できました。
「Q」を押すと、入力待ち状態に戻ります。
ツールからログアウトします。
postgres=# exit
テーブル作成
postgresSQLのユーザーとして、developer を作成したので、現在のpostgresをログアウトします。
postgres@Ryzen:~$ exit
logout
psqlでtodoにログインします。
psql -d todo
テーブルを作成します。
todo=> create table tasks (
id bigserial not null
, title character varying(40) not null
, status integer not null
, description character varying(200)
, created_at timestamp
, updated_at timestamp
, constraint tasks_PKC primary key (id)
) ;
テーブル一覧を表示します。
todo=> \dt
List of relations
Schema | Name | Type | Owner
--------+-------+-------+-----------
public | tasks | table | developer
(1 row)
tasks テーブルが作成されていることが確認できました。
もし、名前を間違った場合は、drop table tasks; とテーブルを削除できます。
データ登録
データを4件登録します。1件ずつ登録してください。
todo=> INSERT INTO tasks (title,status,description) VALUES ('bitcoinの半減期を調べる',1,'bitcoinの半減期と価格の相関性を調べる');
todo=> INSERT INTO tasks (title,status,description) VALUES ('サンフランシスコ旅行',1,'サンノゼ空港からパロ・アルトへの行き方を調べる');
todo=> INSERT INTO tasks (title,status,description) VALUES ('アクアパッツァ',1,'再来週の食事会のためにアクアパッツァの作り方を学ぶ');
todo=> INSERT INTO tasks (title,status,description) VALUES ('サンフランシスコ行きの航空券',1,'羽田からサンノゼ空港行きのチケットを予約');
レコードの状況を確認します。
todo=> select * from tasks;
id | title | status | description | created_at | updated_at
----+------------------------------+--------+----------------------------------------------------+------------+------------
1 | bitcoinの半減期を調べる | 1 | bitcoinの半減期と価格の相関性を調べる | |
2 | サンフランシスコ旅行 | 1 | サンノゼ空港からパロ・アルトへの行き方を調べる | |
3 | アクアパッツァ | 1 | 再来週の食事会のためにアクアパッツァの作り方を学ぶ | |
4 | サンフランシスコ行きの航空券 | 1 | 羽田からサンノゼ空港行きのチケットを予約 | |
(4 rows)
4件登録できています。
確認できればEXITします。
postgres@Ryzen:~$ exit
logout
自動起動設定
windows再起動時などにApacheとPostgresqlを自動で起動するように設定します。
ファイルエクスプローラーでStartupフォルダを開く
- Win+R で『ファイル名を指定して実行』を開く
- shell:startup を入力してEnter
batファイル作成
- XXXX.batファイルを作成する。（XXXXは任意の名前）
- XXXX.batファイルは、以下の内容とする。
@echo off
wsl -d Ubuntu-20.04 -u root -- service apache2 start
wsl -d Ubuntu-20.04 -u root -- service postgresql start
通常、Ubuntuではsystemctlで自動起動の設定をするのですが、WSL2ではsystemctlが「PID 1」として起動されていないため設定が行えません。これを回避する方法として、systemctlを「PID 1」として起動させるツール「arkane-systems/genie」というものがあります。しかし、インストールが面等なため上記の方法で対応します。
composer
PHP関連のライブラリを管理するcomposerをインストールします。 Laravelは、composerを通してインストールすることになります。
developer@Ryzen:~$ php -r "copy('https://getcomposer.org/installer', 'composer-setup.php');";
developer@Ryzen:~$ sudo php composer-setup.php --install-dir=/usr/bin --filename=composer;
developer@Ryzen:~$ composer -v
______
/ ____/___ ____ ___ ____ ____ ________ _____
/ / / __ \/ __ `__ \/ __ \/ __ \/ ___/ _ \/ ___/
/ /___/ /_/ / / / / / / /_/ / /_/ (__ ) __/ /
\____/\____/_/ /_/ /_/ .___/\____/____/\___/_/
/_/
Composer version 2.0.13 2021-04-27 13:11:08
次回からの apache & postgreSQL 起動
Windowsを終了させると、Ubuntuも停止するため起動していたapacheとpostgreSQLも停止します。 windowsを起動する度に、apacheとpostgreSQLも起動する必要があります。
手間であればWindowsの起動と共に起動させるように設定することもできます。
Dockerについて
最近では、開発環境を構築するのにDockerというコンテナツールが使われることが多いです。 私自身は、Dockerで構築したコンテナ上で、VSCODEのリモートコンテナ開発を利用して開発をしています。 しかも、DockerはLinuxマシンで動作させています。
