Webサイト制作【3】 Visual Studio Code準備編
JavaScript学習の一環として、Webサイト制作の練習もやってみます。
今回は、プログラムを書くツールを準備します。
以前用意した「Visual Studio Code」に、PHP用の設定を追加してみます。
用語
統合開発環境、IDE (Integrated Development Environment) は、ソフトウェアの開発環境。
従来、コンパイラ、テキストエディタ、デバッガなどがばらばらで利用していたものをひとつの対話型操作環境(多くはGUI)から利用できるようにしたもの。
最近のIDEには、GUIアプリケーション開発のための迅速なプロトタイピング (RAD) が可能なものが多い。
統合開発環境を使うことによって、巨大かつ複雑なソフトウェアでも、作成者に負担をかけることなく開発することが可能になる。
ゴスリング氏は最近のコンパイラや開発環境の進化について触れ、「もうテキストエディタを使ってはいけない。NetBeansを使ってほしい」と語りかけた。
ジェームズ・アーサー・ゴスリン(James Arthur Gosling、1955年5月19日 - )はソフトウェア技術者であり、元サン・マイクロシステムズ社のフェローである。
オブジェクト指向プログラミング言語Javaの生みの親として広く知られている。
Javaを作ったジェームズ・ゴスリン氏は、プログラミングのツールとして、テキストエディターよりもIDEの使用を推奨しています。
テキストエディターでもOKですが、IDEが利用可能な場合は是非活用しましょう。
Visual Studio Code
Visual Studio Code(VS Code)は、マイクロソフトが開発している無料のソースコードエディターです。
Windows, Linux, macOS 上で動作し、シンプルなIDEとして使えます。
VS Codeで、PHPを便利に利用するための設定を追加します。
PHPの実行ファイルを指定
Visual Studio Codeで、PHPのファイルを編集していたら、以下のような警告文が表示されました。
Cannot validate since no PHP executable is set. Use the setting 'php.validate.executablePath' to configure the PHP executable.
検索したら、修正方法が紹介されていました。
変更の手順
(※以下の説明は、Visual Studio Code バージョン 1.10.2の場合となります。)
(1) VS Codeで、[ファイル] → [基本設定] → [設定] を開きます。
すると、「settings.json」というVisual Studio Codeの設定ファイルが開きます。
(2) 上記画面の右側が「ユーザー設定」を追記する部分です。
ユーザー設定の欄に、以下のようなJSONを追記して、保存します。
- XAMPPの中にあるPHPの実行ファイル(php.exe)の場所を指定
- バックスラッシュ「\」(日本語キーボードだと半角の「¥」マーク)は、1個だとなぜか動作しないようだったので、2個に重ねました。
- 「\」はエスケープが必要な特殊記号の扱い?=「\\」に変更
コンピューティングや通信において、エスケープ文字(escape character)とは、それに続く文字について別の解釈をすることを示す文字である。
エスケープ文字は、メタ文字の特定のケースである。
通常、何がエスケープ文字であるか、またはそうでないかは、前後関係に依存する。
JavaScriptでは \(バックスラッシュ)をエスケープ文字として使用する。
- JSONの中で「\」はエスケープ文字(特殊記号)として扱われるため「\」の一文字では意味をなさない。
- 「\」自身を表示したいときは、「\」を「\」でエスケープする=2個重ねて「\\」と書けば、通常の文字としての「\」として表示できる(扱える)。
注意深く見ないと、こういう所ではまりますね?(面倒)
【追記】 2017年4月10日
Visual Studio Codeの設定ファイル(JSON)で、不足がありました。
"php.executablePath"という項目も設定が必要でした。
訂正後の設定内容は、以下のようになります。(一番下の行が追加された)
【追記】ここまで
PHPのコーディングに役立つプラグイン(拡張機能)もいろいろあるようなので、調べて便利そうなやつを適当に入れてみましょう
→ visual studio code php - Google 検索
- Code Runner - Visual Studio Marketplace …コードスニペット(入力補助)
- PHP Debug - Visual Studio Marketplace …デバッガー
- PHP IntelliSense - Visual Studio Marketplace …コード入力候補
- PHP Code Format - Visual Studio Marketplace …コード整形
などのプラグインが人気のようです。
Visual Studio CodeでPHPの設定ができたら、さっそくプログラミングしてみましょう!