開発環境の構築。VSCodeで編集する際に便利なプラグイン(おすすめの拡張機能)
はじめに
概要
VSCodeで編集する際に便利なプラグインをご紹介します。これらのプラグインを活用することで、コードの編集や整形が簡単に行えるようになります。ぜひ導入してみてください。
※本記事の情報は執筆時点のものであり、閲覧時点では変更されている可能性があります。また、ご利用の環境によっては、本記事の内容が正常に動作しないことがあります。最新の情報については、公式サイトなどでご確認ください。
Prettier‐Code formatter
コードを自動的に整形してくれるプラグインです。設定に基づいてコードを整形し、一貫性のあるスタイルで表示します。コードの見た目を統一するために役立ちます。
Live Server
Live Serverは、開発者がWebアプリケーションやウェブサイトをローカル環境で開発する際に使用するツールです。通常、ウェブアプリケーションの開発はローカル環境で行われますが、ローカル環境ではリアルタイムで変更を反映させることができません。そのため、変更を保存し、ブラウザをリロードする必要があります。ただし、以下の「Auto Save」を設定すれば編集した内容が瞬時に反映されます。
Auto saveが便利
設定から検索で「Auto Save」と入力します。項目「Files: Auto Save」を「off」から「afterDelay」に変更します。
Path Intellisense
プロジェクト内のファイルやディレクトリのパスを自動的に検出し、入力中のコードに基づいて適切な補完候補を表示します。これにより、開発者はより迅速かつ正確にパスを入力することができます。
こちらはハッシュ値のついたファイルです。手打ちでは誤字につながる可能性がありますが、このような拡張機能を使えば確実に設定することができます。
まとめ
- 拡張機能を活用することで、開発がスムーズに行える
- デザインの形成は、編集した値がどのような挙動をするのかを確認することが大切である
- 階層の深い構造でも、拡張機能を使えば確実に設定することができる