Just do IT

思うは招く

VSCode の Remote Development を使ってさくらVPS上の Linux を編集したい

Linux VSCode

できること

  • VSCodeからリモートサーバーに入ってファイルを直接編集できるようになる
  • ローカルでVSCodeを使う感じでLinuxサーバー上のファイルをいじることができる

環境

前提

  • リモートサーバーにターミナルからssh接続できること

手順

まずはVSCodeにプラグインをインストール

Remote Development

f:id:K_Koh:20200326111919j:plain

これをインストールするだけで、他の関連プラグインも同時にインストールされたっぽい。

設定する

f:id:K_Koh:20200326112224p:plain

  • 左カラムリモートマシンぽいアイコンをクリック
  • 右上のプルダウンメニューから「SSH Targets」を選択

f:id:K_Koh:20200326112514p:plain

  • 右上の歯車を選択
  • /Users/<username>/.ssh/configを選択するか入力して表示させる
# Read more about SSH config files: https://linux.die.net/man/5/ssh_config
Host sakura_vps # 適当な名前でOK
    HostName さくらVPSに接続するときのIPアドレスを記入
    Port リモートサーバー接続時に設定したPortを記入
    User リモートサーバー上でのユーザーネームを記入
    IdentityFile ~/.ssh/id_rsa # 秘密鍵のパスを記入

たとえば、こんな感じになる。

Host sakura_vps
    HostName 000.000.000.000
    Port 22
    User hoge
    IdentityFile ~/.ssh/id_rsa

これで設定は終わり。

接続する

「sakura_vps」が表示されているはず。

f:id:K_Koh:20200326113237p:plain

左下のこんなマークをクリック。

f:id:K_Koh:20200326113417p:plain

接続できたらこんなマークに変わる。

f:id:K_Koh:20200326113451j:plain

あっけなく接続できて驚愕だ・・・。 さぁ、あとは開発を楽しむだけ！

参考