Visual Studio CodeをMacOS環境で無料利用する方法とは

  • このエントリーをはてなブックマークに追加
  • Pocket
  • LINEで送る

こんにちは、WPホームページ研究所の運営サポートチーム(@WP_LABO)です。

先月末にブラウザ上で動作可能となった「Visual Studio Code」。つまり、インストール不要で動きます。テキストエディターとしても優秀なので今回は一般的な手順での利用方法をご紹介いたします。

Visual Studio CodeをMacOS環境で無料利用する方法とは

間もなく年末ということもあり開発環境をアップデート。普段は立ち上がりも高速のSublime Text 3を使っていますが本格的なシステム開発も増えてきたのでIDE(統合開発環境)へ移行する予定です。

有料のPhpStormも素晴らしいですがVisual Studio Codeは何と言ってもフリーソフトウェア。Javascriptのコード編集ではVisual Studio Codeが使いやすい。ともに素晴らしいツールですが得意な領域が違います。

Visual Studio Codeの特徴

動作が軽い。無料で利用可能。プラグインが豊富に揃っている。大手企業の安心感。

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

ダウンロードは公式サイトで行えます。Windows・Linux・Macが用意されています。

青いボタンを押すと画面が切り替わって「ZIPファイル」がダウンロードできます。

Visual Studio CodeのZIPファイルを展開する

ZIPファイルを解凍しましょう。

解凍後に実行ファイルをクリック。

Visual Studio Codeを起動する

以下のメッセージが表示されたら「開く」を押しましょう。

無事、アプリケーションが立ち上がりました。

次回以降の起動を考えて「Dockに追加」しておくと便利。

手順としてはアイコンをアプリケーションフォルダへコピーして起動後に「Dockに追加」するのが確実です。

Visual Studio Codeを日本語化する

右下に表示されている画面から日本語化を行いましょう。

押すだけで自動で立ち上がります。日本語メニューが表示されていますね。

💻ウェブサイト運営でお困りの方へ

⇒ WordPressの設定ミスを即日で解決  安心の定額サポート

Visual Studio Codeの見た目を決める

初期設定でエディターのデザインが選べます。そのままでよければ設定は不要です。変更は「色のテーマを参照する」か「その他のテーマを表示」から行えます。個人的に「Monokai」を愛用しています。

1つ下にある「Monokai Dimmed」も綺麗なカラーです。

ちなみに以下のカラーが「Monokai」へ切り替えた状態です。

そして以下が「Monokai Dimmed」。

ファイルを開くと違いがわかりやすいですね。以下は「Monokai」です。よりSublimeっぽい見た目。

まとめ

本日は「VS codeをMac環境で無料利用する方法」をご紹介いたしました。ひと昔前までのIDEツールは重たくて使いにくいソフトウェアも多かったのですが最近は随分と軽快な動作になっていますね。

立ち上がる速度はSublime Textに軍配が上がります。とはいえVisual Studio Codeも十分軽快に動きます。ただどんなテキストエディターもよく扱う言語に合わせてカスタマイズするのが基本です。

次回はより使いやすくするために拡張機能を追加していきましょう。

最新式の無料プラグインを事前公開

WordPressは公式サイトに登録済みのプラグインだけで全機能を補足しきれません。当サイトでは使いやすさを追求した魅惑的なプラグインを無料でダウンロードいただけます。運営ホームページのマーケティング力をさらに高めるチャンスです。まずは無料でDLしてお試しくださいませ。
改良されたプラグインを確認する