VS Code + Laravel Homestead + XDebugでデバック環境構築
VS Code + Laravel Homestead + XDebugでデバック環境構築を構築しようとしましたが、ハマったしまったのでメモ。
私の環境
- Windows 10 Pro
- Vagrant 2.1.2
- Homestead v7.2.1
- PHP 7.2.5 (Homesteadデフォルトのバージョン)
- XDebug v2.6.0 (Homesteadデフォルトのバージョン)
基本的には下記のページを参考にしました。
Directions for debugging using Xdebug, VSCode, and Homestead. · GitHub
Homestead Laravel Xdebug · Issue #220 · felixfbecker/vscode-php-debug · GitHub
/etc/php/7.2/fpm/conf.d/20-xdebug.ini の設定は
zend_extension=xdebug.so
xdebug.remote_enable = 1
xdebug.remote_host=10.0.2.2
xdebug.remote_autostart = 1
のみです。
xdebug.remote_connect_back = 1
が書いてあったら消しておく。
(私の保存場所はD:\workspace\laravel_work\.vscode\launch.jsonです。)
Homestead.yamlの設定を一部抜粋
folders:
- map: D:\workspace\laravel_work
to: /home/vagrant/code
私の環境では${workspaceRoot}はD:/workspace/laravel_workになるはずですが
pathMappingsの設定を上記コメントアウトの設定ではなぜか動かず。
${workspaceRoot}にしたところデバッカが動いた。
パーフェクトPHP mini-blogソースコード正誤表
自分で確認した誤り箇所は下記の通り。他にもあるかもしれません。
mini-blog\views\account/index.php line6
誤 <?php echo $base_urlp ?>
正 <?php echo $base_url; ?>
mini-blog\models line44
MySQLを使うと整数型でも文字列で返されるそうです。
PostgreSQLでは整数型は整数型で返されるため修正が必要です。
誤 if ($row['count'] === '0') {
正 if ($row['count'] === 0) {
mini-blog\views\account\index.php line 6-7
誤 (改行が入っている)
<?php echo $this->escape($user['user_
name']); ?>">
正
<?php echo $this->escape($user['user_name']); ?>">
パーフェクトPHP読みました(その1)
これからPHPを学んでいこうと思い、下記の理由からパーフェクトPHPを購入しました。
- PHPは久しく触っていなかったため、体系的に学べる書籍がほしい
- 他の言語でプログラミングの基礎は理解している
この本の最初のページに書いてあるとおり本書籍の対象となる読者はプログラミングの基本をある程度理解している中級者向けの本となります。
ネットで調べたところ、この本の特徴として、
があるみたいですが、とりあえず、フレームワークとセキュリティ以外の章を読みました。
フレームワークとセキュリティ以外の章では、他言語を学んでいればあまり特筆すべき点はありませんが、PHPとの特徴というか気になったところを上げていきたいと思います。
変数スコープ
PHPのスコープは、グローバルスコープと関数やメソッド内のローカルスコープのみ。PHPではブロックスコープはないため、下記の通り、if文やfor文内で宣言した変数がそれらを抜けたあとでも使うことができる。
for($i = 0; $i < 10; $i++){
// ループ内処理
}
echo $i; // $i=10となる
配列
一般的に配列といえば、添字が整数で" val[i] "のようなものをイメージしますが、PHPでは、いわゆる連想配列(val['index']のようなもの)も配列であり、両者は区別されない。
タイプヒンティング
JavaやCなどでは関数の引数に型を指定しなければなりませんが、PHPでは、関数の引数に型を指定しなくても良いです。タイプヒンティングは、Java,Cのように関数の引数に型を指定する方法です。クラス名やインターフェース名はPHP5.0.0から利用できます。。intやstringなどプリミティブな型はPHP7.0.0から利用できます。また、関数の戻り値についてもPHP7.0.0から型を指定できるようです。
// intやMyClassがタイプヒンティング。指定しなくても良い
function func(int $arg1, MyClass $arg2) : string
{
// 関数内処理.
// .....
return "Return String";
}
名前空間、オートロード
名前空間は、Javaで言うところのpackageに相当するもの。”namespace Hoge\Fuga" のように書く。PHP5.3.0から利用できるようになったみたいです。
オートロードはクラスを読み込むための仕組みのこと。Composerを使えばオートローダーが自動で作成されいい感じにクラスを読み込んでくれる。
終わりに
これからは下記の手順で進めていこうと思います。
- デザインパターン(下記リンクの内容)
- CLIアプリ作成
学んでいく手順については下記のページを参考にしました。
N予備校 「【2017年度】プログラミング入門 Webアプリ」受講 その2
前回からの続きで第4章を手を動かしながら読んでいきました。
第4章 実践サーバーサイドプログラミング
この章で学べる内容は下記の通りとなっています。
フレームワーク
ここからいよいよフレームワークを使って行きます。第3章で作成した匿名掲示板もフレームワークをフルスクラッチで作っているようなものですが、ここでは、世の中で広く使われていると思われるNode.jsフレームワークであるExpressを使います。Expressにgeneratorというものがあり、これを使うことで、フォルダ構成や基本的なファイルを自動で作成してくれます。本章後半では、generatorで作成した雛形からスケジュール調整アプリを作成していきます。
テスティングツール
本章前半は、フレームワークを使ったアプリ作成に必要な技術について学んでいきます。まずは、テスティングツールとしてここではMochaを使用しています。テストコードを書くことは大事であるとよく言われていますが、私は、テストコードを書いたことがないので、ここで基本を学べたと思っています。Mochaはテストの中でもユニットテスト（単体テスト）を行うもの。ユニットテストは下記のようにある関数や処理に入力を入れてその想定した出力結果が出るかどうかをコードで書くもの。
assert.equal(testFunc(input), expected);
言葉で説明するのは簡単ですが、後半のスケジュール調整アプリ作成でのテストコードは意外と大変でした。
CIツール
続いてCIツールであるCircleCIを学びます。CircleCIはGitHubと連携してGihHubにコードをプッシュすると自動でテストを行ってくれるもの。GitHubのリポジトリでバッジが付いているものがありますが、これはCIでテストが通過している証みたいです。
クライアント技術
次は、クライアント側のツールの紹介になります。まずは、Webpackです。クライアント側のツールはBabelやGulpやらたくさんあって難しいそうですが、Webpackは単純に複数あるファイルを1つにまとめてくれるものです。1つにまとめることで、キャッシュの利用効率を上げたり、TCPの接続確立コストを減らせることができるみたいです。これによりサービス提供側、ユーザ側双方の負荷を減らすことができるとのこと。
クライアント側ツールの2つ目3つ目は、jQueryとAjaxです。私は基本的なことは知っていたので流し読み程度しかしていません。大規模なアプリでは、Angular, React, Vueなどが使われているみたいですが、小規模であればjQueryだけでも十分かと思います。
クライアント側ツール最後は、WebSocketです。WebScoketは双方向のリアルタイムな通信を実現できるそうです。Ajaxはクライアント側からサーバ側に送るだけ（プル通信）ですが、WebSocketはサーバ側からクライアント側へ（プッシュ通信）通信が可能です。
RDBMS
RDBMSについてもこの章で書かれている程度の内容は知っていたので、ここで特筆すべき事はありませんでした。
フレームワークを使ったスケジュール管理アプリの作成
これまで学んできたことの集大成としてスケジュール管理アプリを作成していきます。Webアプリの作成には頭の中で考えたものをそのままプログラミングするのではなく、頭の中で考えたものをどのように作るのか書き起こす必要があります。
コーディングに入る前にどのような使われ方をするのか（ユースケース）、どのような機能を作成するのか（要件定義）、データ構造はどうするか（データモデリング）、サーバへのリクエストの送り方、ページの構造（URL設計）をする必要があります。ここでは新しい技術を学ぶことはありませんが、どのようにWebアプリを作成していくのか流れを理解することができますし、テストコードをどのように書くのかなどこれからWebアプリを作成していくための参考になると思います。
感想
ここで学んだ内容はWebアプリを作成するのに必要最低限のことは書かれていると思いますが、詳しいところを自分で調べて学ぶ必要があると思いました。
N予備校のプログラミング講座は説明を読みながらコードを理解してそれを実行するといった形で、自分で考えてプログラムを書くといったことはしていないので、ここで学んだことを自分のものにするには自分で考えてプログラムを書く必要があります。
今後の予定
ここで学んだNode.js、Expressを使って自分で考えたWebアプリを作成するのもいいのですが、下記リンクを参考にしてWeb業界でよく使われているPHPを使ってWebアプリを作成するために必要な技術を基礎から学んでいきたいと思います。
N予備校 「【2017年度】プログラミング入門 Webアプリ」受講
N予備校のプログラミングコースは、ドワンゴの現役のエンジニアが作成しており、実践的なプログラミングが学べそうであったので、こちらを受講してみました。
大学時代にプログラミングの基本的なことは学びましたが、イマドキな開発環境でWebアプリを作ってみたくなったので、1から勉強し直しました。プログラミング入門Webアプリのコースでは、Webアプリを作成するために必要な技術が学べます。教材は動画（生放送のタイムシフト）とテキストの2種類がありますが、私は知っている内容を流し読みできるテキストのみしか使いませんでした。
第1章 はじめよう
HTML, CSS,Javascriptが学べます。私はある程度知っていたので、飛ばしましたが、プログラミングをやったことがない人でも理解できそうな内容です。
第2章 準備しよう
Webアプリ作成のためのLinux周りの内容です。最初はVirtualBox, Vagrantをインストールして、その中にUbuntuインストールするところから始まります。VirtualBoxは仮想化ソフトウェアというもので、PCの中に仮想のPCを作ることができるソフトと言うイメージです。VagrantはVirtualBoxなどの仮想化ソフトウェア上で動くもので、仮想環境を管理したり構築するためのソフトウェアです。VagrantはVagrantfileと「box」と呼ばれるもととなるOSのイメージファイルで仮想マシンを起動させることができます。VagrantはChefやAnsibleなどのプロビジョニングツールと呼ばれるものと組み合わせて開発環境を同じ開発チームの人に簡単に配布できるところが強みであると思いますが、VirtualBox＋Vagrantだけを使うならばVirtualBoxだけでもいいような気がします。VirtualBox+Vagrantだけでも仮想マシンを簡単に作成・削除ができますし、Vagrantファイルの設定を使い回す事もできるのでVagrantを使用するメリットがまったくないわけではないと思います。
その後、linuxコマンド、Git、GitHubの使い方を学びます。第3章の練習問題では、GitHub上にある練習問題のリポジトリをフォーク→ローカル環境で編集→プルリクエストするといった形でGitHubはずっと使っていきます。
この章もある程度知っている内容でしたが、VagrantやGitHubのプルリクエストは使ったことがなかったので、勉強になりました。
キーワード：Linuxコマンド,Vagrant,VirtualBox,GitHub
第3章 サーバーサイドプログラミング入門
ここからようやくWebアプリを作成していきます。開発環境はNode.jsを使用しています。Web系では、PHP, Ruby, Python, Javaあたりがよく使われると思いますが、サーバーサイド、クライアントサイドで別の言語を使用すると学習コストが高くなるので、サーバ・クライアント両方ともにJavascriptが使えるNode.jsを選択しているのは良いと思います。
この章の前半では、Slackと呼ばれるコミュニケーションツール上で動作するBotを作成します。npmを使用してモジュール化したり、テストコードを書いたりします。今までにテストコードを書いたことがありませんでしたが、実際の開発現場では、テストコードを書いてコードの品質を維持していくと思いますので、テストコードを意識しながらプログラミングをしていきたいと思いました。
後半は、Web上で匿名掲示板の作成を行います。クライアントサイドでは、JadeというテンプレートエンジンやCSSフレームワークであるBootstrapを使用しています。サーバーサイドでは、SequelizeというORMやCookie,Baic認証のライブラリなどを使用します。
セキュリティ関係では、この章の中では、
- OSコマンド・インジェクション
- セッションハイジャック
- クロスサイト・スクリプティング（XSS）
- クロスサイト・リクエストフォージェリ（CSRF）
について解説があり、これらの脆弱性があるとどのような事ができるのか実際に動かしながら説明されています。フレームワークを使用すればこのあたりの脆弱性は意識しなくてもいいかもしれませんが、基本的が原理については知っておくことは大事であると思います。
匿名掲示板の設計はMVCを意識しており、きれいな設計であるので、自分で新しくWebアプリを作るときにこのようなきれいな設計ができるようになりたいです。
キーワード：Node.js, npm, Slackボット, HTTP, Heroku, Jade, Bootstrap, Sequelize, Cookie, セキュリティ
ここまでの感想
第1章は基本的な内容でプログラミングを知らない人でもできると思いましたが、第2,３章あたりからは必要なツールが増えていき初学者には少しは難しいかなと思いました。
内容的には情報系の大学では学べないような実践的な内容が多くWeb系の企業に就職・転職したい人にはもってこいの内容でした。残りの第４章があるのでこちらを進めてていきたいと思います。第４章はフレームワークを使用してWebアプリを作成していく内容であると思われます。
今後の予定
N予備校に関しては「プログラミング入門Webアプリ」を終えたら解約しようと思います。N予備校のプログラミング関係で気になる講座は「大規模Webアプリ」と「スマートフォンアプリ」があります。大規模WebアプリはScalaを使用した大規模アプリです。ドワンゴの中ではScalaが流行っているみたいですが、Web業界の中ではマイナーであると思いますのでこちらの講座は取りません。Scalaは気になりますが、まずは世の中でよく使われるPHPかRubyを使用してWebアプリを作りたいと思います。スマートフォンアプリも時間があればやってみたいですが、まずは、Webアプリを１つ作ることを目標としたいです。
