【Visual Studio Code】ダウンロードと初期設定をしよう!

2021/11/05

PC全般

t f B! P L

Visual Studio CodeMicrosoftが開発しているWindows、Linux、macOS用のソースコードエディタです。フリーソフトなのですがエディタとして高機能なのはもちろん、ワードプレスのように様々なプラグインも用意されており、自分が使いやすいようにカスタマイズすることも可能です。

今回はプログラミング初心者の方に向けて、インストール、日本語化、テーマの変更について解説していきます。


※web版もつい先日リリースされたようです。詳しくは以下の記事を参考にしてください。

「Visual Studio Code」がインストール不要に。Webブラウザで動作

特に制約なく拡張機能も使うことができるようなので、とりあえず試してみたいという方はこちらで。


Visual Studio Codeをダウンロードをする

まずはダウンロードページからソフトをダウンロードします。

visualstudio.com


Windows以外のOSの方は右の矢印をクリックするとそれぞれのバージョンを選択できますのでそれをクリックしてください。クリックするとダウンロードが始まります。


ウインドウの下部にダウンロードしたファイルが表示されますのでそちらをクリックするとパソコンへのインストール作業が始まります。



同意する」のラジオボタンをクリックし、「次へ>」をクリックします。



いくつかの選択肢が表示されます。一番下にある「PATHへの追加」にチェックを入れておくと、デスクトップにショートカットを作ることができます。なのでここではとりあえず2カ所にチェックを入れて先に進みます。



確認画面に切り替わります。特に問題がなければ「インストール」をクリックします。



インストールが完了するとそのまま「Visual Studio Codeを実行する」にチェックをいれたまま、完了をクリックします。すると初めてのVScodeの画面が開かれます。


無事にVScodeの黒い画面が出てきたらPCへのインストールは終了です。

お疲れさまでした。

英語になっていると思うので、まずはこれを日本語にしてみましょう。


使用言語を日本語にする

Visual Studio Codeでは使用環境をカスタマイズするために多くの拡張機能(プラグイン)が用意されています。操作に慣れるために日本語のプラグインを探してそれをインストールしてみましょう。

左にあるアイコンが並んでいるところの一番下の四角がつながったようなアイコンが拡張機能のアイコンです。今後いろいろな拡張機能を導入する際はこちらで検索をし探すことになります。とりあえずクリックをすると右側に検索窓が出てきます。



検索窓に「japanese」と入力すると、一番上に日本語変換の拡張機能が表示されると思います。インストールをクリックしましょう。


表示言語が日本語に変わったと思います。

今後海外での仕事を考えていたり、英語でのWEB開発に慣れておきたい!という方はそのまま英語で使用したほうが良いかもしれませんね。


テーマを変更してみましょう

続いてVScodeのテーマを変更してみましょう。テーマを変更することによって画面の見た目を変えることができます。こちらも様々なものがリリースされているのでいろいろいじると楽しいですよ。

では早速、画面左下にある歯車のアイコンをクリックし、配色テーマの項目をクリックします。



するといくつかの選択肢が画面上部出てきます。デフォルトだと「Dark+」というテーマになっているようです。いろいろ変更して試してみてください。実際に使いながら自分の目にあったものを探していくのもよいかもしれません。なにせ長時間これと向き合うことになりますので。



ここに表示されている以外にも、個人や組織によって作られた外部のテーマがたくさんあります。配色テーマの画面(上の画像)を開いたままで、先ほどの拡張機能のアイコンを押してあげると、様々なテーマが表示されます。


画面右側の広いとこにテーマの詳細が表示され、評価なども見ることができるので、あまりにも評判の悪いものは避けつついくつかインストールして遊んでみましょう。


まとめ:ダウンロードから基本的な設定まで

ということで今回は、ダウンロードから基本的な設定までをご紹介しました。

新しいソフトの使い始めは慣れないので一時的に効率は悪くなりますが、今一番使われている注目のフリーエディタなので、少し時間をかけて操作になれておくといいと思います。

次の記事では基本的な操作方法とショートカットキーの解説をしていきます。

最後までお読みいただきありがとうございました。

QooQ