俺・・・

Vimmerになるわ・・・

Posted on 5月 14, 2015 at 20:49 by 伊崎 · Permalink · 3 Comments
In: 日常

【Windows】PHP + Vagrant + Eclipse + XDebugでWEBアプリケーション開発環境構築 #07 – XDebugのインストールとEclipseの設定

XDebugインストール

$sudo yum -y install php-pecl-xdebug

インストールできたらphp.iniを編集する。

sudo vi /etc/php.ini

zend_extension=/usr/lib64/php/modules/xdebug.so
xdebug.default_enable=On
xdebug.remote_enable=On
xdebug.remote_port=9000
xdebug.remote_autostart=On
xdebug.remote_host=192.168.33.10
xdebug.remote_connect_back=On

Eclipse側の設定

エクスプローラからプロジェクトを選択し、右クリックメニューから
「実行」→「実行構成」をクリック。

実行構成ウィンドウでPHP Web アプリケーションを選択して
「新規作成」アイコンをクリックすると新規構成が作られる。。

名前は自分が識別できるもの、今回は”CentOS65″にしてみた。
PHPサーバのところで「新規」ボタンを押して「PHPサーバの作成」ウィンドウを表示させ、
ここにサーバの名前(ここもCentOS65にした)、ベースURLに`http://198.168.33.10`を入力。
「次へ」を選択するとパスマッピングの設定を要求される。

ここではサーバ上のファイルのパスと、クライアント側のパスを設定する。
今回でいえば共有ディレクトリを指定すればいい。

サーバー上のパス : /var/www/html
ローカル・パス : 共有ディレクトリまでのフルパス(今回で言えばshareまでのもの)

入力ができたらOKでPHPサーバの作成ウィンドウを閉じて実行構成にもどる。
続けて「ファイル」部に`/XDebug_test/public/index.php`と入力、
URLの部分の「自動生成」のチェックボックスを外して

URL : [http://192.168.33.10/] [index.php]

と入力する。自動生成でもいいのかも。
参考にしたサイトで直接指定していたのでマネしてみた。

`/XDebug_test/public/index.php`というパスは、
今回のテストの為に作ったプロジェクトのもの。
XDebug_testがプロジェクト名で、プロジェクト直下にpublicというフォルダを作って、
直下にindex.phpを置いた形。

続いて「デバッガー」タブを開き、
「サーバー・デバッガー」を「XDebug」にして、「構成」ボタンで設定を開き、
デバッグ・ポートが9000になっていることを確認する。
このポートはxdebugの設定で指定したものと同じにする。

最後に「ブレークポイント」のところで「最初の行でブレーク」にチェックをいれて完了。
「デバッグ」を押してみる。

Eclipseのパースペクティブが
「デバッグ」に切り替わってデバッグが開始されたことが分かる。

今回の手順は以下のサイトを特に参考にした。
画像つきで分かりやすいのでこっちを見たほうがいいかも。

画像入れようと思ったけど
少々現在の環境的に面倒なのでやめた。

Mapple Blog – 開発効率UP!Eclipse + Xdebug で PHP のステップ実行をしよう

ステップ実行してみる

適当にindex.phpにこんな感じで書いてみる。

<h1>Hello Vagrant!</h1>

<?php
	$a = 2;
	$b = 3;

	$c = $a + $b;
	echo $c;
?>

これでデバッグを開始すると、
まずプログラムの開始h1のところでブレークする。
その後F5を押すことでステップインで1行ずつ実行できる。

終了するには赤い四角のアイコンをクリックするか、
メニューから「実行」→「終了」をクリックすればいい。

デバッグを開始するとパースペクティブがデバッグに切り替わってしまうので、
元のエディタに戻りたい場合はパースペクティブをPHPに戻す。

2015-05-11_081039

参考サイト

http://maplesystems.co.jp/blog/all/programming/4258.html
http://slumbers99.blogspot.jp/2011/12/eclipse-xdebug-php-php-advent-calendar.html
http://www.1×1.jp/blog/2014/08/how-to-setup-php-remote-debug-with-vagrant-vm.html
http://keicode.com/cgi/debugger-enhancement-with-xdebug.php
http://keicode.com/cgi/setup-eclipse-pdt.php

Posted on 5月 11, 2015 at 08:10 by 伊崎 · Permalink · Leave a comment
In: PHP · Tagged with: ,

【Windows】PHP + Vagrant + Eclipse + XDebugでWEBアプリケーション開発環境構築 #06 – プロビジョニングとPHPインストール

WEBサーバを自動起動させる

前回Apache(httpd)をインストールしたが、
このままでは仮想マシンを起動するたびに、手動でサービスを起動させる必要がある。
これは面倒なので、仮想マシンの起動時に勝手に起動するように設定する。
それをプロビジョニングというらしい。

この設定もVagrantfileに記述するだけ。

  # config.vm.provision "shell", inline: <<-SHELL
  #   sudo apt-get update
  #   sudo apt-get install -y apache2
  # SHELL

Vagrantfileの下の方にこんな記述があるので
以下のように変更する。

   config.vm.provision "shell", inline: <<-SHELL
      sudo service httpd start
   SHELL

プロビジョニングでは別ファイルに書いたシェルスクリプトを指定することも出来るが、
このくらいなら直接書いてしまった方が余計なファイルが増えずにいいかなと思う。

これでいったんVagrantを落として再起動してみる。

vagrant halt ←停止
vagrant up ←起動

手動でサービスを実行せずにブラウザで192.169.33.10にアクセスしてみて
問題なく繋がればおっけい。

PHPインストール

今度は端末エミュレータで仮想マシン側での作業。

$sudo yum -y install php php-mbstring php-mysql

viなりnanoでコンフィグファイルを編集する。

$sudo vi /etc/httpd/conf/httpd.conf

変更箇所は次のとおり。

詳しくはコチラのサイトを参考にさせて頂いた。
CentOSサーバー構築マニュアル – Apache2 PHP5 インストール

設定ファイルの変更が終わったらApacheを再起動する。

$sudo service httpd restart

その後、PHPが使えるようになったかを確認する。
PHPの情報を出力させるコードをinfo.phpとしてドキュメントルートに出力する。

$ echo "<?php phpinfo(); ?>" > /var/www/html/info.php

ブラウザでhttp://192.168.33.10/info.phpへアクセスし、
PHPの情報が出力されれば完了。

参考サイト

http://qiita.com/nobu_blast/items/aed1a9c780737b51b510
http://centos.server-manual.com/centos5_apache2_php5.html

Posted on 5月 11, 2015 at 07:28 by 伊崎 · Permalink · Leave a comment
In: PHP · Tagged with: 

【Windows】PHP + Vagrant + Eclipse + XDebugでWEBアプリケーション開発環境構築 #05 – 仮想マシンの設定

固定IPでアクセスする

現在でも127.0.0.1でアクセスできているが、
Vagrantでは固定IPでアクセスすることができる。

設定はVagrantfileで行う。
Vagrantfileはクライアント側にあるので適当なエディタで開く。

config.vm.network "private_network", ip: "192.168.33.10"

途中の行でコメントアウトされている上記行を有効にして
Vagrantを再起動する。

vagrant reload

Vagrantfileは記述が間違っていたりすると
エラーがでて起動できなくなることがあるので注意。

問題なければ改めてVagrantfileで指定したIPに対して
SSH接続を試みる。

僕の場合は、ここで指定したIP(192.168.33.10)でアクセスできなくて少し詰まった。
少し前のバージョンだとCentOS7でそうした設定が有効にならないバグがあったらしいが、
現在では修正されている。

よく分からなくて時間を開けてやってみたら普通に繋がった。
どこかの記述が間違っていたのかもしれない。
ちなみにポートは22(SSH)でOK。

共有ディレクトリの指定

Vagrantによる開発が簡単な理由のひとつ。
Vagrantでは共有ディレクトリが指定できる。

共有ディレクトリを有効にすると、
クライアント環境と仮想マシンの中の一部のディレクトリを共有できる。
つまり簡単に言ってしまえば仮想マシンの中のディレクトリを、Windowsから触れるということ。
仮想マシン内にApacheなどでWEBサービスを立ち上げて、
ドキュメントルートを共有ディレクトリに指定すると、
Windows側で普通にファイルの増やしたり消したりできる。

実行の確認はブラウザで仮想マシンに繋げばいいだけ。
設定もVagrantfileでパスを指定するだけでいい。

config.vm.synced_folder "./share", "/var/www/html"

変更するのは`config.vm.synced_folder`の行。
僕は今回上記のように設定した。

最後にVagrantを再起動することを忘れずに。

vagrant reload

Apacheのインストール

端末エミュレータを使ってSSHでログインした仮想マシンの方。

$sudo yum -y install httpd
$ sudo chkconfig httpd on
$ sudo service httpd start

これでWEBサーバが起動する。
WEBサーバのデフォルトのドキュメントルートである/var/www/htmlは
クライアント(windows)側の./shareと同期している。
クライアント側でVagrantfileのあるディレクトリにshareというディレクトリを作成し、
その中に適当なindex.htmlを配置してみる。
内容は「hello world」でもなんでもいい。

これで仮想マシン側の/var/www/htmlディレクトリを確認すると、
クライアント側で追加したhtmlファイルが存在していることが分かる。

ls -la /var/www/html

これでクライアント側のPCでブラウザを開き、
「http://192.168.33.10/」にアクセスすると、
先ほど追加したhtmlファイルが表示されることが確認できる。

参考サイト

http://qiita.com/hiroyasu55/items/11a4c996b0c62450940f
https://ie.u-ryukyu.ac.jp/e115720/2014/07/20/vagrant%E3%81%AE%E3%83%8D%E3%83%83%E3%83%88%E3%83%AF%E3%83%BC%E3%82%AF%E8%A8%AD%E5%AE%9A%E3%82%92%E8%A6%8B%E3%81%A6%E3%81%BF%E3%82%88%E3%81%86%E3%80%82/

Posted on 5月 10, 2015 at 21:21 by 伊崎 · Permalink · Leave a comment
In: PHP · Tagged with: 

【Windows】PHP + Vagrant + Eclipse + XDebugでWEBアプリケーション開発環境構築 #04 – 仮想マシンの準備

仮想マシンを準備する

PHPを動かすために簡易的なWEBサーバを仮想マシンで用意する。

Boxの取得と登録

通常、VirtualBoxで仮想マシンを作るには、
VirutalBoxを立ち上げて仮想ディスクを作ったり、インストールが必要となる。
しかしVagrantを使うことでVirutalBoxに一切触らずに、各種操作が可能となる。

コマンドプロンプトを開き、まずは次のように入力してみる。

vagrant -v

vagrantのバージョンが表示されればOK。
コマンドが無いとか言われた場合はVagrantがきちんとインストールできていないか、
インストール後の再起動を忘れてる。

問題なければ次のようにコマンドを実行する。

vagrant box add CentOS65 https://github.com/2creatives/vagrant-centos/releases/download/v6.5.3/centos65-x86_64-20140116.box

Vagrantの操作は全て`vagrant`の後にコマンドを指定して実行する。
今回のコマンドは、ネットから仮想マシンのテンプレートとなるBoxファイルをダウンロードし、
Vagrantの管理ファイルとして追加するためのもの。

`CentOS65`の部分は好きな名前でいい。
これは後にBoxから仮想マシンを作る際の名前となる。
とはいえHogeとかFooとか意味の無い名前にすると、
なんのディストリビューションのBoxなのかが分からなくて面倒かもしれない。

名前の後のURLは、Vagrantboxesというサイトで公開されているBoxファイルのURL。
VagrantのBoxファイルは誰でも簡単に作ることができる。
多くのOSのBoxファイルは、こうしてVagrantboxesに誰かが作ったものが公開されている。

そうそうは無いと思うけれど、
製作者がどんな設定でBoxファイルを作ったかはパっと見では分からないので使用に関しては自己責任。
OSのイメージをダウンロードするようなものなので多少時間がかかる。

仮想マシンの作成、実行

Boxファイルのダウンロードが終わったら仮想マシンを作る。
適当な空のディレクトリをつくり、コマンドプロンプトでそのディレクトリへ移動する。

mkdir CentOS65
cd CentOS65

作成したディレクトリで仮想マシンを初期化する。

vagrant init CentOS65

ここで指定する名前がBoxのダウンロード、追加時につけた名前となる。
忘れた場合は`vagrant box list`で一覧が見られる。

初期化に成功すると、空だったディレクトリにVagrantの設定ファイルが追加される。

dir
  .
  ..
  .vagrant
  Vagrantfile

Vagrantfileが設定ファイル。

仮想マシンを起動してみる

仮想マシンの起動は以下のコマンドで行う。
起動を行うときはVagrantfileのある仮想マシンのディレクトリでupコマンドを実行すること。

vagrant up

SSHでアクセスしてみる

端末エミュレータで仮想マシンにSSHでアクセスしてみる。

Vagrantfileのあるディレクトリで以下のコマンドを実行する。

vagrant ssh

すると以下のようにSSHアクセスのための情報が表示される。

Host: 127.0.0.1
Port: 2222
Username: vagrant
Private key: ほにゃらら

端末エミュレータに情報を設定してログインしてみる。
Vagrantのパスワードは基本的にvagrantに統一されているらしい。

vagrantアカウントでログインできればおっけい。

参考サイト

http://www.vagrantbox.es/
http://qiita.com/sugard12/items/85b2e70c87a354675a0e

Posted on 5月 10, 2015 at 18:36 by 伊崎 · Permalink · Leave a comment
In: PHP · Tagged with: 

【Windows】PHP + Vagrant + Eclipse + XDebugでWEBアプリケーション開発環境構築 #03 – 色々インストール

入れるもの


気をつけること

特になし。

全部適当に最新版でOK。
WindowsではデフォルトでSSHクライアントがないそうなので
Vagrant内で作業をするためにRloginなどの端末を入れる。
Teratermとかでもいい。

システムドライブの空き容量に余裕がない場合は、
環境変数VAGRANT_HOMEを設定しておくと後でラク。
ユーザ環境変数でいい。

パスはVagrantのテンプレートファイルなどが置かれる場所となる。
それなりにサイズがあるので変えておいた方が無難かもしれない。
数GBとか普通に使う。

Posted on 5月 10, 2015 at 17:57 by 伊崎 · Permalink · Leave a comment
In: PHP

【Windows】PHP + Vagrant + Eclipse + XDebugでWEBアプリケーション開発環境構築 #02 – Eclipseの設定周り

Eclipseのインストール

今回の目的はPHPのコーディング、及びデバッグなので
Pleiades All in Oneの最新版、Eclipse4.4 Lunaの
PHP版Full Editionをダウンロードする。

展開して任意のディレクトリの配置する。
プレアデスなのでデフォルトで日本語。

テーマを変更する

EclipseデフォルトのUIは少々味気ないのでこれを変更する。
テーマは「Eclipse Marketplace」でテーマをインストールすることができる。

「ヘルプ」メニューから「Eclipse マーケットプレイス」を起動する。

マーケットプレイスがない場合

マーケットプレイスはデフォルトで入っていないことがあるらしい。
その場合は、「新規ソフトウェアのインストール」から追加する必要がある。

インストールウィンドウで作業対象のリストから現在使用しているバージョンを選択。
今回はLunaを使っているので

作業対象: Luna – http://download.eclipse.org…略

少し待っていると一覧が表示されるので、
その中から「マーケットプレイス クライアント」を選択し、インストールする。

その後Eclipseを再起動すると、
ヘルプメニューにマーケットプレイスが追加される。

テーマを追加

マーケットプレイスを起動し、検索部分に「color scheme」と入力する。
すると「Eclipse Color Theme」というプラグインが表示されるので追加。
更に「Eclipse Moonrise UI Theme」も入れる。

再起動後に「ウィンドウ」メニューから「設定」、
「一般」→「外観」を選択すると追加したテーマが選べるようになっているので
今回の場合でいえば「MoonRise」を選択、適用する。
これでウィンドウ周りが黒っぽい感じになって目に優しくなる。

ただしこの状態ではソースコードのハイライトは非常に見づらいので
そちらも変更しておく。

ソースコード(PHP)の色を変更する

先ほどの設定画面から、「外観」の横をクリックすると更に細かいメニューが表示される。
そこで「色テーマ」を選択すると、エディタ部の配色を変更できる。

今回は「Gedit Original Oblivion」にしてみた。
好みの問題なのでどれでもOK。ネットからファイルを拾ってきてインポートとかもできる。

ソースコード(PHP)のフォントを変更する

ためしにPHPのコードを開いてみると分かるが、
デフォルトのフォントは少し小さかったり見づらかったりする。

そこで同様に「外観」の中の「色とフォント」メニューから
フォントの種類とサイズを変更する。

ここではPHPという表示があるものの、選択・変更ができないが、
そちらは無視して「構造化テキスト・エディター」の方を選択、
こちらは中身があるので、「構造化テキスト・エディタ のテキスト・フォント」を選択し、
「編集」ボタンをクリック。見慣れたフォント選択画面がでるので設定する。

今回は「Ricty Diminished」を選択した。
これはプログラミング用のフォントとして公開されているもので、別途インストールしたもの。
フォントのサイズは12に設定した。

適用して完了。

不要なウィンドウ、アイコンを消す

新しい環境を導入する場合、できることが多すぎると混乱する。
余計なウィンドウやアイコンは消してしまったほうがエディタも見やすいし、
コードをみるスペースも広くとれていい。

とりあえず必要なさそうなウィンドウは全部閉じてしまう。
閉じたって「ウィンドウ」メニュー辺りから再度表示させられる。
ある程度慣れてきてからそういうのは増やしていけばいい。

とりあえず必要そうなのはエクスプローラとエディタ部分くらい。

画面上部に表示されているアイコンもゴチャゴチャしていて分かりにくい。
おそらく表示させておいても使わないものの方が多いと思うので入らないものは消す。
コンソールなんかは最小化でもしておけばいい。

アイコンを消すには「ウィンドウ」メニューから「パースペクティブのカスタマイズ」を選択する。
あとは必要そうなもの以外チェックを外せばいい。
今回は「デバッグ」、「起動」、「エディター表示」、「ナビゲート」のみにした。

そんな感じで設定した画面がこんな感じ。

2015-05-10_174205

初めに比べるとかなりスッキリした感じ。

参考にさせて頂いたサイト

http://mergedoc.sourceforge.jp/
http://qiita.com/hshimo/items/6a8cefb5d8cee536d661
http://qiita.com/shohe_i/items/e0a7672dc82db9a4c9c3
http://lab.adn-mobasia.net/?p=3195
http://oshiete.goo.ne.jp/qa/6918452.html
http://d.hatena.ne.jp/satoshis/20140502/p1

Posted on 5月 10, 2015 at 17:41 by 伊崎 · Permalink · Leave a comment
In: PHP · Tagged with: 

【Windows】PHP + Vagrant + Eclipse + XDebugでWEBアプリケーション開発環境構築 #01 – 準備

Vagrantとは

簡単に言ってしまえば、VirtualBoxをCUIでコントロールできるようにしたラッパーツールのようなもの。
これを使うことで仮想環境の構築がかなりラクになる。

XDebug

PHPのライブラリとして提供されるデバッグツール。
本来インタプリタ型でサーバー側で一括処理されてしまうPHPのプログラムを
ステップ実行やスタックトレースできるようにするためのもの。

PHP5.6からはphpdbgという別のデバッグツールが提供されるらしいけれど、
今はあまり情報が少ないようなのでひとまずはXDebugでやってみようと思った。

Eclipse

いわずと知れたクロスプラットフォームなIDE。
XDebugはSublime TextやVimなどでもデバッグできるらしいが、
やはり流石は統合開発環境。実際のデバッグ時に一番操作がしやすそうだったので
改めてEclipseに手を出してみることにした。

Eclipseってちょくちょく使おうとするけれど、
結局面倒で普通のエディタでいいやってなって、
これまでガッツリ使ったことがなかった。

本当はVimでやってみようかとも思ったけれど、
新しいものにばかり一度に手を出すと何かあったとき面倒なので
多少なりとも触ったことのあるものをと考えたのも理由の一つ。

基本的な挙動

PHPはサーバ側で実行されるものなので、
ステップ実行するといってもスタンドアロンでデバッグすることはできない。
そこでサーバ側(今回は仮想環境)側にXDebugを、クライアント側にEclipseを入れて、
DBGp(common debugger protocol)を使って通信が行われる。

大まかにやること

Posted on 5月 10, 2015 at 17:04 by 伊崎 · Permalink · 2 Comments
In: PHP