Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Visual Studio Code のこれまでとこれから at OSC 2021 Online/Spring

2021/03/05 Open Source Conference 2021 Online/Spring
Video: https://www.youtube.com/watch?v=ltfffeN4WzQ
Conf URL: https://event.ospn.jp/osc2021-online-spring/
VS Code がいかにオープンソースと一緒に成長してきたが、いろいろとヒントになればうれしいです。

  • Be the first to comment

Visual Studio Code のこれまでとこれから at OSC 2021 Online/Spring

  1. 1. Visual Studio Code のこれまでとこれから 平岡 一成 @hoisjp 2021/03/05 12:00-12:45 OSC2021 Online/Spring
  2. 2. Speaker: Issei Hiraoka | @hoisjp, hashtag: #osc21on, アンケート: https://bit.ly/OSC2021Spring_Form 参加アンケートにご協力を! https://bit.ly/OSC2021Spring_Form (・・・アンダースコア・・・) 書籍プレゼントがございます 平岡 一成(ひらおか いっせい) Twitter / GitHub / LinkedIn : @hoisjp 昨年、VS Code の書籍を執筆 プログラマーのための Visual Studio Codeの教科書 日本マイクロソフトで クラウドの仕事をしています de:code 2019 “どっちの VS ショー”
  3. 3. Speaker: Issei Hiraoka | @hoisjp, hashtag: #osc21on, アンケート: https://bit.ly/OSC2021Spring_Form 内容は以下イベントから和訳&加筆したもの 10年間のまとめセッション Microsoft Build 2020 The History of Visual Studio Code by Erich Gamma https://channel9.msdn.com/Events/Build/2020/BDL134 VS Code Day; Keynote (2021/01/27) VS Code an Overnight Success… 10 years in the making by Erich Gamma https://code.visualstudio.com/vscode-day https://channel9.msdn.com/Events/Visual-Studio-Code/VS-Code-Day-2021/Keynote
  4. 4. Speaker: Issei Hiraoka | @hoisjp, hashtag: #osc21on, アンケート: https://bit.ly/OSC2021Spring_Form Erich Gamma? 日本語表記では、”エリック ガンマ” 2011年にマイクロソフトにジョイン、VS Code の開発 それ以前は、Eclipse (Plugin)、JUnit (w/ Kent Beck)、・・・ Design Patterns Elements of Reusable Object-Oriented Software オブジェクト指向における再利用のためのデザインパターン 1995年 GoF (Gang of Four)
  5. 5. Speaker: Issei Hiraoka | @hoisjp, hashtag: #osc21on, アンケート: https://bit.ly/OSC2021Spring_Form 実はこの登壇の話をいただいてから・・・ そうだ、メールを送ってみよう 私 「Hi, Erich, … 」 私 「3月にオープンソースカンファレンスという、日本で最大のオープンソース関 連カンファレンスがあって・・・」 私 「あなたのスライドの画像などを使ってもいいですか??」 ・・・その当日に・・・ Erich 「Hi, this is OK for me, good luck with your talk! --erich」
  6. 6. Visual Studio Code のこれまで History
  7. 7. Speaker: Issei Hiraoka | @hoisjp, hashtag: #osc21on, アンケート: https://bit.ly/OSC2021Spring_Form 2011 The Mission 振り返ってみると、大事な始まり ブラウザでコーディングができるように、つまり Web IDE Erich Gamma はこのためにマイクロソフトに入社 チューリッヒ(スイス)の小さなチームでスタート 資金を得るためにまずは成果物を
  8. 8. Speaker: Issei Hiraoka | @hoisjp, hashtag: #osc21on, アンケート: https://bit.ly/OSC2021Spring_Form 2011 “Monaco” 最初の成果物 • パフォーマンス優先 • 当時最新の HTML5 技術で • Intellisense • 当時から、UI フレームワークを 使わないことを意思決定
  9. 9. Speaker: Issei Hiraoka | @hoisjp, hashtag: #osc21on, アンケート: https://bit.ly/OSC2021Spring_Form 2011 “Monaco” Workbench ドッグフード版 • インターナル • 自動保存 // 実は、いまだにデフォルトONにする勇気がない
  10. 10. Speaker: Issei Hiraoka | @hoisjp, hashtag: #osc21on, アンケート: https://bit.ly/OSC2021Spring_Form TypeScript へ 2年間で徐々に 2011 ほぼ JavaScript 2012 半分を TS へ 2013 すべて TS へ “TypeScript なしでは 10年間コードを柔軟に保つことは 無理だった”
  11. 11. Speaker: Issei Hiraoka | @hoisjp, hashtag: #osc21on, アンケート: https://bit.ly/OSC2021Spring_Form 2013 Visual Studio Online “Monaco” 順風満帆ではなかった Azure Web Sites のエディタとして Explorer, Git, 検索, プログラム実行 など、原型となる機能が実装される 開発チームとしては満足していたが、 多くても 3000 users / month 増 これはまさにスタートアップの課題 会社に求められたのはこの10倍以上の成果 余談:モナコ王国から製品名への指摘が
  12. 12. Speaker: Issei Hiraoka | @hoisjp, hashtag: #osc21on, アンケート: https://bit.ly/OSC2021Spring_Form 2013 Visual Studio Online “Monaco” 決断と転機 さあ、このまま続けるか、ピボットするか そこで会社、マイクロソフトとしても転機が訪れる • Windows から クロスプラットフォームへ • オープンソースやオープンスタンダードを取り入れていく • (サティアナデラがCEO就任したのは2014年2月)
  13. 13. Speaker: Issei Hiraoka | @hoisjp, hashtag: #osc21on, アンケート: https://bit.ly/OSC2021Spring_Form 2014 VS Code へピボット クロスプラットフォームとウェブデベロッパーにターゲット 彼らが使うのは、多くの開発言語、多くのツール、それぞれ異なるランタイム チャレンジは、2015年までに完了したいと宣言したこと 何とか Microsoft BUILD 2015 のイベントまでに
  14. 14. Speaker: Issei Hiraoka | @hoisjp, hashtag: #osc21on, アンケート: https://bit.ly/OSC2021Spring_Form 2014 どんなピボットだったのか エディターとIDE VS Code が狙ったのは、その2つの中間 ブラウザからデスクトップへ 幸運にも当時、Electron が登場 (Node WebKit, Atom Shell, etc) Electron によって、クロスプラットフォームでのつらさ、特にテストの問題を解消
  15. 15. Speaker: Issei Hiraoka | @hoisjp, hashtag: #osc21on, アンケート: https://bit.ly/OSC2021Spring_Form 2015 //build (May) VS Code Preview ついに登場 当日のデモ • .NETをLinuxマシン上でデバッグ 同時に多くの素晴らしいフィードバックを得る • クロスプラットフォーム++ • オープンソースへ要望(実際は多言語を実装するうえでもともと必須だった) そしてカンファレンスドリブンで次のタイミングは6か月後の Connect()
  16. 16. Speaker: Issei Hiraoka | @hoisjp, hashtag: #osc21on, アンケート: https://bit.ly/OSC2021Spring_Form 2015 Connect() (Nov) VS Code to OSS その場で Microsoft/vscode のプライベートリポジトリをパブリックリポジトリへ Visual Studio Code, now open source, with extensibility | Connect(); // 2015 | Channel 9 (msdn.com)
  17. 17. Speaker: Issei Hiraoka | @hoisjp, hashtag: #osc21on, アンケート: https://bit.ly/OSC2021Spring_Form 2015 Connect() (Nov) Extension API いまやなくてはならない機能その1⇒拡張機能が初めてデモでお披露目 拡張機能の課題 ここでもパフォーマンスを重視 別プロセスで拡張機能を実行 コアへの影響を最小限に 根本から拡張APIの設計
  18. 18. Speaker: Issei Hiraoka | @hoisjp, hashtag: #osc21on, アンケート: https://bit.ly/OSC2021Spring_Form 2016 LSP – Language Server Protocol 次のチャレンジは、どうやってマルチ言語をサポートするか
  19. 19. Speaker: Issei Hiraoka | @hoisjp, hashtag: #osc21on, アンケート: https://bit.ly/OSC2021Spring_Form 2016 レドモンドチームが結成 チューリッヒの小さなチームから拡大することを決定 Eclipse チームからもメンバーがジョイン Integrated Terminal 統合ターミナルの実装 xterm.js をベースに xterm.js 側へのコントリビューションも 活発に行われた
  20. 20. Speaker: Issei Hiraoka | @hoisjp, hashtag: #osc21on, アンケート: https://bit.ly/OSC2021Spring_Form 2016 “Open in VS Code” へ さて次に何をしようか Git リポジトリ上で作業できたら便利じゃない? • その場でファイルを開いて、F5で実行して、その場でプルリクエストしたら • でも難しさもわかっていた。ブラウザ上で拡張も動かさなくてはいけない。 • しかしここでもタイミングに恵まれる。マイクロソフトが WSL (Windows Subsystem for Linux) の提供を始める
  21. 21. Speaker: Issei Hiraoka | @hoisjp, hashtag: #osc21on, アンケート: https://bit.ly/OSC2021Spring_Form 2017-2019 VS Code Remote リモート環境で VS Code を実行する 拡張機能がリモートで動いたらば、いろんな環境で VS Code が使える!
  22. 22. Speaker: Issei Hiraoka | @hoisjp, hashtag: #osc21on, アンケート: https://bit.ly/OSC2021Spring_Form 2019 現在の VS Code Remote 決定打となる機能 3つの環境をサポート • WSL ローカルの Linux • Container ローカルの コンテナ • SSH SSH接続した外部マシン
  23. 23. Speaker: Issei Hiraoka | @hoisjp, hashtag: #osc21on, アンケート: https://bit.ly/OSC2021Spring_Form デモ – VS Code Remote; Container なにが起きるか GitHub リポジトリからクローンしてくる この時点で、ローカル環境には、必要なものが何もインストールされていない VS Code からコンテナ環境を起動して接続する コンテナや拡張は、リポジトリ上の設定ファイルにしたがって自動的に構築される そのリポジトリで必要な環境は、すべてコードで定義されている
  24. 24. Speaker: Issei Hiraoka | @hoisjp, hashtag: #osc21on, アンケート: https://bit.ly/OSC2021Spring_Form
  25. 25. Speaker: Issei Hiraoka | @hoisjp, hashtag: #osc21on, アンケート: https://bit.ly/OSC2021Spring_Form 2020 ブラウザへ回帰 VS Code Web ついにオンラインエディターの原点回帰!
  26. 26. Speaker: Issei Hiraoka | @hoisjp, hashtag: #osc21on, アンケート: https://bit.ly/OSC2021Spring_Form 2020 そして GitHub へ VS Code in GitHub, GitHub in VS Code GitHub Extension GitHub Codespaces
  27. 27. Speaker: Issei Hiraoka | @hoisjp, hashtag: #osc21on, アンケート: https://bit.ly/OSC2021Spring_Form たどりついた現在
  28. 28. Speaker: Issei Hiraoka | @hoisjp, hashtag: #osc21on, アンケート: https://bit.ly/OSC2021Spring_Form 2011-2021 ずっと継続してきたこと 継続は・・・なんとやら 毎月リリース 継続的に 負債を減らす イテレーションの中で1週間は時間をとる 継続的に 意見を聞く 投票された機能、ペインポイント 継続的に パフォーマンスにフォーカスする ツール、ボットをつかって常に計測
  29. 29. Visual Studio Code のこれから Next
  30. 30. Speaker: Issei Hiraoka | @hoisjp, hashtag: #osc21on, アンケート: https://bit.ly/OSC2021Spring_Form Next; ロードマップ GitHub でも公開されている https://github.com/microsoft/vscode/wiki/Roadmap Testing 編集する、デバッグする、は すでに揃ってきた このエリアはコミュニティドリブン開発に大きく任せている Notebooks Jupyter Notebook https://jupyter.org/ が VS Code 上で動作 Codespaces
  31. 31. Speaker: Issei Hiraoka | @hoisjp, hashtag: #osc21on, アンケート: https://bit.ly/OSC2021Spring_Form Testing (Work in Progress)
  32. 32. まとめ Closing
  33. 33. Speaker: Issei Hiraoka | @hoisjp, hashtag: #osc21on, アンケート: https://bit.ly/OSC2021Spring_Form VS Code が成功のためにしてきたこと 10年間の軌跡 Be patient 辛抱強く Be persistent 頑固に Be fit 準備万端にしておく Be willing to pivot ためらわずにピボットする ... Be lucky そして運
  34. 34. Thank you. #HappyCoding! ありがとうございました

×