LoginSignup
4
4

出先でも快適な開発環境をVSCode Remote SSH+Tailscale+スマートプラグで手に入れる

Last updated at Posted at 2023-07-27

お盆に時期で帰省される方も多いかと思います。
Qiitaを読まれる方の多くは帰省したときにラップトップを持ち帰るなどして、いつでも開発をできるようにしているかと思います。
私も必ずラップトップを持ち帰り、暇があれば開発などができるようにしていました。
実際はそんな暇がなくて一度も起動しないことが多いですが

その時、いつも以下のような不満がありました

  • ラップトップの性能が低くてビルドなどに時間がかかる
  • モバイル回線を使うため、回線が遅くてdocker pullなどに時間がかかる

これらをタイトルにあるようにVSCode Remote+Tailscale+スマートプラグを組み合わせることで、改善できそうだったので紹介します

VSCode Remote SSH

デスクトップPCなど性能の高いPCが自宅にあることが前提ですが、そうしたPCは基本的にラップトップより性能が高いです。また、そのPCにリモートで接続して開発することでdocker pullなどをしても自宅の回線で実行されるためモバイル回線の遅さやギガの残高を気にする必要がなくなります。

そしてそのリモートを快適に行うために使うのが、Visual Studio Code Remote - SSHという拡張機能です。
https://code.visualstudio.com/docs/remote/ssh

この拡張機能は、sshさえできれば接続先の環境でもまるでローカルで開発しているかのような体験を得ることができます。
また、特にすごいのがyarn startなどでリモート先のPCで例えば3000ポートでサーバが起動した場合、内部でよしなにされてローカルのPCのブラウザでlocalhost:3000で接続できてしまうところです。
これができれば、ほとんどのweb開発は不自由なくできるのではないでしょうか。

Tailscale

これは簡単に自宅PCに接続できるようにするために利用します。
出先からsshで接続する場合、自宅のルータの設定をいじってポート開放と呼ばれる作業をしたり自宅のLANに入るためにVPNサーバーを建てるなどする方法が思いつきます。
しかし、これらの方法は自宅の回線がDS-Liteの場合はポート開放をできなかったり、VPNサーバー建てるのが面倒だったりで課題があります。

Tailscaleはこうした用途に最適です。
https://tailscale.com/

自宅のPCと出先で使うラップトップの双方にインストールすることで直接VPN接続を行い、そのVPNの上でssh接続をします。
ブラウザでtailscaleのサイトを開いてログインすると、自分の接続しているデバイスを一覧を見ることができるので、そのIPアドレスなどをコピペすることで簡単にssh接続ができます。もちろん、自宅側もラップトップ側も多くの場合はルータの設定等なしに接続が可能です。
更に、Tailscaleは無料プランでも100台まで接続可能なので、普通に使ってる分には無料のままで利用可能です。

スマートプラグ

自宅PCにリモートで接続できるようにはなりましたが、常に使うわけではないのに起動しっぱなしでは電気代が気になります。
そこで、スマートプラグを用います。

スマートプラグは、遠隔でコンセントの電源をON/OFFできる製品で、1台あたり1k~2K円程度で購入可能です。
ただ、あくまでもコンセントのON/OFFができるだけで、ただつないだだけではPCの電源をONにすることはできません。
しかし、実は(おそらくほとんどの)マザーボードには「通電したら自動で電源をONにする」機能があるため、BIOSの設定でその機能を有効にすることで出先からスマートプラグをOFFからONにすることで遠隔でPCの電源を入れることができます。

私のPCはASRockのB450M Steel Legendなので、Restore on AC Power lossでPower Onにすることで設定できました。
WIN_20230727_08_40_43_Pro.jpg

ただ、やや調子悪く、スマートプラグでONにしても起動しないことがありました。何度すれば起動はするので、TailscaleのIP宛にpingしながら操作するようにしています。

スマートプラグを接続しておくことはもう一つメリットがあって、リモートで接続している接続先のPCがハングしてssh越しではどうにもならなくなることがまれによくありますが、強制的にシャットダウン(というか電源断)することができるのでそういう場合にも対応できるようになります。電源をいきなり止めるのでPCにはだいぶ悪そうですが。

蛇足

VSCode以外にも利用用途を考えていて、何とは言わないですが 許可なくアプリのインストールをできないmacOSやWindowsへのアクセスもできたりします。

macOSはVNC、WindowsはRDPがOS標準で使えます。
sshはポートフォワーディングと呼ばれる機能があり、前述の自宅PCへのssh接続を経由することで自宅PCと同じLAN内にある端末へアクセスできます。

これを組み合わせることで、例えば以下のようなコマンドを手元のラップトップなどで実行しておくことで、手元のラップトップのVNCクライアントからlocalhostでmacOSを遠隔操作できたりします。

ssh -L 5900:<macOSのローカルIP>:5900 <自宅PCのuser>@<自宅PCのTailscale上のIP>

※ ただし、macOSのマシンは起動しっぱなしにする必要はあります。

では、よい休日を

4
4
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
4
4