アーカイブ

VSで書いているコードをリアルタイムに共有できるサービスを作りました

この記事はVisual Studio Advent Calendar 2014の14日目の記事です。

前日(12月13日)を担当されたsadynitroさんの記事はこちらです。


タイトルは半ば詐欺かもしれません。Visual Studioで書いているコードをリアルタイムに共有できるWebサービス『VSShare』を作成し、本日より一般公開しました。

はじめに

今回公開したサービスは開発途中のものであり、動作が非常に不安定・想定外の動作が行われる場合がございます。 このサービス、およびこの拡張機能を有効にした状態で、重要なプロジェクトファイルを扱わないでください。最悪の場合、データが失われる可能性があります。

コミュニティなどで開催される各種勉強会や、小規模なペアプロなどでご活用ください

VSShareで出来ること

VSShareで出来ることを簡単にまとめておきます。

  • Visual Studioが表示しているコードをリアルタイムに共有
  • 編集しているファイル名やそのビルド状況を送信(オプションで有効無効を切り替えられます)
  • Visual Studioのテーマ2種類を自由に切り替え可能
  • プロ生ちゃんIDEも選択可能
  • Visual Studioのインスタンス1つずつ接続を貼るため、個別に接続先を切り替えることが可能

プロ生ちゃんIDEモードとビルド通知

プロ生ちゃんIDEモードとビルド通知

拡張機能の画面

拡張機能の画面

上記の機能であれば一通り実装は完了しておりますが、時間が足りなかった&私の技術力不足でバグが大量に残ってしまいました。現時点で確認されているバグを列挙しておきますので、利用前にご一読ください。これらのバグはなるべく早くつぶすつもりです。

  1. 接続状況によって、接続・切断に時間がかかる改善されました
  2. Visual Studio側のデータとWebクライアント側のデータが一致していないことがある
  3. ライブ配信が終了しているのにも関わらず、配信状況が残っている

特に1番目が深刻で、ローカルのサーバーと通信を行った場合は1000行のソースコードに対して約0.5秒程度で送受信ができていたのですが、Azureにデプロイを行ったところ Visual Studioからサーバー間で30秒かかり、サーバーからクライアント(Webブラウザ)間に1秒程度かかるという状態となってしまいました。(このあたり何かご存知でしたら教えてください…)

その他実装が未完成な点も多々あります。 特に、Visual Studioの黒テーマの調整が全くできなかったこと、プロ生ちゃんIDEと言っておきながらビルドイベントによる表情の変化を実装できなかったことが、個人的には非常に残念です。

今後少しずつ実装を進めていき、より良いサービスとなるよう努めてまいります。

追記

原因はこれでした。Azureにデプロイした際、デフォルトではWebSocketはオンになっていないので注意しましょう。先生方、ありがとうございました!

VSShareの使い方

配信の流れを非常に簡単にまとめると…

  1. Webサービスにアカウントを作成
  2. ルームを作成
  3. Visual Studioに拡張機能をインストール
  4. 接続先設定

といった手順で簡単に配信することができます。もちろん視聴するだけならサービスに登録も必要ありません。

詳しくはこちらで説明しておりますのでご覧ください。

追記

拡張機能はこちらからダウンロードできます。

VSShareの原理

原理は非常に簡単で、Visual Studioの各種APIを通してデータを取得し、SignalRを用いてサーバーと通信を行っています。拡張機能を作成するうえで非常に参考になったリンクを以下にまとめておきます。

VSShareの今後

次期バージョンで搭載予定の項目

  • より高速な共有
  • カーソルおよび選択範囲の追尾とその周辺コードのみの同期
  • コメント機能の追加(MISAOとの連携も検討)
  • プラグイン機能の提供(各種プラグインを作成することで、現在再生しているiTunesのタイトルなども共有可能に)
  • ユーザーのフォローとイベント通知
  • 他エディタからも対応できる仕組み(VimやEmacsからも共有可能に)

上記の項目すべてが次期バージョンで実装されるというわけではありませんが、現時点で個人的に優先度が高いものをリストアップしてみました。
大まかな実装が済み次第、なるべく早いうちにソースコードをGitHubなどで公開することを予定しています。多くの方のコントリビューションをお待ちしております。

またVSShareの設計などを進めるうえで、私だけではなく多くの方のご意見と技術サポートが必要です。VSShareの開発に興味がある方、その他各種技術に詳しい方々、是非開発に参加しませんか?
開発の参加からご意見ご感想まで、VSShareに関しまして何かございましたらTwitterもしくはinfo[at]bonprosoft.comまでお気軽にご連絡ください。 皆様のご協力を心からお待ちしております。

Visual StudioとVSShareと

先日のConnect();イベントで非常に多くの発表がありましたが、Visual StudioはVB.NETやC#、F#やVC++などMicrosoftの言語を書くためだけのツールではありません。 HTMLやCSSはもちろん、PythonやTypeScript/JavaScriptも書くことができ、これらの言語はすべてIntelliSenseと充実したリファレンスによって快適な開発がサポートされています。 また近年はGitなどのプロジェクト管理から各種パッケージマネージャまで様々な技術がサポートされており、非常にさまざまな技術と親和性が高くなっています。

Visual Studioを用いた開発の安定性は非常に素晴らしいもので、是非これらの素晴らしい機能を多くの人に使っていただき、 Visual Studioの可能性を実感してもらえるような機会が、今後さらに増えれば良いなと思っております。

VSShareもVisual Studioの可能性を広げ、「Visual Studioを通した開発の楽しさ/素晴らしさ」を知ってもらえる機会の一つとして貢献できたらと思っております。

謝辞

このサービスを実現するにあたり、原案をくださったjz5さんプログラミング生放送に深く感謝いたします。


明日(12月15日)の担当は、みむらさん(@mimura1133)です。親方、よろしくお願いします!