VS Onlineを無料で使う！（セルフホスティング）

##はじめに
（VS Online リリース）
A氏「VScodeをブラウザでできるようになった。これからはipadでどこからでも開発できる！」
B氏「でも、Azureのサーバ使うから有料らしいよ？　ほらこれ」[VS Onlineの価格](https://azure.microsoft.com/ja-jp/pricing/details/visual-studio-online/)
A氏「結構するね」
B氏「もっと安かったらいいのになー」
自分「サーバで動いてるシステムを自分で用意したサーバに導入できないのかな？」
（調べる）
自分「セルフホスティングあるやん！」
自分「みんな、サーバかPCなら余ってるでしょ？ 記事書くからやってみてよ」

##用意するもの
Azure使用可能なmicrosoftアカウント
VS codeがインストールしてある サーバ or PC

##構築
- まず[VS online](https://online.visualstudio.com/login)にサインインします。
ここでサインインをしても画面遷移してくれなく、再度サインインを求める現象になった同志は、諦めて別アカウント用意してください。
解決策があればコメントください。
![スクリーンショット (40).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/258555/eb90c393-d2d2-3083-30d4-ff5037a09d7d.png)


- Create a Billing Planで適当にPlanを作成します。
![スクリーンショット (41-1).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/258555/53a438b3-f49e-6d45-1831-d7a0ada7c525.png)


- Create Environmentは**Cancel**をクリックして**作成しません**。
![スクリーンショット (42-1).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/258555/fc904ff2-8ab5-2221-c994-e9b17d5ba320.png)


- vs codeで"Visual Studio Online"という拡張機能をインストールします。
![スクリーンショット (43).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/258555/89d78948-6c2d-882c-6e0e-a242a648bee6.png)


- コマンド"VS Online: Sign In"を実行し、microsoftアカウントでサインインします。
![スクリーンショット (44-1).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/258555/6f939e41-1187-e765-62e8-33e16dbfb7b1.png)


- コマンド"VS Online: Regiter Local Environment"を実行し、ワークスペースを選択します。
![スクリーンショット (45-1).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/258555/fcc42139-40d7-9cdf-453e-6f0eefa34962.png)
![スクリーンショット (46-1).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/258555/2629149f-e8e9-6fe6-7e78-d20d49d70fe6.png)


- 好きな名前を入力します。
![スクリーンショット (49-1).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/258555/398a7cce-70fe-1575-8432-39ab9e7e0f8b.png)


- Azureのサインインを求められるので、サインインします。
![スクリーンショット (50-1).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/258555/6d16f04d-7806-4315-e6c9-23d25164c04b.png)


- プラン選択では、最初に作ったプランを選択します。
![スクリーンショット (51).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/258555/65f58062-3851-3b6e-f0a2-2ef3c0143393.png)


- VS onlineの拡張機能タブを開いて、Self-hosted environmentsに作成したものがあるか確認してください。
![スクリーンショット (53-1).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/258555/11d8b76f-9972-4eab-b985-ebfbd9ddd014.png)


あれば作成終了です。


##アクセス
サインインした状態で[ここ](https://online.visualstudio.com/Environments)にアクセスします。
そこに作成されたものがあるので、それをクリックすると、ブラウザでvs codeの環境が開きます。
![スクリーンショット (56-1).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/258555/fedfd10d-d989-c685-4f79-0f14d8782e50.png)

画面
![155f72551c5411768c37a0abc26761c9.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/258555/6effc7dc-b049-3649-50cb-6e5bce30e3cc.png)

デフォルトでインストールされているもの
![7a2658d01654cd363b9ada42cab606f5.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/258555/1df02e9b-396c-8e25-647b-25c827782c2b.png)

##使ってみて
見た目はVScodeで、とても扱いやすい。
遅延は対して感じない。
最初、開いたときだけワークスペース内のファイルの読み込みに時間が掛かる。
サーバのマシンスペックは結構必要かもしれない。
プレビュー版なので、不安定ところがある。
現状セルフホスティングはGUI環境でしか導入できない（と思う）ので、CUI環境にも導入できるようになってほしい。

## あとがき
リリースして一週間くらいで実践しようと思ったが、サインイン段階で数週間の時間を要した...
[VS online](https://online.visualstudio.com/login)にサインインをしても画面遷移してくれなく、再度サインインを求める現象にはまり、そこから色々と試したが抜け出せない。
しかも、2つのアカウントで！
この記事書くために使ったアカウントは3つ目！
少数ではあるがtwitterで同じ現象の人がいるのを確認済
サポートに連絡しても解決はできていない。
はやく、メインアカウントを使用したい...

将来、正式版をリリースする時には、もっといいものになっていてほしい。
ipadやタブレット向けアプリのリリースまだかな～

似たもので[code-server](https://github.com/cdr/code-server)というものがあるので近いうちに試そうと思う。