最近、Python開発者にとって便利なVSCode拡張機能に関する記事の翻訳を公開しました 。JavaScriptの番です！
前回、読者はコメントで彼らのお気に入りを共有しました。今日、私たちもJavaScript用の便利なVSCode拡張機能の優れたコレクションを収集できることを願っています。
私はPyCharmProとJetbrainsのIDEであるWebStormを数年使用して います。これらは安価な製品ではないため、このエディターは無料でありながらクールであるため、推奨するたびにVSCodeに切り替えることをお勧めします。Redditでそのような議論を何度か行った後、私は数週間以内にVSCodeをテストすることを約束しました。
VS Codeの重要な利点の中には（もちろん、「無料」のコスト以外に）、カスタマイズ機能とプラグインのエコシステムがあります。トライアルを最大限に活用したかったので、プラグインが必要でした。再びRedditで、私は非常に多くの異なる拡張機能についてアドバイスを受けました。今日は、私が特に気に入ったVSCodeのプラグインについてお話ししたいと思います。
VS Codeを試したにもかかわらず、私は長年愛用しているPyCharmとWebStormに慣れてきたので、それらを使い続けています。それらのコストは、価値と品質によって完全に正当化されます。そうは言っても、VSCodeは私をうれしく驚かせました。それは非常にシンプルで高速なツールです。
ESLint
ESLintは、間違いなくJS開発者の間で最も人気のある拡張機能の1つです。コードにESLintルールを適用し、結果をエディターに表示します。これにより、ルールの違反をすばやく特定して修正できます。ESLintは、パフォーマンスとコード品質の向上に役立つため、すべてのJS開発者に役立ちます。
ESLintをダウンロード
きれい
Prettierは、VS Code、Visual Studio、Atom、Vim、Sublime Text、およびその他のエディターと統合する、独創的なコードフォーマットツールです。コードのフォーマット、コードのインデント、キーワードの強調表示に役立つ便利な小さな拡張機能で、コードを読みやすくします。
もちろん、このような便利な機能により、フォーマット作業が減り、生産性が向上します。Prettierのおかげで、コードの可読性は非常に高くなります。
Prettierをダウンロード
Quokka.js
Quokka.js拡張機能は、 VSCodeエディターでの迅速なJavaScriptプロトタイピングを提供します。これは、JavaScriptおよびTypeScript開発者向けのリアルタイムサンドボックスです。Quokka.jsは、JavaScript開発者向けの最新のノートブックと呼ばれることがよくあります。
何かをすばやくテストして、ブラウザコンソールを使用することになったことがありますか？または
node
、ターミナルで-processを実行して、 そこで試してみますか？この拡張機能の主な目的は、VSCodeエディターでコードをすばやく便利に実行することです。
Quokka.jsをダウンロード
RESTクライアント
RESTクライアントはVSCodeの拡張機能であり、HTTPリクエストを送信し、VSCodeで応答を直接確認できます。
これはVSCode用のPostmanですが、コードエディタに便利に組み込まれています。
RESTクライアントはRESTおよびGraphQLAPIをサポートします。
RESTクライアントをダウンロードする
Chrome用デバッガー
JavaScriptのデバッグはイライラする可能性があります。Chromeやその他のブラウザは、使い始めるのに役立つ優れたツールを提供します。
ただし、多くの場合、操作は簡単ではありません。その上、そのようなツールは、特にフレームワークや多くのライブラリを使用する場合、あまり便利ではありません。
Debugger for Chromeは、Microsoftによって開発された拡張機能であり、小さな変更ごとにコードを簡単にデバッグするのに役立ちます。
拡張コンソールは、特にエラーが発生した行と機能を見つける必要がある場合に、そのパワーでうれしい驚きです。データ処理を追跡することもできます。
Chromeでコードを実行し、コードエディターでデバッグします。
Chrome用デバッガーをダウンロード
ライブサーバー
Live Serverを使用すると、静的ページと動的ページのライブリロード機能を備えたローカル開発サーバーを実行できます。これは、Reactなどのライブリロードをすでに設定しているフレームワークを使用しているユーザーにはあまり関係ありません。ただし、他のライブラリや静的コンテンツを使用する場合は、この拡張機能が間違いなく役立ちます。
LiveServerをダウンロードする
ライブシェア
これは素晴らしいツールです！WebStormにこのようなものがあるかどうかはわかりません。で ライブを共有、あなたは他の人とあなたのコードエディタを共有することができます。これはペアプログラミングに最適です。特に、パンデミックのためにほとんどの人がまだリモートで作業しているためです。
私はそれを試しました、そして私はそれが好きでした！
ライブシェアをダウンロード
JavaScript（ES6）コードスニペット
お気づきかもしれませんが、このリストのほとんどすべての拡張機能はパフォーマンスの向上であり、 JavaScript（ES6）コードスニペットも例外ではありません。
名前はそれ自体を物語っています！この拡張機能は、事前定義されたスニペットのセットを操作することにより、コーディング速度を向上させるのに役立ちます。スニペットは、既製のパッケージをインストールするか、独自のパッケージを作成することで、好みに応じてカスタマイズできます。
JavaScript（ES6）コードスニペットをダウンロードする
Babel JavaScript
JavaScriptは最近大きく進化しました。React、Flow、GraphQLなど、多数のフレームワークとライブラリが登場し、その結果、コードを設計するための多くの新しい方法が登場しました。
Babel JavaScriptを使用すると、最新のJavaScript構文と上記のライブラリを使用できます。この拡張機能は、JavaScriptエディターに最新で最も美しい構文バージョンを提供します。
BabelJavaScriptをダウンロード
1つのダークプロ
開発者はコードエディタに何年も費やしているため、その外観と美学に満足していることが特に重要です。 One Dark Proは、VS Codeのテーマであり、私が慣れているように、エディターをより美しく見せます。
One DarkProをダウンロード
出力
VS Codeを試した後、私はそれがどれほど高速で信頼できるかを知ってうれしく驚きました。
拡張機能でカスタマイズすることで、そのパワフルさも実感できました。
市場で最も人気のあるコードエディタの1つであるため（最も人気がない場合でも）、それをさらに改善するためのツールと拡張機能を作成する巨大なコミュニティがあります。これは、私がJetbrains製品について常に気に入っていることであり、現在VSCodeについて気に入っていることです。
VS Codeは、あらゆる開発者にとって最適な選択肢です。私はお勧め！しかし、WebStormとPyCharmはまだ私の心の中で特別な場所を持っています。
この記事を読んでくれてありがとう！