Visual Studio CodeでPHP開発しよう
さて2015年4月にあのMicrosoftから登場、進化し続けているエディタのVisual Studio Code略してVSCode, VSC。徐々に人気を博して現在では実際の開発の現場でも、プログラミングに入門している方でも使っている方は多いと思います。各プログラム言語のサポートもどんどん進んでいますが、言語によってサポートの度合いには差がありました。
僕もPHPではLaravelを使ったり自作フレームワークを使ってチーム開発する際、アーキテクトっぽい人として開発標準やアーキテクチャを定めてプロジェクトをリードしたり開発したりしていきます。その際の開発ツールはEclipse＋PDTプラグインかVSCodeの2択、とすることが多かったです。
ある程度以上の規模の開発になってくるとコードベースのクラス数も増えてきて、use文の名前空間を含めた補完、クラス名やメソッド名タイプ時の補完、引数の補完、メソッド定義元への正確なジャンプ……などが重要になってきます。インストールしただけのVSCodeに比べるとPleiadesパッケージから落としてきたEclipse+PDTの構成は最初からこのへんがかなり効くので、なんだかんだけっこう優秀だよな……という感じでした。
(※なおJetBrains社のPHP専用IDEである PhpStorm もかなり優秀という話もよく見聞きするのですが、有償のため当方では未確認です。PHPStorm使いの方スミマセン。
またAdobeファミリー製品が多かったりWeb制作寄りのところではAdobe Bracketsを使うパターンもあるのでしょうか。こちらも未確認のため除外です。)
このように、VSCode自体は進化し続けているもののPHP周りのサポートは他の言語に比べていまひとつという感じが数年前はありました。
しかし2020年の最近改めて調べたところ、拡張機能周りもだいぶ揃ってきてVSCodeでのPHP開発環境はもう十分に整ってきたのが分かりました。このエントリでは、PHP開発環境を整えるためのVSCodeのおすすめ拡張機能や最近の定番のものを、開発の現場の視点から紹介していこうと思います。
Visual Studio CodeのExtensionは日本語では「拡張機能」「エクステンション」「プラグイン」などと呼ばれますが同じものを指しています。似た名前の拡張機能もあって紛らわしい場合もあります。ひどいものになると完全に同じ名前のものもあります。
一部の例外を除き、基本的にはVSCodeの画面の雲アイコンのダウンロード数が多いものを選べば大丈夫です。有名なものはだいたい10万、さらにド定番のものはM(illion)の100万レベルに達しています。ダウンロード1万(10K)以上や10万(100K)以上のものはたいてい間違いないです。以下、折角なのでダウンロード数の概算を「download:」として併記します。
PHP用の拡張機能
デバッグ
PHP Debug download: 330万
PHPをインストールするときにほぼ必ず一緒に入れるデバッグツール、Xdebugのインストールが必須です。VSCode上で再生ボタンや停止ボタン的なUIを操作しながら、1行ずつデバッグ実行ができるようになります。ダウンロード数300万を超える定番。
例外をロギングする仕組みを整えたりアーキテクチャのルールをきちんと定めて開発していると、アプリケーションログやPHP自体のエラーログや画面での挙動からエラー発生個所はだいたい掴めます。ですので上げておいてなんですが、僕はあまりデバッガーは使わないですね。必要なところに一時的にログを仕込んだりでだいたい解決できています。
コーディングサポート
PHP Intelephense download: 190万
コーディング全般をサポートするエクステンションです。コードの入力補完、文法誤りチェック、マウスオーバー時のドキュメントの表示、親クラスなど違うファイル上のクラスの定義へのジャンプ……などが可能になります。
VSCode自体もPHPの基本的な補完は行ってくれるので、バッティングするため設定の以下を変更します。
PHP > Suggest: Basic組み込みの言語候補機能。チェックを外す(false)PHP > Validate: Enable組み込みのPHP検証。チェックを外す(false)
IDE/エディタがこういう機能に必要とする組み込み関数の情報や定義ジャンプの情報を、外部でのサービスとして実現し、通信して取得できるようにしよう……という仕組みをLanguage Server Protocol (言語サーバープロトコル)といい、OSS化されています。VSCode以外も様々なIDE/エディタが対応しています。
microsoft.github.io langserver.org qiita.com
題材の拡張機能もこの言語サーバーを使用するので、PHPのライブラリ管理ツールComposerを使い、php-language-serverを事前に入れる必要があります。
インストールすると /Composer/vender/bin/php-language-server.php(+ .bat) が生成され、/Composer/vendor/felixbecker/** にいろいろ言語サーバーの実体がダウンロードされます。
確認したところでは、VSCodeが開いたPHPプロジェクトフォルダの中にこの言語サーバーのフォルダがあると自動で起動してくれるようです。出力ビューのプルダウンで[PHP Language Server]や[intelephense]を選ぶと、なんかコンソールにずらずらーっと出て動作しているのが分かります。
さて拡張機能の本体ですが、類似の拡張機能にPHP公式からもリンクされていて著名度、ダウンロード数で上回っている PHP Intellisense (download: 408万) というものもあって紛らわしいです。
[PHP Intellisense]はPHP言語のアイコン。[[PHP Intelephense]は象さんにPHPと書かれたアイコン。なんだIntellisenseがオフィシャルっぽいしメインの本家か……とぱっと見思ってしまいます。しかしPHP IntelliSenseの評価の星は2.5、 PHP Intelephenseの方は4.5とかなり差がありレビュー数も差あり、実際に使っている方のネットの記事を参照するとどれもIntelephenseの方を勧めています。
この２つの拡張機能の違いで上げられている点を実際に試してみました。
- 拡張機能自体の更新頻度に差がある:
→Intellisenseは最終更新2019/12/27で止まり、Intelephenseは最新2020/7/20更新と活発です。 - Intellisenseは起動時にディレクトリ内のファイルのキャッシュを作るので立ち上がりに時間がかかる：
→Yes。出力ビューのプルダウンで[PHP Language Server]を選ぶとずらずら出るので確認できますが、結構かかります。確認した環境では1000弱のPHPファイルで90秒ほどかかりました。Intelephenseの方は初期化に2-3秒、indexingで60sぐらい。 - IntellisenseよりIntelephenseの方がCPUやメモリ消費が少ない
- Intellisenseは定義へ移動しようとして考え込んで固まったりして不安定になることがある。Intelephenseの方が動きが速い
- Intelephenseの方が補完候補の精度が高い
→このへんはコードベースのクラス数やマシンスペックにもよるのでしょうか。試した際は大幅な差は感じられませんでしたが、こういう情報がWebに複数上がるということは実際そうなのでしょう。 - キーワード補完の説明がIntelephenseのほうが詳しい：
→別クラスに定義されているメソッドにカーソルをホバーするとIntellisenseの方はPHPDocの説明文だけ、Intelephenseの方は@paramや＠returnsの型や説明も出してくれて確かに詳しいです。 - Intelephenseはvendor配下のクラスもuse文で補完してくれる：
→これはLaravel限定の話のようですが、use文周りの機能が豊富なのはありがたい。 - Intelephenseにだけ未使用変数をグレーアウトで教えてくれる機能がある：
→確かにIntellisenseの方にはなかったです。テーマによるようですが、グレーアウトというか暗い色に変えて教えてくれます。 - 親クラスのメソッド呼び出しを
$this->baseMethod()でなくparent::baseMethod()と書いていると、Intellisenseでは認識されずにホバー時の情報表示、F12での定義への移動、いずれも効かない。
→Intelephenseではちゃんと動きます。これはネット上の情報でなく自分で試していて見つけたのですが、継承を正しく活用して開発しているプロジェクトではけっこう大きい差のような……?
というように、どう見てもIntelephenseの方が優秀というのが結論です。新しく入れるのはこちらをオススメします。
なおintelephense.com で年間1200円だから10ドルぐらい?払うとさらに便利なプレミアム機能も使えるようになるそうです。JetBrain社のPhpStormを買うと初年度2.3万ぐらい、本格的に金をかけるならPhpStorm導入に使った方がいいのかなあと思います。
PHP Namespace Resolver download: 25万
ある程度以上の規模の開発になると必須になってくる名前空間(ネームスペース)でのクラスの整理。コーディング中にクラス名をフル名前空間でなくクラス名のみ入力→右クリック - [Import Class] で、use文を自動入力してくれます。
コード中で右クリックでも - [Highlight Not Imported/Used Classes] が出るようになります。
また、クラス定義先頭のuse文が並んでいる場所で右クリック - [Sort Imports] で、use文の順番をソートし直してくれます。これを試すとアルファベット順に並んでくれず文字数の少ない順に並んでuse文の階段みたいになってしまうのですが……よく見るとデフォルトの並び順は line length (行の長さ)なんですね。
設定で Namespace Resolver: Sort Alphabetically をチェック(true)にするとアルファベット順に並んでくれます。こちらが普通でしょう。use文やimport文を文字数順に並べる文化ってあるのかな……?
PHP Import Checker download: 2.2万
レイヤードアーキテクチャーでルールを定めてチーム開発していると、同じレイヤー(≒パッケージ、名前空間)に属する似たクラスをコピって新しいクラスを作っていくことがよくあります。そしてimport文やuse文も似ていても実は使っていないクラスが残ってた……という流れです。EclipseでJava開発をしていると ctrl + shift + o でシュッとお掃除できるやつです。
この拡張機能があると、開いているクラスの中で、使っていない不要なuse文全体を赤背景で教えてくれます。実は上の[PHP Namespace Resolver]が上位互換なのでは疑惑がありますｗ
完全に同じ名前でDL数が2800件レベルの別物があるのでちょっと注意です。
PHP DocBlocker download: 37万
コード補完系の拡張機能があれこれ入っていれば /** 入力＋リターンでPHPDoc用のコメントが終端の */までだいたい自動入力されます。この拡張機能があるとさらに @paramの引数、@returnの戻り値、@throwsの例外なども推測して自動入力してくれます。定番の拡張機能です。
僕は実務のコードを書くときはメソッドコメントは必ず書くのをMyルールにしています。publicは必須としてprotectedも、そしてprivateな内部メソッドでもだいたい書くようにしていますね。型を含めてきちんとメソッドコメントに書いておけば、変数名の工夫やメソッド切り出し単位の考慮など他の工夫も含め……型回りの問題は割と防げているような気がします。(自分の観測範囲では)
PHP7.2とかでやるときは常にstrictモードにして、必要な際を除いて必ずクラスメソッドの引数・戻り値は型宣言をするようにして、さらに強固にしました。
PHP Class Generator download: 1.4万
空のPHPクラスを作り、フォーカスが当たった状態で ctr + shift + p などでコマンドパレットを起動、generate PHP Class を選ぶとスケルトンコードを作ってくれます。
ネット上の記事にあったので入れてみたのですが、う〜んゼロから空のクラスを作る機会はそれほどないので、自分はあまり使わないなという感じです。
コードフォーマッター関係
php cs fixer download: 32万
コードを整形してくれる拡張機能です。「cs」と「CS」のcase違いの[PHP CS Fixer] も両方ヒットしますが大文字の方はダウンロード1万。小文字の方が本家のようです。他にも名前が似た紛らわしいのが幾つかあります。
インストール後、VSCodeの設定画面で幾つか設定する必要があります。
PHP Coding Standards Fixer を略して PHP-CS-Fixer。これは元々独立した整形用ツールで、VSCodeから実行できるようにした拡張機能がこちらになります。
ですので本体のインストールが必要なのですが、ググると本体をpharファイルで手動でダウンロードして配置、PHPのライブラリ管理ツールComposer経由でダウンロード、この拡張機能に付属しているデフォルトのものを使う……と複数の方法が見つかります。
自分が実際に使った際は、拡張機能付属のものでも特に問題なかったです。この場合は設定ファイルのPHP-cs-fixer: Executable Pathの値はデフォルトの ${extensionPath}/php-cs-fixer.pharのままとなります。
実行時はVSCodeのファイルエクスプローラー上でクラスを右クリック - [php-cs-fixer: diff] で フォーマット適用前と後でどうなるかの差分が左右に表示されます。(まだ実行されません。)
クラスを右クリック - [php-cs-fixer: fix] を選ぶと、フォーマットが適用されてコードがシャキーンと整います。
VSCodeの設定ファイル PHP-cs-fixer: Onsave をチェックしておくとファイル保存時に自動実行されます。このせいか他の拡張機能のせいか、Windowsだとコマンドプロンプトが自動でパカパカ開いて閉じたりするので若干煩いかもしれません。
名前が似ていてややこしいのですが PHP_CodeSniffer という整形ツールもあり、こちらはVSCodeの拡張機能は用意されていないようです。php cs fixerの方だけで間に合いそうなので自分は試しませんでした。PHP界隈のコードフォーマット系のツールでは、この２つがもっとも有名でしょうか。
PHPの各フレームワーク向け拡張機能
Smarty download: 14万
PHPのフレームワーク群の内部でもよく使われていたりするHTMLテンプレートエンジンの老舗の代表格 Smarty。有名どころではCakePHPの内部で使われていますね。デフォルトの拡張子 .tpl のこのファイルを開くとカラーリングして表示し、独自記法のシンタックスをサポートしてくれます。
僕はSmarty3形式のファイル内を弄る時は、SIer伝統の(ウソ)必殺サクラエディタで開いてHTMLモードにしてタグの色変えをしてサーッと書いて終わりにしちゃうことが多かったです。テキストエディタが一番軽くて最強だからというのもあります。この拡張機能を入れてからは修正がVSCode上で完結するようになりました。
今やほぼデファクトとなったLaravel(ララベル)フレームワークの拡張機能で定番は……
Laravel Blade Snippets download: 79万
Laravelが内部で使っているBladeというHTMLテンプレートエンジンで使っている独自の記法をサポートしてくれる拡張機能。b:などとタイプするとその先を入力補助してくれます。
Laravel Snippets download: 44万
Laravelが持っているファサード機能の Route::getのような「大文字始まりクラス名::静的メソッド名」の書き方で呼び出すコードなどを入力補助してくれます。Laravel5～最新の7に対応。
Laravel Artisan download: 37万
Laravelが持っているコマンド実行による各種生成機能のArtisan。> php artisan ... などとコマンドプロンプトで打つと新規クラスを作ったりルーティングを作ったりDBのテーブルを作ったりいろいろできます。これをVSCode上から行えるようになる拡張機能。
Artisanは読み方は「アーティザン」「アルチザン」、英単語ですが元はフランス語で「職人」の意。Laravelの謳い文句が「ウェブ職人のためのPHPフレームワーク (The PHP Framework for Web Artisans)」であるのと繋がっています。
Laravelの生みの親の Taylor Otwell さんはアメリカのアーカンソー州の方ですが、Laravel内部にはEloquentとかフランス語が時々出てきます。ご先祖がフランス系とかなのでしょうか。
Laravel goto view download: 26万
コントローラー層のControllerクラスの処理の最後の return view('user.detail'); のような、どのBladeテンプレートを呼んで画面を描画するかのコードからBladeテンプレートのPHPファイルにジャンプできます。
DotENV download: 102万
厳密にはLaravelに限りませんが、拡張子.envの設定ファイルを色分けハイライト表示してくれる拡張機能。これもダウンロード100万台の定番ですね。よくLaravel用オススメ拡張機能の話に出てきますが、Laravelプロジェクトを作るとルート直下に.envファイルがあってこれを弄ることが多いためでしょう。
PHPに関計する定番の拡張機能はだいたいこんなところでしょうか。色々調べて使ったところでは、仕事のチーム開発でももう十分実用に耐えるなという感触です。
続いて特にPHPに限定することなく、最近の定番のもの中心におすすめ拡張機能を上げてみます。
PHP関係なく最近のおすすめVSCode拡張機能
多言語対応
Japanese Language Pack for Visual Studio Code download: 140万
日本語の言語パックです。メニュー等が日本語になります。これは日本人なら定番。なおVSCode自体をバージョンアップすると一時的に効かなくなったりすることがあります。コマンドパレットから config display language で ja を選び直して再起動すると治ったりします。
Code Spell Checker download: 150万
JavaScript, TypeScript, 各言語のコメントなどでのテキストなどで英文のスペルミスを教えてくれます。英語が苦手の方にはオススメ。
プログラミング中にパッケージや名前空間、メソッド名や変数名や項目名など諸々、英語の短縮形を使う方も多いと思います。(response->res とか convert->conv とか encrypt->enc とか。)
こういう意図があって省略した単語系も全部引っかかってしまうので煩く感じるかもしれません。試したところこれが多かったので僕は外しています。開いているテキストファイルを常時検索するからか、メモリ消費も比較的多め?のようです。
アイコンのテーマ関係
Material Icon Theme download: 470万
エクスプローラーのアイコンが、くっきりしたハイライトのマテリアルデザインになります。評価が高いです。
vscode-icons download: 560万
公式のVSCode Icons Teams作のアイコンテーマ。まあこのへんはお好みですね。
テーマ関係
お馴染みテーマもいろいろあります。その日の気分に合わせてシュッと変えるとなんかスーパーハカーぽい気分になれるやつ!
これもお好みなので外部サイトで省略すると……
テーマが探せるWebサービスもあります。
僕もダークテーマでいろいろ集めて遊んだりしています。Dracula Official (download: 138万) なんかはいかにもヴァンパイアっぽい色を集めていて、こういう遊び心ある系のテーマも面白いと思います。
見た目の補助
indent-rainbow download: 98万
そのファイルのインデント文字数単位で、インデントの背景色を少しずつ違う色で色分け表示してくれます。不正なインデント行があると暗い赤色で警告してくれます。最近のQiita記事などで紹介されていて入れたのですが、これはすごく便利ですね。
インデントについては、僕はサーバーサイド(バックエンド)の言語はスペース4桁派です。C#は最初に触れた時にインデントをタブでやる文化があってなにこれキモーい!!って感じました。いや当時まだキモいとか使わなかったな。ｗ
クライアントサイド(フロントエンド)の言語や設定ファイル……HTMLやCSSやJavaScriptはだいたいスペース2桁派です。昔はJavaScriptもスペース4桁で書いていたのですが、オブジェクトを多用したりコールバック関数が出てきたりjQueryのchangeイベントの中の記述とかReactとかVue.jsが入ってくると、ネストが深くなってきてだんだん2桁の方が分かりやすいなあというお気持ちになってきました。HTMLも昔はスぺース4桁やタブで書いていたのですがネストが深くなってきて以下同文です。
世界的にもスペース派の勝利が決まったようですね。
Bracket Pair Colorizer download: 320万 / Bracket Pair Colorizer 2 download: 108万
関数などの始まりの {([ と対応する終わりカッコを色で強調表示、下線＋縦線で結んで表示してくれます。これも比較的最近知ったのですが、JavaScriptのコーディングでネストが深い時などに分かりやすいです。大きいファイルに使うと重くなるという話もありますが超絶便利なので使っています。
なおほとんど名前が同じ Bracket Pair Colorizer 2 があって同じ作者さんです。FAQを見ると、このv2はカッコをparseするエンジンについてVSCode本体と同じものを使っており、速度/正確さ共に向上しているとのこと。完全に上位互換の改良版なんですね。無印のv1はダウンロード300万、v2はまだ100万ですが、これからは2を使った方がよいでしょう。
Trailing Spaces download: 43万
行末の余計なスペースを暗い赤で表示してくれます。大規模プロジェクトになってコードが増えてきたり、開発速度優先で試験的に書いたコードなんかだとコメント行の末尾とかコードのセミコロン類の後に微妙にスペースが残っていたり……なんてことはけっこうあるので、地味ですがお掃除に役立ちます。
なお見やすさの為に入れたクラスメソッド内のインデントスぺース8桁が入った空行なんかも、すべて対象になって赤くなります。これは空行はスぺースを消すのが今時のモダンなお作法なんでしょうか……？
試しにGitHubのLaravelのコードを見ると消えてました。これは整形ツールで自動的にやっているのかな？
TODO Hilight download: 110万
ソースコードのコメント中のTODO:やFIXME:などを白抜き文字＋派手な背景色で強調表示してくれます。
継続的な自社サービスなどでなく開発して納品して終わりのプロジェクトだと、こういうコメントが入ったままのコードを最終版で納品しちゃうのは場合によってはご法度なんですが、開発途中には割と出てきます。プロジェクト内を全検索すれば出てはきますが、大きいクラスをがーっと眺めてたりする時に地味に便利です。
Rainbow CSV download: 67万
CSVファイルを開いたとき、カンマ区切りで色分け表示してくれます。意外とCSVをよく使うという機械学習やデータサイエンティスト的な作業にも役立っていることでしょう。タブ区切りのTSVやセミコロン、ホワイトスペースでも効きます。
Log File Highlighter download: 110万
拡張子.logのログファイルを開いたとき、色分け表示してくれます。日付や時刻やログレベル、シングル/ダブルクォートで囲った文字列、ログよくある表現やURLなどで自動分類して色分けしてくれます。
Windowsの場合、僕はログファイルは愚直にメモ帳やサクラエディタで開いていたのですが、これを入れてから開発途中ならVSCode上で開くようになって完結しました。解析時に便利です。
コードフォーマッター関係
Visual Studio IntelliCode download: 614万
GitHubの中で質の高いコードを教材にして機械学習で学んだAIがサポートする、Microsoft謹製のコード補完機能。デフォルトのインテリセンス(IntelliSense)機能を拡張する形で、現在のコードの文脈から予測して補完候補の先頭に推奨キーワードを表示してくれます。補完候補の単語の先頭に「★」がついているやつですね。
サポートしている言語がまず TypeScript, JavaScript, Python, Java, T-SQL(Transact SQL, SQL Server専用の言語)……とMicrosoftらしいチョイス。C#はサポート外でそちらは本家Visual Studioの方の領域なんですね。
2019年4月の登場時にも話題になりました。こういうAIがプログラミングを助けてくれる系の技術は今後どう進化していくのでしょう。
Prettier - Code formatter download: 739万
読み方は「プリティアー(pri-tee-uh)」です。総合コードフォーマットツール Prettier が様々なエディタに対応しており、その中のVSCode版が拡張機能で提供されているという形です。これもダウンロード数700万の超ド定番。
対応している言語/技術/フレームワーク特有の書き方/フォーマットは、JavaScript, TypeScript, Flow, ReactのJSX, JSON, CSS, SCSS, Less, HTML, Vue.js, Angular, GraphQL, Markdown, YAML …と広範囲をカバーしています。
Beautify download: 508万
beauty の他動詞形で読み方は「ビューテ(ィ)ファイ」、お花のマークでこちらもド定番のコード整形をしてくれる拡張機能。JavaScript, JSON, CSS, Sass, HTML に対応しています。拡張機能名の一部に"beautify"がついている、各言語や技術固有の別の拡張機能もあるのでご注意ください。
コードフォーマッター系の拡張機能をいろいろ入れていると、だんだん今どの拡張機能が動いてこうなったんだろう……と分からなくなってきたりしますが、雰囲気で使っていても割と大丈夫です。
バージョン管理システム(VCS)のサポート
GitLens download: 578万
ソースコード管理をGitで行っている場合用。サイドバーにGitLensのアイコンが追加されて、ブランチごとのコミット一覧の表示、コミット単位でのファイル比較、コミット内容の表示……などなど。
またソースコードの現物を辿っていると現在カーソル周囲について、行の右の方にうすーく更新時期や更新者を表示してくれます。
これは初見で見るとそこをコミットしたチームメンバの名前とか 2 month ago とかがフッと出てきて「おおおーっ！」って感動しますね。そして自分が修正中のクラスを見たりすると You とか出てきて「直したの昨日の自分か！」ってなります。
便利ですがメモリを比較的消費するようです。(確認した環境では100MB程度は増えていました。) まあバージョン管理の仕組みと繋ぐとバックグラウンドで高頻度で通信が走るし、仕方ないですね。
Git History download: 268万
Gitの履歴を辿ったり。これも100万ダウンロード以上の定番。
Git Blame download: 61万
現在の選択業のGit上の情報をステータスバーに表示してくれます。
Git Graph download: 54万
こちらもGit用、リポジトリの履歴のツリーを見やすく表示してくれます。
以上の4つあたりがGitを使うならダウンロード数の多い定番でしょうか。
SVN download: 37万
TortoiseSVN download: 12万
バージョン管理にSubversion(SVN)を使っている場合の拡張機能。クライアントソフトとして有名な TortoiseSVN の Tortoise は一瞬「トートイズ」とか読みそうになりますが正しいのは「トータス」で亀さんのこと。日本人からすると分かりにくいですが、陸ガメがトータス(Tortoise)で海ガメがタートル(Turtle)だそうです。
スーパーマリオに各色出てくるあれはタートル。アメコミの『ミュータント・タートルズ』も海ガメということは、4兄弟はニューヨークの下水道近辺に住んでいるという設定は正しくない可能性が微レ存…いやNYは海が近いから正しいのか……？
Hg download: 5万
Gitに比べるとマイナーですが、Python製の分散型VCSである Mercurial (マーキュリアル)を扱う際のクライアントソフトHgのVSCode拡張機能版。Mercurial=「水銀」=水銀の元素記号はHg というネーミングです。
以前読んだ『Pythonプロフェッショナルプログラミング第2版』だとバージョン管理にはMercurialが出てきてビープラウド社さんはMercurialを使っていたそうですが、2018年に出たこの本の3版だとGitに変更されています。日本のネット情報だと、全般的にMercurialを使ってるところは最近はあまり見聞きしないですね。
- 作者:株式会社ビープラウド
- 発売日: 2018/06/13
- メディア: Kindle版
試しに検索したところ、2000年代中心にかつて使われてきたバージョン管理ツールの CVS (Concurrent Versions System)や VSS (Visual SourceSafe)用の拡張機能はさすがにありませんでした。VSCode登場は2015年4月なので時代を感じます。
一方、VSSの後継としてMicrosoft社が一時期推していたTFS(Team Foundation Server)用の拡張機能は一応まだありました。TFSはTeam Foundation Server 2018を最後に、2019年から Azure DevOps Serverと名前が変わっています。クラウドのAzure上でのDevOpsをサポートするあれこれの仕組みの中に加わったので、VSCodeでなくVisual Studioから操作するようになるのでしょう。
といろいろ列挙しておいてなんですが、僕自身はバージョン管理のクライアントソフトはIDE/エディタとは独立して別にしておく派です。
アーキテクト的な立ち位置にいると物件を作ったり差分や履歴を確認したり、コードレビューしたり、IDE/エディタを起動していない時もバージョン管理システムに触る機会があるためです。IDE/エディタを重くしたくないというお気持ちもあります。Subversionの時は TortoiseSVN 、Gitの時は TortoiseGit をよく使いますね。
世の中的にはGitのクライアントソフトだと、比較的初心者勢を中心に定番のSourceTreeがだいたい一番人気のようです。
ファイル操作系
Duplicate action download: 8万
クラスのファイルなどを複製する際、VSCodeのファイルエクスプローラではファイルを選んで ctr + c -> ctr + v で同じフォルダに[元ファイル + ' copy'].[元ファイル拡張子] が作成される動きです。
この拡張機能があるとファイルやフォルダ選択→右クリック - [Duplicate file or directory] でプロンプトから好きなフォルダに好きなファイル名でコピーできます。将来VSCode本体の機能がサポートしそうな気もしますが、地味に便利です。
HTML入力系
Auto Rename Tag download: 321万
HTLM/XMLのタグ名を変えると閉じタグも一緒に変えてくれます。
Auto Close Tag download: 309万
HTLM/XMLのタグ名をタイプすると閉じタグも挿入してくれます。
Highlight Matching Tag download: 487万
タグ内にカーソルがフォーカスしている時、閉じタグを探して黄色い下線でハイライト表示してくれます。これも地味に便利。正式にサポートしているマークアップ言語はHTML、JSフレームワークReactが使っているJSX。XMLなど他の言語は保証はないけど should work でだいたい動くそうです。
試したところ、ピュアJSファイルの中の文字列型変数にタグが入っている手動JSXみたいな場合にも効きました。
Path Intellisense download: 323万
HTMLや他の言語でファイルやクラスのパスを入力時、補完をしてくれます。同種のものに Path Autocomplete (download: 54万) という拡張機能もあります。ダウンロード数は前者の方が多いです。
まとめ：PHP開発もVSCodeで十分イケるぞい
HTML関係の拡張機能もまとめたのでいっそJavaScript関係も……と一瞬思ったけどこれはとてもデカいので力尽きて止めました(笑) 他にもリモートでファイルを共有できるやつとかUMLのクラス/シーケンス図など設計関係のやつなど、拡張機能はいろいろありますね。
だいたい国際的に定番のものは100万～600万ダウンロード位まで達していますね。また日本語の言語パックが140万ダウンロード。日本のIT業界のエンジニア数が約100万人くらいいるそうですから、(100万人の中のVSCode使い＋学生さんとか＋趣味でやってる方)で念のため日本語化して使おう……とした端末が140万台ぐらいあることになります。
開発環境にお金をかけるなら最強のPhpStorm、かけないならVSCode＋これらの拡張機能でもう十分PHP開発環境は整うなという感じです。
Microsoftといえば大昔は悪のM$帝国と揶揄されたりいろいろあったのですが、C#言語の生みの親でもあるアンダース・ヘルスバーグさんが中心になって2012年にTypeScript言語がデビュー。フロントエンドの黎明期からしっかり支持を掴んでAltJS言語の代表格に。
そしてガチなプログラマーはいつもvimやemacsというところにSublime TextやAtomなどかっこよさげなエディタが出てきた2010年代半ば、2015年登場のこのVSCodeが徐々に伸びてエディタ戦争終結新世代の開発ツールの代表格に。そして2018年に75億ドルをかけてまさかのGitHub買収。しかしオープンソースの文化を尊重して何も変えないことを宣言してITエンジニアからの人気もアップ。
クラウドの巨人２位のMicrosoft Azureも当然MSファミリー製品との親和性を最優先して.NET技術オンリーか...と思いきやプログラム言語については割と幅広く門戸を開いてエンジニアを歓迎。コロナの世の中で注目されたコミュニケーションツールの分野では進化を続けるTeamsで圧倒的な存在感……としっかりしています。
よくGAFAの後塵を拝するような言われ方をすることもありますが、GAFAMのMとして堅実にやることやってるな〜と改めて思いました。
関連書籍
2019年4月の『徹底解説Visual Studio Code』、2020年2月『Visual Studio Code実践ガイド』、2020年4月の『プログラマーのためのVisual Studio Codeの教科書』と3冊が出ています。
- 作者:本間咲来
- 発売日: 2019/09/27
- メディア: 単行本
正直ネットの情報と大差ないのでは……なんて適当に思っていたのですが、最新の３冊目『プログラマーのためのVisual Studio Codeの教科書』はなかなか濃ゆく深く書いてあるようですね。書評がはてブでも注目を浴びていました。過去の歴史も書いてあるそうでだんだん読みたくなってきました。やはり定期的に拡張機能周りは見直すと気づきがありそうです。
dev.classmethod.jp karaage.hatenadiary.jp
-
一度言ってみたかったやつ……(脚注の使い方を知っただけ)↩
