ブラウザ版｢VSCode｣を使ってみる/Chromebookは特に簡単に使えるように

テキストエディタの一つにMicrosoftが開発した「Visual Studio Code」(以下、VSCode)がありますね。
今までは「VSCode」を使うには、アプリ(ソフト)をパソコンにダウンロード・インストールする必要がありました。

しかし約1か月前の2021年10月20日から、なんと「VSCode」はブラウザだけでも使えるようになっています。

今回はブラウザ版「VSCode」を使ってみた結果をまとめます。

アキラ

ダウンロードもインストールも不要だから簡単に使い始められる！
特にChromebookとは相性がいい！
でも日本語化できないことがデメリットかも。

｢VSCode｣がブラウザだけで使用可能に
Chromebookは特に簡単に使えるように
ブラウザ版｢VSCode｣・まとめ

｢VSCode｣がブラウザだけで使用可能に

冒頭でも紹介したように、今や「VSCode」はブラウザだけで使えるようになりましたね。
なのでパソコンにアプリ(ソフト)のダウンロード・インストールが必要ありません。
簡単に使い始めることができます。

｢https://vscode.dev/｣にアクセス

ブラウザ版「VSCode」を使うには、以下のサイトにアクセスするだけ。

https://vscode.dev/

するとこのようになります。
既にアプリ版「VSCode」を使ったことがある場合はお馴染みの画面ですね。

ちなみにここで自分が使っているブラウザはChromeになります。
パソコンはWindows10です。

フォルダー＆ファイルの読込・保存

左側の「Open Folder」からフォルダーやテキストファイルを開くとこんな感じ。

パソコン内のフォルダーやテキストファイルが開けますね。
もちろん編集して保存も可能。

ただしブラウザ起動後の初回のみ、ファイルの読み取りや保存に許可が必要ですね。

｢文字の折り返し｣等も設定可能

アプリ版「VSCode」では、使いやすいように「設定」を変更している人も多いでしょう。

もちろんブラウザ版「VSCode」でも設定変更が可能。

左下の歯車マークから「Settings」で変更できますね。
アプリ版と同じです。

自分は普段、アプリ版で次のように設定して使っています。

・文字の折り返し：37桁

設定方法
1.「wordwrap」と入力。
2.「Editor:Word Wrap」を「wordWrapColumn」に。「Editor:Word Wrap Column」は「37」と入力。

・折り返し線：37桁

設定方法
折り返し線は次のように設定できます。
1.「rulers」と入力。
2.「Edit in settings.json」を選択。
3.「“editor.rulers”: [37],」を追加。

するとこのようになりますね。

設定の保存には、アプリ版「VSCode」はMicrosoftアカウントでサインインする必要がありました。
しかしブラウザ版「VSCode」では、設定保存のためのMicrosoftアカウントのサインインは不要ですね。
変更したら設定が即座に反映されます。

アキラ

ブラウザ版「VSCode」の設定はいろいろ簡単！

ブラウザを再起動しても反映された設定のままになっていますね。

ちなみに自分の場合、「VSCode」は「当ブログ記事を書くため」に使っています。
テキストエディタと言えばプログラミングで使われることが多いですが、自分の主な使用目的はこちらですね。

アプリ版「VSCode」の使い方などの詳細は以下の記事でで紹介しています。

・【記事作成ツール】｢Atom｣→｢VSCode｣に替えた話/理由は｢Chromebook｣で使えなかったから

【注意】拡張機能使えず/日本語化不可

使いやすいブラウザ版「VSCode」ですが、デメリットもありますね。
「VSCode」の最大の特徴と言えば豊富な拡張機能(プラグイン)。

しかしブラウザ版「VSCode」では、ほとんどの拡張機能は使えないようですね。

ご覧のように「VSCode」の設定は全て英語。
拡張機能の中には設定を日本語化できるものもあります。
なのでもちろん設定の日本語化もできません。

アプリ版「VSCode」なら、「View」→「Command Palette…」から「Configure Display Language」と入力すれば、言語選択をすることができました。
しかしブラウザ版「VSCode」は言語選択機能が見当たりませんね。
「No matching commands」となってしまいます。