Believe you can

If you can dream it, you can do it.

Dockerに作ったPHP環境にIntellij IDEAで接続してDebugする

前回はDocker上にPHP環境を作るところまで行いました。今回はそのDocker上のPHPIntellij IDEAから接続してDebugするところまで作りたいと思います。

chichi1091.hatenablog.jp

この記事はIntellij IDEA Ultimate Editionで行っていますが、PhpStormでも同様の方法になると思います。(自信なし)
なお、私のIntellij IDEAは日本化されてますので適切に読み替えてください。

プラグインのインストール

※PhpStormをご利用の方は読み飛ばしていただいて大丈夫です。
Intellij IDEAにPHP関係のプラグインをインストールします。

  • PhpStorm Workshop
  • PHP
  • PHP Docker
  • Laravel

Dockerの設定

PreferencesDockerを開いて接続Dockerを設定します。
私の環境はmacですので Docker for Macを選択します。

f:id:chichi1091:20211011233650p:plain

次にPHPを選択して言語レベルとCLIを設定します。
言語レベルは利用しているPHPのバージョンに合わせて8.0を設定し、CLIインタプリタはDocker用をして新たに登録します。

Form Docker, Vagrant, VM, WSL, Remoteを選び画像のように設定します。
f:id:chichi1091:20211011234506p:plain

すると、DockerのPHPを読み込んでCLIインタプリタが作成されます。
f:id:chichi1091:20211011234647p:plain

最終的には次の画像のような設定となればOKです。
f:id:chichi1091:20211011234800p:plain

続いてPHP->サーバの設定を行います。これはDockerのXdebugに接続するために行います。ポイントはserver/var/wwwであることを紐付けることです。
f:id:chichi1091:20211012003501p:plain

実行

上部メニューの構成の追加をクリックしPHPリモートデバッグを登録します。
f:id:chichi1091:20211012000426p:plain

デバッグ実行の虫アイコンと電話のようなアイコンのリッスンを起動します。
適当な箇所にブレイクポイントを貼って http://localhostにアクセスすると指定した箇所で止まることができました。
f:id:chichi1091:20211012003234p:plain

かんたんに接続することができましたね。環境構築はこれで終わりで次回からはAPIサーバを作っていきたいと思います。

Docker上にLaravel環境構築

普段はJavaとSpringBootで開発しているのですが、PHPカンファレンス2021にスタッフ参加したことでモチベーションがあがりLaravelでなにか作りたいなと思い、環境構築しました。
数年前にPHP開発をしたこともありましたが、Vagrantを利用した環境だったので昨今の当たり前環境を学ぼうという魂胆もあります。

以下の環境を作ろうと思います。

図らずともバージョンは8で統一されましたw

ディレクトリ構成

以下の構成としました。多分よくある構成かと思われます。
serverにはLaravelのソースが入る形となります。

root
├ docker-compose.yml
├ docker
│  ├ php
│  │  ├ php.ini
│  │  └ Dockerfile
│  ├ db
│  │  ├ data
│  │  ├ logs
│  │  ├ sql
│  │  └ my.cnf
│  └ nginx
│    └ default.conf
└ server

docker-compose

詳しい解説はしませんが、PHP・Nginx・DBの3つのコンテナを立ち上げます。

version: '3'

services:
  php:
    container_name: php
    build: ./docker/php
    volumes:
    - ./server:/var/www
    depends_on:
    - db

  nginx:
    image: nginx
    container_name: nginx
    ports:
    - 80:80
    volumes:
    - ./server:/var/www
    - ./docker/nginx/default.conf:/etc/nginx/conf.d/default.conf
    depends_on:
    - php

  db:
    image: mysql:8.0.26
    container_name: db
    environment:
      MYSQL_ROOT_PASSWORD: root
      MYSQL_DATABASE: database
      MYSQL_USER: docker
      MYSQL_PASSWORD: docker
      TZ: 'Asia/Tokyo'
    command: mysqld --character-set-server=utf8mb4 --collation-server=utf8mb4_unicode_ci
    volumes:
    - ./docker/db/data:/var/lib/mysql
    - ./docker/db/my.cnf:/etc/mysql/conf.d/my.cnf
    - ./docker/db/logs:/var/log/mysql
    - ./docker/db/sql:/docker-entrypoint-initdb.d
    ports:
    - 3306:3306

PHP

PHPのコンテナにはcomposerを入れたりaptでモジュールを入れたりする必要があるのでDockerfileを用意します。
aptで入れているモジュールやdocker-php-ext-installはよくわからんので個別に調べないとだな。。。

FROM php:8.0-fpm
COPY php.ini /usr/local/etc/php/

RUN apt-get update \
  && apt-get upgrade -y \
  && apt-get install -y libicu-dev libzip-dev libonig-dev libssl-dev zip unzip \
  && docker-php-ext-install zip pdo_mysql \
  && pecl install xdebug \
  && docker-php-ext-enable xdebug

COPY --from=composer /usr/bin/composer /usr/bin/composer

ENV COMPOSER_ALLOW_SUPERUSER 1
ENV COMPOSER_HOME /composer
ENV PATH $PATH:/composer/vendor/bin

WORKDIR /var/www

RUN composer global require "laravel/installer"

続いてphp.iniです。これも特段説明することはないのですが、xdebugを入れています。今後はIntellij IDEA(PHPStorm)を使った開発を想定しているのでデバッグできるように入れています。

[Date]
date.timezone = "Asia/Tokyo"

[mbstring]
mbstring.internal_encoding = "UTF-8"
mbstring.language = "Japanese"

[xdebug]
xdebug.client_host = host.docker.internal
xdebug.client_port = 9003
xdebug.idekey = PHPSTORM
xdebug.mode = debug
xdebug.start_with_request = yes

Nginx

Nginxの設定ファイルです。今まではApachePHPを動かしていたので実はNginxは初めてです。。触ってみたいと思っていたのでNginxにしています。なのであまり説明できません、ごめんなさい。。。
ただ、ポイントとするとnginxコンテナのルートがserverになっているのでnginxのルートが /var/www/publicプロジェクトルート/server/publicということです。

server {
  listen 80;
  index index.php index.html;
  root /var/www/public;

  location / {
    try_files $uri $uri/ /index.php?$query_string;
  }

  location ~ \.php$ {
    try_files $uri =404;
    fastcgi_split_path_info ^(.+\.php)(/.+)$;
    fastcgi_pass php:9000;
    fastcgi_index index.php;
    include fastcgi_params;
    fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
    fastcgi_param PATH_INFO $fastcgi_path_info;
  }
 }

MySQL

MySQLのデータを永続化するためにホストマシンに保持する形としています。sqlフォルダにDDLを配置しておけば起動時にテーブルを作ることも可能です。このあとTODOアプリを作ろうと思うのでDDLはこちらに配置することになります。
my.confもよくある設定だと思いますが、文字コード・ログ、スロークエリの出力についての設定です。

[mysqld]
character-set-server=utf8mb4
collation-server=utf8mb4_unicode_ci

default-authentication-plugin = mysql_native_password

log-error = /var/log/mysql/mysql-error.log

slow_query_log = 1
slow_query_log_file = /var/log/mysql/mysql-slow.log
long_query_time = 5.0
log_queries_not_using_indexes = 0

general_log = 1
general_log_file = /var/log/mysql/mysql-query.log

[client]
default-character-set=utf8mb4

プロジェクトの作成

Docker環境については以上でアプリケーションLaravelのプロジェクトを作っていきます。
コンテナを起動し、PHPコンテナでコマンドを実行します。

$ docker-compose up -d --build
$ docker-compose exec php bash
root@aafbcadd9d34:/var/www# composer create-project --prefer-dist laravel/laravel ./

しばらく待つと、serverディレクトが作られLaravelの各種ファイルが配置されます。

初期画面

ブラウザから http://localhost にアクセスするとLaravelの画面が表示されると思います。
昔の画面と違うんですね。もっとでかいLaravelって文字が真ん中にあった気がします。

f:id:chichi1091:20211009114718p:plain

まとめ

今回は初期画面が表示されるまでの環境構築になります。Dockerのおかげで非常にかんたんに構築することができますね。
次回以降はxdebugやRestAPIを作るところをやっていければと思います。

今回作った環境はGitHubにもアップしているので興味があれば参照してみてください。

github.com

PHPカンファレンス2021に当日スタッフとして参加しました(#phpcon2021)

2019、2020に続き今年もPHPカンファレンスの当日スタッフとして参加してきました。

phpcon.connpass.com

過去最高の応募人数となった今回のPHPカンファレンスですが、10/2、3の2日に渡って開催されました。

何してたの?

自分の役割はSNS担当とDiscordの盛り上げ係となります。
Twitter上で質問があれば回答したり、配信の遅れや連絡事項があればTwitterFacebookに投稿するといったことを行います。

前回も同じ役割だったし、SNS広報を取りまとめてくれている @mukakenさんが事前に説明してくれていたのでスムーズに行えたと思います。ありがとうございました!

Discordでは今回始めての試みとなるスポンサーツアーがあり基本そこに入り浸っていました。各企業のプロダクトやエンジニアリング文化など聞くことができスタッフでありながら楽しく参加することができました。今後もぜひ続けていただきたいですね。

次回も参加する?

オフライン開催でリモートスタッフが可能であればもちろん参加したいと考えています。とはいえ、配信現場のLIVEを見ているとやっぱ現地に行きたくなりますねw

次回は9/24、25に開催予定ですのでまだお会いできることを楽しみにしています。
コアスタッフ・運営委員、当日スタッフの皆様大変お疲れ様でした!

久しぶりに自作PC作った

自作PCが作りたい要求が出てきてしまったので、思い立って作ってみた。
(用途はこれから考えるのです。。)
前回PCを作ったのが学生時代なので約20年ぶり。壊さずつくれるかドキドキです。。。

せっかくPCを作るので、今使っているMacbook Airよりもスペックを上げつつ、予算は安ければ安いほどいいという条件にした。
以下の構成となった。購入は全てドスパラ

パーツ 金額
Core i5 10400F BOX(6C/12T) 15,980
PRIME B460M-A (B460 1200 MicroATX) 9,680
SSD 125GB 0 手持ちのSSDを流用
HDD 500GB 0 手持ちのHDDを流用
CMK32GX4M2A2666C16 (DDR4 PC4-21300 16GB 2枚組) 16,980
KRPW-L5-500W/80+ (500W) 4,480
CA-1J4-00S1WN-00 (Versa H18 MicroATX アクリル) 3,080
GTX1050 0 手持ちのグラボを流用

合計:50,200円

CPUをi3にしてメモリを減らせばもうちょい安く作れたけど、Macbook Airと似たスペックになってしまうので自分的には最安の構成。
とはいえグラボはサイズがあってないので早めに購入しないとです。。

基本的にはパーツを決まった箇所にはめるだけなのでそれほど悩まなかったですが、マザボとケースの配線、各種電源ケーブルの取り回しなどの配線が難しかった。
初心者向けにもうちょっとわかりやすい説明書を望みます。。。

せっかくそこそこのスペックを手に入れたので、ゲームや動画編集・プログラミングに活用しようと思います。
ただ、Windowsが久しぶりすぎて使いこなせないので慣れていかないと。

近況報告

半年ぶりの投稿になってしまった。。
ブログを書く癖を改めて付けるためにちょっとしたことも書いていこうかなって思っています

TDDBC Online

テスト駆動開発を学ぶイベントのスタッフ見習いとして参加しました

tddbc.connpass.com

新たな出会いや学びもありとても有意義な会でした
「長野でもTDDBCやりたい」って思いから参加させてもらいましたが、まだ長野では開催できていません。。
地方開催なのでオンラインではなくオフラインでやりたいという気持ちがありちょっと躊躇している状況です
NaganoJavaも同じ感じになってしまっているのでマジコロナ早く落ち着いてほしい(●`ε´●)

PHPカンファレンス2020

当日スタッフとして参加させていただきました

phpcon.connpass.com

長野からリモート参加のスタッフなのでDiscordやSNS担当としての参加です
GMOさんの「今年の漢字」でおもしろ賞をいただき、マグカップもいただくというスタッフらしからぬことをやってしまいました
お肉は家族で美味しくいただきました!GMOさんありがとうございました!!

技術書典10

前回の記事で技術書典9に参加したことを投稿しましたが、実は技術書典10にも参加してました

techbookfest.org

9で執筆したKtorとNuxt.jsの第2弾的な内容でJWTトークンやDIコンテナ、クリーンアーキテクチャリファクタリングする内容になっています
多くの方にご購入いただいて感謝です、ありがとうございました

PC購入

今まではMacbook Pro(2013)を使っていましたが、バッテリーがヘタってきたこともあり購入に踏み切りました
ちょうどM1も販売されたので丁度いいかと検討しましたが予算に合わず、メルカリでMacbook Air(2018)を中古で購入しました。。
お小遣い制のビンボーお父さんなのでしょうがない。。。

原付き購入

高校生の頃に乗りたくても乗れなかったバイク熱がこの歳になって出てきてしまって、ついつい「en125」というバイクを購入
バイクが趣味って言えるようになるかななんて思っていましが、車を動かなさないとバイクが出せないという面倒くささでほとんど乗っていないという状況。。
無駄遣いとしか言えませんね
暑くなる前にたくさん乗っておきたい

仕事面

リニューアルに向けて頑張ってきましたが、ついにリリースを間近に迎えています
新しく取り組めた技術もあるのですが、自社のブログにあげているのでこっちが停滞しがちになってしまいました
一次面接担当みたいな役割にもなっていてめちゃくちゃたくさんのエンジニアさんと会話させていただき、自分ももっと頑張らないとなーという気持ちになっています

こんな感じになんとか元気にやってます

無事に技術書典9で頒布できました(#技術書典)

9/12〜22まで開催された技術書典ですが、前回の記事で宣言したとおり、技術書典9に参加し薄い本を頒布することができました
同人誌の知識も執筆の知識も全くなく、更に尿管結石と戦う状態で無事に頒布できたことにホッとしてますε-(´∀`*)ホッ
1つ心残りがあるとすれば、PDFのみので物理本を販売できなかったことです。。
簡単に振り返ってみようかと思います

執筆した本

「KtorとNuxt.jsで作るWebアプリケーション入門」という本を執筆しました
予想以上に多くの方にご購入いただき、改めて感謝申し上げます。ありがとうございました!!

Ktorについては「ながのJava」にて登壇した経験があり、また触ってみたいなーという気持ちとサーバサイドKotlinをもっと広めたいという気持ちから選ばせてもらいました
Nuxt.jsについては仕事で使い始めたものの、弊社フロントエンド陣が優秀でついていけなくなってきていたこともあり、基礎から学び直すために選んでいるため誤りもあったかもしれません。。(ぜひご指摘いただけると🙇)

...という個人的な理由から執筆内容を選べるのも技術書典の醍醐味かと思っています

techbookfest.org

crescent-tech.booth.pm

執筆環境

事前知識が全くないので、先人に付いていこうとTechBoosterさんのReVIEW-Templateを使わせていただきました
更にありがたいことにTechBoosterさんは技術書をかこう!〜はじめてのRe:VIEW〜改訂版も無料公開してくれていますので、この2つがあれば困ることはないと思います。改めて感謝です...!
VSCodeにextensionを追加して執筆し、GitHubで管理しPDF作成はそのままGitHub Actionで作成しました

表紙やサークルカット

絵は全く書くことができませんので最初は妻の実家の犬を表紙にしようかと考えましたが、「肖像権は?」という妻からの冷たい一言で断念。。。
無料の素材を探しpixabayを利用させていただきました。商用利用可能のものを選べば多分問題ないと思います(責任は持てませんのであしからず)
サークルカットもpixabayから利用させてもらってます

印刷

日光企画やとらのあな、BOOTHがダイレクト入稿可能な印刷所さんになるかと思いますが、僕は残念ながら物理本は作りませんでした
いや、作れなかったというのが正しく、依頼の仕方と初期投資ができなかったのが理由になります。。。
せっかく「技術書を書いてみよう!」のYoutube Liveで勉強したのにも関わらず活かせず今となってもは後悔してます
改めて動画を見て、次回は物理本も用意したいです

techbookfest.connpass.com

次回に向けて

技術書典10は12月に開催されるとのことで、次回も参加したいと考えています
今回の「Webアプリケーション入門」に認証やユニットテスト、DIコンテナを追加したものと別ジャンルでもう一冊いければなーとざっくり構想しています
その本がお目に止まりご購入いただけるようがんばります!!

技術書典9に出典します(#技術書典)

大変ご無沙汰な更新になってしまいました
一応、生存はしておりますので、ご安心ください^^;

9/12から開催される技術書典9に出典することが決まりました!

techbookfest.org

なんの前触れもなく、執筆する内容も決まっていないのに応募をするという珍しく勢いで行動してますw
「KtorとNuxt.jsで作るWebアプリケーション」というタイトルで出典予定で、ハンズオン形式で進めていくとTODOアプリケーションが作成される内容を考えています

サークルカットや表紙が掲載できればよかったんですが、まだできておらず書籍も絶賛執筆中なので続報をお待ちください
無事出典ができた際はご購入いただけるととっても嬉しいです

よろしくおねがいしまーす!!

8/23
間違えて技術書典10と記載していたのを技術書典9に修正