初めまして、t_endoです。
今回は初心に戻って、ローカルPCに開発環境を作成したいと思います。
インストール
まずApacheとPHPをインストールするのですが、個別にインストールしても良いのですが、
XAMPPというソフトがApache、MySQL、PHP、Perlをインストールしてくれるので、
今回はXAMPPをインストールしていきます。
といっても、XAMPPのインストールはとても簡単で、こちらからソフトをダウンロードして、Nextを押していればインストール完了です。
XAMPP公式ページ
※今回使用するバージョンは1.8.3となっています。
インストールが完了すると、XAMPP Control Panelという物がインストールされているので、起動すると下記の様なコントロールパネルが起動します。
さっそく、Apacheを起動してみましょう。(ApacheのStartボタンを押すと起動します)
あれっ、一瞬起動したっぽいのですが、すぐに落ちてしまいました。
各種ステータスはコントロールパネルの下に色々表示されているので見てみると、
12:47:34 [Apache] Status change detected: running 12:47:34 [Apache] Status change detected: stopped 12:47:34 [Apache] Error: Apache shutdown unexpectedly. 12:47:34 [Apache] This may be due to a blocked port, missing dependencies, 12:47:34 [Apache] improper privileges, a crash, or a shutdown by another method. 12:47:34 [Apache] Press the Logs button to view error logs and check 12:47:34 [Apache] the Windows Event Viewer for more clues 12:47:34 [Apache] If you need more help, copy and post this 12:47:34 [Apache] entire log window on the forums
このようなエラーがでいました。
どうやら、Apacheで設定しているport(80、443)が既に使用されている為、起動できなかったみたいです。
どのソフトがどのportを使っているのかを調べる物もコントロールパネルに付いているので、さっそくチェックしてみます。
「Netstat」というボタンを押すとその時使用しているportとソフト一覧を表示してくれます。
どうやら、Skypeが80、443portを使用しているみたいです。
そういえば、コントロールパネルを起動した時に下記の様なエラーがでてました。
※画像にも、一部入っていました…
12:58:05 [Apache] Problem detected! 12:58:05 [Apache] Port 80 in use by "C:\Program Files (x86)\Skype\Phone\Skype.exe" with PID 3308! 12:58:05 [Apache] Apache WILL NOT start without the configured ports free! 12:58:05 [Apache] You need to uninstall/disable/reconfigure the blocking application 12:58:05 [Apache] or reconfigure Apache and the Control Panel to listen on a different port 12:58:05 [Apache] Problem detected! 12:58:05 [Apache] Port 443 in use by "C:\Program Files (x86)\Skype\Phone\Skype.exe" with PID 3308! 12:58:05 [Apache] Apache WILL NOT start without the configured ports free! 12:58:05 [Apache] You need to uninstall/disable/reconfigure the blocking application 12:58:05 [Apache] or reconfigure Apache and the Control Panel to listen on a different port
Skypeのツール→設定→詳細→接続の「上記のポートに代わり、ポート80と443を使用」のチェックを外して、skypeを再起動します。
再度コントロールパネルからApacheを起動してみます。
今度は無事起動しました。
「Admin」ボタンを押して、下記画面が表示されたら、インストール完了です。
設定
VirtualHostの設定をしていきます。
インストールしたフォルダ(今回インストールしたフォルダ「C:\xampp」)に「apache\conf\extra\httpd-vhosts.conf」というファイルを変更していきます。
##NameVirtualHost *:80
↓コメントを外します
NameVirtualHost *:80
##<VirtualHost *:80> ##ServerAdmin webmaster@dummy-host.example.com ##DocumentRoot "C:/xampp/htdocs/dummy-host.example.com" ##ServerName dummy-host.example.com ##ServerAlias www.dummy-host.example.com ##ErrorLog "logs/dummy-host.example.com-error.log" ##CustomLog "logs/dummy-host.example.com-access.log" common ##</VirtualHost>
↓コメントを外し、自分にあった設定に変更していきます
<VirtualHost *:80> ServerAdmin webmaster@dummy-host.example.com DocumentRoot "C:/xampp/htdocs/endotest" ServerName endo.localhost.net ServerAlias endo.localhost.net ErrorLog "logs/endo.localhost.net-error.log" CustomLog "logs/endo.localhost.net-access.log" common </VirtualHost>
- ServerAdmin:公開するわけではないので特に変更しません
- DocumentRoot:ここのディレクトリがブラウザでアクセスした時にアクセスされるフォルダになります
- ServerName:URLのホストになります
- ServerAlias:URLのエイリアスになります
- ErrorLog:エラーログの出力先になります
- CustomLog:アクセスログの出力先になります
保存して、Apacheの再起動をします。
「ServerName」で設定したURLでアクセスができるように、Windowsの設定を変更します。
「C:\Windows\System32\drivers\etc\hosts」ファイルを編集していきます。
※Windows Vista以降このファイルを変更する場合は、 メモ帳等を右クリック→管理者として実行で起動したのち、ファイルを開かないと保存できません。
# 127.0.0.1 localhost
↓コメントアウトを外し、ServerNameで設定した物を追加
127.0.0.1 localhost endo.localhost.net
とりあえず、「DocumentRoot」で設定したフォルダへphpinfoでも置いておきます。
「C:\xampp\htdocs\endotest\index.php」
<?PHP phpinfo(); ?>
それでは、ブラウザで設定したURLへアクセスしてみます。
無事phpinfoの画面が表示されました。
以上で簡単なXAMPPの設定でした。
Eclipse
開発環境が完成したので、Eclipseをインストールしていきたいと思います。
といっても、こちらもダウンロードしてきて解凍してあげれば、インストール完了です。
私は英語がまったく駄目なので、日本語化した物を入れていきます。
自分で日本語化のプラグインを入れてもいいのですが、下記の場所に日本語化したEclipseが既にあるので、そちらを使用します。
Pleiades All in One ダウンロード
※今回使用するバージョンはEclipse 4.3.2 Kepler(PHP環境のみ、64bit、Standard Edition)となっています。
Eclipseを解凍して起動した時に、下記の様なエラーが出た場合は、JRE、JDKが入っていないので、下記URLからダウンロードしてインストールします。
Eclipseを起動するとワークスペースの選択という物が表示されますが、これは作業用のフォルダみたいなものでEclipseで作成したファイル等がここで選択した場所に作成されます。
ここをXAMPPで設定したDocumentRootに設定してもいいのですが、今回は別の所を選択し後で説明するプラグインでワークスペースからDocumentRootへコピーするようにします。
文字コード等設定
「ウィンドウ」→「設定」
「一般」→「エディタ」→「テキスト・エディタ」
表示されるタブ幅:4
タブでスペースを挿入:チェック
「一般」→「ワークスペース」
テキスト・ファイルのエンコード:その他「UTF-8」
新規テキスト・ファイルの行区切り文字:その他「Unix」
プロキシーの設定
「ウィンドウ」→「設定」
「一般」→「ネットワーク接続」
アクティブ・プロバイダー:マニュアル選択
スキーマ:必要なスキーマへ、ホストとポートを設定して適用を押して設定完了です。
FileSyncプラグイン
ワークスペースからDocumentRootへ手作業でファイルをコピーしたり、httpd-vhosts.confを毎回編集するのは効率が悪いので、自動でコピーしてくれるプラグインをインストールします。
「ヘルプ」→「新規ソフトウェアのインストール」
「作業対象の追加ボタンを押す」
名前:FileSync(分かりやすい名前ならなんでも大丈夫です)
URL:http://andrei.gmxhome.de/eclipse/
OKを押すと、作業対象の所に登録した物が表示されるので、それを選択すると下の一覧画面にインストールできるソフト一覧が表示されます。
Eclipse 3.5 - 4.3 plugins→FileSyncを選択して「次へ」のボタンを押していきEclipseの再起動をします。
「ヘルプ」→「Eclipse プラットフォーム について」を押して下記画像の四角でかこってあるアイコンが表示されていればインストール完了です。
FileSync設定
FileSyncのテストをする前に、プロジェクトがないので作成します。
「ファイル」→「新規」→「PHPプロジェクト」
プロジェクト名を入力して、「完了」を押せとプロジェクトが作成されます。
さらに、PHPファイルを作成します
先ほど作成したワークスペースを右クリックして、「新規」→「PHPファイル」
ファイル名を入力して、「完了」を押すとPHPファイルが作成されます。
PHPファイルが作成できましたら、ワークスペースを右クリックして、「プロパティー」→「ファイル同期化」を選択します。
- プロジェクトの FileSync ビルダーを使用可能にするにチェックを入れます
- 使用可能な同期化マッピングへ「フォルダーの追加」ボタンを押し、コピー元のフォルダを追加します
- デフォルトのターゲット・フォルダーへコピー先のフォルダを選択します。(DocumentRootで設定した"C:/xampp/htdocs/endotest"を選択します)
設定が終わりましたら、「OK」ボタンを押します。
一度設定したフォルダのファイルを全部コピーしたいので、ワークスペースを右クリックして、「強制ファイル同期化」を押してみましょう。
これで、先ほど作成したPHPファイルがDocumentRootへコピーされています。
さらに、「プロジェクト」→「自動的にビルド」のチェックが入っていると、PHPを編集して保存した時に自動的にコピーしてくれるようになります。
私が使用している、ローカルPCでの開発環境こんな感じになっています。
みなさんも、Eclipseを自分の使いやすいようにカスタマイズしてよいEclipseライフを楽しんでください。