VS CodeからPHPアプリをローカル実行/デプロイ!Visual Studio Code+PHPの可能性を探る(1/3 ページ)

VS CodeからPHPアプリをホスト可能な拡張機能やWebサーバへのデプロイに使える拡張機能などを紹介。

» 2018年09月25日 05時00分 公開
[かわさきしんじInsider.NET編集部]
「Visual Studio Code+PHPの可能性を探る」のインデックス

連載「Visual Studio Code+PHPの可能性を探る」

 前回は、PHPコードの記述を支援する拡張機能を紹介した。今回は、前回に紹介しきれなかった拡張機能をさらに幾つか取り上げることにする。

PHP Server拡張機能

 PHP Server拡張機能は、現在開発しているPHPアプリをローカル環境でホストしてくれる拡張機能だ。Webサーバが公開しているフォルダ(例えば、本連載で使用しているXAMPPなら、XAMPPのインストールフォルダにあるhtdocsフォルダ)以下で開発を進めるということはないだろう(と言いながら、前回はサンプルということもあり、そうした作りをしていたが)。Webサーバの管理下にないフォルダでPHPアプリの開発/デバッグなどを行い、それを何らかの手段でサーバへデプロイするといった場合に、アプリの挙動を手軽に確認したいことがあるはずだ。そのような場合に、この拡張機能が役立つ。

PHP Server拡張機能 PHP Server拡張機能

 この拡張機能をインストールすると、VS Codeのウィンドウ右上に[PHP Server: Serve Project]ボタンが表示されるようになる。

[PHP Server: Serve Project]ボタン [PHP Server: Serve Project]ボタン

 ボタンの名前から分かる通り、このボタンをクリックすれば、PHPアプリがローカルにホストされる。注意点としては、VS Codeのエディタでアクティブになっているファイルを含んだURLでブラウザが開かれる点だ。何らかのHTMLファイルをアクティブにした状態で、このボタンをクリックするようにしよう。

 あるいは、コマンドパレットから[PHP Server: Serve Project]コマンドを実行するか、エディタを右クリックしてコンテキストメニューから[PHP Server: Serve Project]を選択してもよい。

 ここでは、前回見たアプリを基にしたアプリを、XAMPPの管理下にはないフォルダに作成して(C:\project\vscodephp\vscodephp_03フォルダ)、PHP Serverを利用してみよう。

C:\project\vscodephp\vscodephp_03フォルダでPHPアプリを記述 C:\project\vscodephp\vscodephp_03フォルダでPHPアプリを記述
ポップアップを見ると分かる通り、XAMPP管理下のフォルダ(C:\xampp\htdocs\vscodephp_03など)とは異なるフォルダにプログラムファイルが置かれている。

 この状態で、[PHP Server: Serve Project]ボタンをクリックする(あるいはコンテキストメニューやコマンドパレットから該当するコマンドを実行する)と、デフォルトではlocalhost:3000でPHPアプリがホストされる。

PHP Serverを起動
PHP Serverを起動
PHP Serverがホストを開始したことを示すメッセージがウィンドウ下部に表示される
PHP Serverがホストを開始したことを示すメッセージがウィンドウ下部に表示される
エディタでアクティブになっていたファイルがlocalhost:3000で開かれる
エディタでアクティブになっていたファイルがlocalhost:3000で開かれる

PHP Serverを起動
[PHP Server: Serve Project]ボタンをクリックしてもよいし、エディタを右クリックしてコンテキストメニューの[PHP Server: Serve Project]を選択してもよい(コマンドパレットを使ってももちろん構わない)。


 PHP Serverを終了するには、エディタを右クリックしてコンテキストメニューから[PHP Server: Stop]を選択するか、コマンドパレットから[PHP Server: Stop]コマンドを実行する(残念ながら、[PHP Server: Serve Project]ボタンがホストを終了するボタンに変化することはない)。

 PHP Server拡張機能を使えば、ローカル環境で開発しているPHPアプリの動作確認を簡単に行えることは分かった。次は、これをWebサーバにデプロイする機能が必要になる。

       1|2|3 次のページへ

Copyright© Digital Advantage Corp. All Rights Reserved.

スポンサーからのお知らせPR

注目のテーマ

Microsoft & Windows最前線2025
AI for エンジニアリング
ローコード/ノーコード セントラル by @IT - ITエンジニアがビジネスの中心で活躍する組織へ
Cloud Native Central by @IT - スケーラブルな能力を組織に
システム開発ノウハウ 【発注ナビ】PR
あなたにおすすめの記事PR

RSSについて

アイティメディアIDについて

メールマガジン登録

@ITのメールマガジンは、 もちろん、すべて無料です。ぜひメールマガジンをご購読ください。