Brackets のサポートが終了したので Visual Studio Code (VSCode) を使う

WindowsBrackets,VSCode,インストール,エディタWindows,VSCode,インストール,エディタ

記事ヘッダー_VSCodeを使う

2021年9月で Brackets のサポートが終了してしまった…。(´・ω・`)
一応代替エディタとして推奨されているのが VSCode (Visual Studio Code) 。

というわけで、乗り換えをした時にやったであろうインストールや設定なんかの作業内容をメモっときます。

VSCode のインストール

とっとと本題。Brackets や VSCode については後の方にまとめます。
また、私の環境は Windows10 なので、それを前提とした内容となります。

VSCode (zip版) の入手

こちらのサイトから入手できます。

今回は VSCode をポータブル化したいので zip版 を入手します。
ちなみに私は Windows10 64bit の zipファイルをダウンロード。

VSCode (zip版)の入手①
VSCode (zip版)の入手①
VSCode (zip版)の入手②
VSCode (zip版)の入手②

ダウンロードが完了したら解凍(展開)。

VSCode (zip版)の解凍
VSCode (zip版)の解凍

解凍されたフォルダは任意の場所に配置。

VSCode ポータブル化

続いて VSCode をポータブル化する。
ポータブル化については公式サイトの次のページに詳しい手順が書かれている。既に利用している VSCode をポータブル化する手順も書かれている。

data フォルダーの作成

VSCode を展開したフォルダ内に「data」フォルダを新たに作成する。

data フォルダの作成
data フォルダの作成

「data」フォルダを作成後に code (VSCode) を起動すると…

VSCode の実行
VSCode の起動

設定などの関連ファイルが「data」フォルダ内に作成される。

data フォルダに保存された VSCode の関連ファイル
「data」フォルダに保存された VSCode の関連ファイル

TMP フォルダの作成

VSCode が使用するTMPフォルダも「data」と同様に VSCode のフォルダ内に配置できる。
ちなみにデフォルトだとシステムが使用している一時フォルダ(c:\Users\<username>\AppData\Local\Temp かな?)と同じパスになるようです。

VSCode のフォルダ内にTMPフォルダも含めるのであれば、フォルダ内に「tmp」を作成する。

TMPフォルダの作成
TMPフォルダの作成

インストール完了

これで VSCode のインストールは完了。
ポータブル化もできているので、バックアップやパソコンの買い換えなどの際に VSCode のフォルダをまるっと保管したり移動すればOK…なはず…

私の場合だと、この手のツール類はバックアップを兼ねてクラウドのストレージに配置し、別の PC からでも同じ設定でツールを使えるような環境にしています。そのためのポータブル化…_(┐「ε:)_

VSCode の起動

VSCode の準備が終わったので起動してみます。

code.exe の実行

VSCode フォルダの中にある「Code.exe (あるいは Code)」を実行すると、VSCode が起動する。

VSCode の起動
VSCode の起動

初回起動だと画像のようなメッセージが表示される場合がある。これは「日本語パックをインストールするか?」と聞いているだけなので「インストールして再起動」をクリックしインストールを行う。

日本語パックに関するメッセージ
日本語パックに関するメッセージ

起動すれば完了。
zip版の場合、起動用のショートカットなどは作られないので必要に応じて作成するとよさげ。

VSCode のインストール完了
VSCode の起動完了

Brackets 拡張機能のインストール

ついでに Brackets の操作感に近づける拡張機能もインストールしてみる。

「Brackets Extention Pack」拡張機能

拡張機能は「Brackets Extention Pack」という名前で、次の4つの拡張機能がまとめて追加される。

拡張機能のインストール

インストールの方法は、VSCode 左側にある「拡張機能」(もしくは Ctrl+Shift+X)から拡張機能のタブを表示させ、「Brackets Extention Pack」を検索しインストール。

Brackets Extension Pack のインストール
Brackets Extension Pack のインストール

Brackets や VSCode について

どちらも多機能なソースコードエディタ(プログラミング向きのエディタ)です。
私の場合は主に HTML や CSS 用のエディタとして使っていました。

Brackets

Adobe が開発したソースコードエディタ

前述の通りで Adobe によるサポートは終了したが、エディタ自体はサポート終了時点のものがフォークされ、有志の手によって開発が継続されているようです。

Visual Studio Code (VSCode)

Microsoft が開発したソースコードエディタ

Brackets のサポート終了の際、代替推奨エディタで VSCode が紹介されていた。Brackets の操作感を再現するような拡張機能も用意されている。

さいごに

Brackets のサポート終了は残念でしたが、VSCode も拡張機能が豊富ですごく便利ですね。
ただ、設定周りや操作感に慣れない箇所もまだあるので、とにかく使いまくって馴染ませようと思います。

と VSCode を使う流れで来ましたが、Brackets の開発そのものは何とか継続しているようですので、そのまま使い続けるといった選択もアリですね。

じゃまた次回~_(┐「ε:)_