6
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

cakePHP4をインストールしてVScode でRemoteContainerにdocker構築してみた

Last updated at Posted at 2021-06-14

はじめに

研修でCakePHP4をインストールし、vscodeを利用してRemoteContainerに環境構築を行ったので、アウトプットのために実際に行ってきた手順を書いていきたいと思います。
余計な部分も書いておりますので、参考にする方がいらっしゃるなら最後まで読んでから必要な部分を見つけて下さると良いと思います。
初めてqiitaに投稿致しますが、同じような部分で躓いている方の手助けにもなれば幸いです。

この記事の対象者

CakePHPをインストールしたことがない。
Dockerに不慣れである。
初めて環境構築する。

事前環境

ホストOS: WIndows10 home
ゲストOS: WSL2 Ubuntu20.04
DockerDesktop
vscode
PHP 7.4.20 (cli)

目次

1.cakePHP4のインストール
2.Remote Development拡張機能のインストール
3.データベース接続
4.終わりに

1.CakePHP4のインストール

まずCakePHPをインストールするためにはComposerのインストールが推奨されているのでそれに沿って進めていきます。
wslでインストールするディレクトリを作成して下記のコマンドを実行してください。
最新の情報を確認したい場合はcakePHPの公式ページにも書いてありますのでそちらを参照してください。
CakePHPのインストール

$php -r "copy('https://getcomposer.org/installer', 'composer-setup.php');"
$php -r "if (hash_file('sha384', 'composer-setup.php') === '756890a4488ce9024fc62c56153228907f1545c228516cbf63f885e036d37e9a59d27d63f46af1d4d07ee0f76181c7d3') { echo 'Installer verified'; } else { echo 'Installer corrupt'; unlink('composer-setup.php'); } echo PHP_EOL;"
$php composer-setup.php 
$php -r "unlink('composer-setup.php');"

以上を実行することでディレクトリ内は以下のようになります。

$ls
composer.phar

composerのインストールが完了しましたので下記のコマンドでプロジェクトを作成してみましょう。

$php composer.phar create-project --prefer-dist cakephp/app:4.* my_app_name

ここでエラー文が表示されました。

Your requirements could not be resolved to an installable set of packages.
Problem 1
・
・
・
・

拡張モジュールが足りないと言っています。Problemに求められている拡張機能が書かれているので導入していきます。
私の場合はphp7.4-intl、php7.4-mbstring、php7.4-domをインストールすることになりました。

$sudo apt -y install php7.4-intl
$sudo apt -y install php7.4-mbstring
$sudo apt-get install php7.4-dom

もう一度プロジェクトを作成してみます。

$php composer.phar create-project --prefer-dist cakephp/app:4.* my_app_name
$ls
composer.phar  my_app_name

これでmy_app_nameが作れました。cakePHPのインストールは以上で完了です!

ここまでくればサーバーを起動することは簡単です。
my_app_nameディレクトリで下記のコマンドを実行してください。

$bin/cake server

サーバーが起動しているかはhttp://localhost:8765で確認出来ます。
image.png

2.Remote Development拡張機能のインストール

まだ全く使いこなせていませんがリモート先のファイルを編集することができるvscodeの拡張機能です。
Remote Developmentをインストールするとそれに伴って他にも必要なものをいくつかインストールしてくれます!
それではvscodeでターミナルを開いて先ほど作ったtestディレクトリまで移動して次のコマンドを実行していきます。

$cd test
$code .

最初のインストールには時間がかかります。
vscodeを開くと左下にwsl:<ディストリビューション名>という表示が出ています。
これでリモートでwslにつながっています。

次にmariaDBを使うためにコンテナを開きます。
ctr+sft+pを押してremote containers: open folder in containersを検索してクリックします。

Screenshot_4.png

show all Definitions...を選択するとPHP&MariaDBを選択できますのでクリックしてください。
dockerfileなどのコンテナの立ち上げに必要なものが.devcontainerディレクトリにインストールされているはずです。

左下に以下のようにPHP&MariaDB表示されていればmariadbとphpが使えるようになってます!!
image.png
つまり私は最初にPHPをインストールしましたが、そんなことしなくても使えるということです!
リモートコンテナが複数人で開発を行う時に役立つと聞いたことはありましたが、ようやく理解できてきました。

3.データベース接続

ではPHP&MariaDBでもサーバーを開きましょう。ディレクトリを移動して、、、

$bin/cake server
Xdebug: [Step Debug] Could not connect to debugging client. Tried: localhost:9000 (through xdebug.client_host/xdebug.client_port) :-(

Fatal error: You must enable the intl extension to use CakePHP. in /workspace/my_app_name/config/requirements.php on line 31

最初にintlを拡張したのにまたして欲しいと言ってます。
イメージではありますが、コンテナの環境内ではまだintlは拡張されていないということなんでしょうね。

なるほど~勉強になる。

ということはコンテナ内にてintlを拡張できなければなりませんね。
Dockerfileに以下のintlを拡張する命令をいれてください。

Dockerfile
RUN apt-get update && apt-get install -y --no-install-recommends \
        libicu-dev \
    && rm -rf /var/lib/apt/lists/*
RUN docker-php-ext-install intl

左下をクリックしてRebuild Containerを選択
image.png
image.png

ではサーバーを立ち上げましょう。

$bin/cake server

image.png
もう慣れ親しんだページです。データベースのところが赤くなっていて接続できていないと教えてくれています。
データベースの接続設定は my_app_name/config/app_local.phpで設定できます。
app_local.phpは以下のようになっています。接続したいデータベースはmariadbですので.devcontainerディレクトリのymlファイルを確認してみます。

app_local.php
'Datasources' => [
        'default' => [
            'host' => 'localhost',
            'username' => 'my_app',
            'password' => 'secret',
            'database' => 'my_app',
            'url' => env('DATABASE_URL', null),
        ],
docker-compose.yml
db:
    image: mariadb:10.4
    restart: unless-stopped
    volumes:
      - mariadb-data:/var/lib/mysql
    environment:
      MYSQL_ROOT_PASSWORD: mariadb
      MYSQL_DATABASE: mariadb
      MYSQL_USER: mariadb
      MYSQL_PASSWORD: mariadb

以下のように書き直せば接続できます。他にも多くの利用できる機能があると思います。公式ページを確認してみてください。
パスワードなどはデフォルトのまま使用してますが、自分で変更することは簡単に出来るはずです。

app_local.php
'Datasources' => [
        'default' => [
            'host' => 'db',
            'username' => 'mariadb',
            'password' => 'mariadb',
            'database' => 'mariadb',
            'url' => env('DATABASE_URL', null),
        ],

ではサーバーを立ち上げてみましょう。緑のチェックが入っていればデータベースに接続できています。
http://localhost:8765
image.png

もはやメモですが以下のコマンドでMariaDBが使えました。

mysql -h db -P 3306 -u root -p

4.終わりに

この記事では実際に行った流れの通り書いてますので不必要な部分があります。文章中にも一度触れましたがPHPや拡張モジュールをインストールすることはローカルPCで行う必要はありません。
Remote Containerに環境を作っているのに、自分のPCでも環境構築するのはやっていて私も違和感がありましたw
綺麗にやるならPHP&MariaDBを開いてからCakePHPをインストールするのがいいんじゃないでしょうか。
ともあれ、この記事を参考にすれば恐らくremoteでもlocalにでもCakePHPの環境構築が出来ると思います。

初めてqiitaの記事を書きましたがいかがでしたでしょうか。
この記事を見た方の力になれていることを祈ります。

参考

Linux(Ubuntu)にphp7.4をインストールする方法
VSCodeのRemote Developmentを使ってみる
【WSL / WSL2】VSCode×WSLでWindows上にLinux開発環境を構築

6
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
6
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?