VS Live Shareを使った
1対多のライブコーディング

VS Live Shareを使った
1対多のライブコーディング

VS Live Shareを使って、ライブコーディングでの研修(1対多の形式)をやった時の手順紹介。

13725f35541aa680ed5f85d16b85947a?s=128

Kihara, Takuya

August 28, 2018
Tweet

Transcript

  1. VS Live ShareΛ࢖ͬͨ
 1ରଟͷϥΠϒίʔσΟϯά 2018/08/28 @tacck VS Live Share͸͍͍͓ͧ͡͞Μ
 ʮVS

    Live Share͸͍͍ͧʯ
  2. ୭ • ໊લ
 @tacck • ͓࢓ࣄ
 ࠷ۙAlexa৮Γ࢝Ί·ͨ͠ • ޷͖ͳϑΟΪϡΞεέʔτͷٕ
 εϓϨουɾΠʔάϧ

  3. ࠓ೔͓࿩͢͠Δ͜ͱ • ࣾ಺ͷݚम(PHP)ͰVisual Studio Codeͷ
 Live ShareΛ࢖͓ͬͨ࿩ • Live Shareࣗମͷ࢖͍ํ

    • ʮݚमʯͱ͍͏ελΠϧͰͲ͏࢖͔ͬͨ
  4. ͦ΋ͦ΋ Visual Studio Code ͱ͸

  5. Visual Studio Code Visual Studio Code is a code editor

    redefined and optimized for building and debugging modern web and cloud applications. Visual Studio Code is free and available on your favorite platform - Linux, macOS, and Windows. • https://code.visualstudio.com/
  6. ͭ·Γ • Microsoft͕࡞͍ͬͯΔOSSͷΤσΟλ • ϓϥοτϑΥʔϜ: Linux, macOS, Windows • ݴޠ΋ଟ਺ରԠ:

    C++, C#, Java, Python, PHP, Go, etc…
  7. VS Live Share • Visual Studio (Code) ΛϦϞʔτͰڞ༗ • ը໘Λө૾ͱͯ͠ڞ༗͢ΔͷͰ͸ͳ͘ɺ֤छ

    ૢ࡞ΛϦΞϧλΠϜʹڞ༗Ͱ͖Δɻ • ϑΝΠϧૢ࡞ɺλʔϛφϧૢ࡞ɺαʔόϙʔ τ
  8. VS Live Share Λ࢖͏ྫ • લهͷػೳ͔ΒɺʮϖΞϓϩʯͰ࢖͍΍͍͢ɻ • υϥΠόʔɺφϏήʔλڞʹPCΛ࢖ͬͯɺγʔ ϜϨεʹϖΞϓϩͰ͖Δɻ •

    ಉ࣌ฒߦͰίʔσΟϯά΋Մೳɻ • https://tech.mercari.com/entry/2018/06/27/100628 
 “Visual Studio Live Share Λ࢖ͬͯϖΞϓϩΛ͍ͯ͠·͢”
  9. ࢖͏ʹࢸͬͨ ܦҢΛ͔͍ͭ·ΜͰ

  10. ݚमͰ࢖͑ΔαʔϏεΛݕ౼ • ݚमΛʮϥΠϒίʔσΟϯάܗࣜʯͰ΍Γͨ ͍ɻ • ߨࢣ͕͓खຊΛϥΠϒίʔσΟϯάɻ • डߨऀ͸આ໌Λௌ͖ɺ഑৴͞ΕΔίʔυΛ ݟͳ͕Βखݩͷ։ൃ؀ڥͰίʔσΟϯάɻ

  11. ݚमͷࢀՃର৅ऀ • ߨࢣ(ࢲ): 1໊ • डߨऀ(ฐࣾͷΤϯδχΞ) • όοΫΤϯυ: 7໊ •

    ϑϩϯτΤϯυ: 3໊ • ػࡐͷؔ܎͔ΒɺϖΞϓϩͰ࣮ࢪɻ
 (1ͭͷPCʹೋਓͰडߨ)
  12. ݚमͷਐΊํͷݕ౼ • ϝΠϯ͸ʮTDDʯͷମݧɻ
 (PHPͰFizzBuzz໰୊Λղ͘ͷʹɺTDDΛ࢖༻ ͢Δɻ) • PHPࣗମ΁ͷཧղͷࠩͳͲݸਓ͕ࠩେ͖͍ͷ Ͱɺং൫͸͏·͘༠ಋ͍ͨ͠ɻ • ϥΠϒίʔσΟϯάͭͭ͠ɺͦΕΛडߨऀͷ

    खݩͰ֬ೝͰ͖Δ؀ڥʹ͍ͨ͠ɻ
  13. ݕ౼

  14. બ୒ • Visual Studio Code
 +
 VS Live Share •

    ͪΐ͏ͲύϓϦοΫϓϨϏϡʔͱͳͬͨͷ Ͱɺ࢖ͬͯΈΔɻ • ֬ೝͨ݁͠Ռɺཁ݅Λຬͨͤͦ͏ɻ
  15. ಋೖΛܾΊͨ఺ • खܰ • MicrosoftΞΧ΢ϯτ • GitHubΞΧ΢ϯτ • ͲͪΒ͔͋Ε͹ɺ͙͢ʹ࢖͑Δɻ

  16. ಋೖΛܾΊͨ఺ • γΣΞͰ͖Δ΋ͷ • ϑΝΠϧ / ಛʹฤूதͷ಺༰ΛςΩετͰ γΣΞͰ͖Δ • λʔϛφϧͱૢ࡞݁Ռ

    / खݩͰίϚϯυ࣮ ߦͤͯ͞΋͓खຊͱൺֱͰ͖Δ • αʔό(ϙʔτ) / ݚमͰ͸ະ࢖༻
  17. ಋೖΛܾΊͨ఺ • ϑΝΠϧ΍λʔϛφϧ͸ɺݟΔଆ΋ૢ࡞Ͱ͖ Δɻ • ং൫ͷ͓·͡ͳ͍తͳهड़ͷ෦෼Λɺίϐϖ Ͱ΋ਐΊΒΕΔɻ • PHPʹ׳Ε͍ͯͳ͍ਓʹ΋ɺ
 ʮ͜ͷ௨Γʹ΍ͬͯΈͯʯΛ΍Γ΍͍͢ɻ

  18. खॱΛ͔͍ͭ·ΜͰ

  19. Πϯετʔϧ ͜Ε

  20. γΣΞ։࢝ ʮ4IBSFʯΛԡͯ͠ɺʮ-BVODI4JHO*OʯΛԡ͢ɻ

  21. αΠϯΠϯ

  22. αΠϯΠϯ׬ྃ

  23. λʔϛφϧͰ֬ೝ

  24. λʔϛφϧͰ֬ೝ -JWF4IBSFͷαʔό΁઀ଓ͍ͯ͠Δ ʮʯ൪ϙʔτͰ଴ͪड͚ɻ -JWF4IBSFͷαʔόܦ༝Ͱɺ͜ͷϙʔτ͕ར༻͞ ΕΔ͜ͱʹͳΔɻ

  25. ଞͷਓ΁γΣΞ • αΠϯΠϯ׬ྃͨ͠ΒɺΫϦοϓϘʔυʹ ʮγΣΞ༻ͷURLʯ͕ίϐʔࡁΈͱͳΔͷͰɺ ͦΕΛڞ༗͍ͨ͠ਓʹ஌ΒͤΔɻ

  26. γΣΞ༻ͷURLΛ։͘

  27. γΣΞ੒ޭ

  28. γΣΞݩʹ΋௨஌͕ग़Δ

  29. ಉ͡PCͰ͕͢ฒ΂ͯ֬ೝ

  30. ݚमͰͷ࢖͍ํ

  31. ݚमͰͷ࢖͍ํ <?php print "Hello Live Share!" . PHP_EOL; index.php ߨࢣଆ

    ϓϩδΣΫλʔͰөͭͭ͠ɺLive ShareͰڞ༗ Live Share
  32. ݚमͰͷ࢖͍ํ <?php print "Hello Live Share!" . PHP_EOL; index.php डߨଆ

    Live ShareͰڞ༗͞ΕͨίʔυΛݟͳ͕Β
 ϩʔΧϧଆͰखΛಈ͔͢(ϖΞϓϩ) <?php print "Hello Live Share!" . PHP_EOL; index.php Live Share local
  33. ݚमͰͷ࢖͍ํ <?php print "Hello Live Share!" . PHP_EOL; index.php डߨଆ

    Live ShareͰڞ༗͞ΕͨίʔυΛݟͳ͕Β
 ϩʔΧϧଆͰखΛಈ͔͢(ϖΞϓϩ) <?php print "Hello Live Share!" . PHP_EOL; index.php Live Share local ͬͪ͜Λݟͳ͕Β
  34. ݚमͰͷ࢖͍ํ <?php print "Hello Live Share!" . PHP_EOL; index.php डߨଆ

    Live ShareͰڞ༗͞ΕͨίʔυΛݟͳ͕Β
 ϩʔΧϧଆͰखΛಈ͔͢(ϖΞϓϩ) <?php print "Hello Live Share!" . PHP_EOL; index.php Live Share local ͬͪ͜ʹίʔσΟϯά͠ λʔϛφϧͰ࣮ߦ
  35. डߨऀ͔Βͷײ૝ • Live ShareʹΑΔίʔυͷڞ༗͸શൠతʹ
 ޷ධՁɻ • ϑϩϯτͷਓͳͲɺPHPܦݧ͕গͳ͍ਓ͔Β͸ ʮTDDʯΛ஌Δ͜ͱʹूதͰ͖ͨͱ͍͏ධՁɻ • ͋Δఔ౓ʮͰ͖ΔʯΤϯδχΞ͔Β͸ɺ


    ෺଍Γͳ͍ͱ΋ɻ
  36. ͕࣌ؒ͋Ε͹σϞ

  37. ·ͱΊ • ʮ1ରଟʯͰͷίʔυڞ༗(ϥΠϒίʔσΟϯ ά)ʹ͓͍ͯ΋ɺLive Share͸࢖͍΍͍͢ɻ • ಛʹɺݟͤͨίʔυΛखݩͰ֬ೝͯ͠΋Β͏ ৔߹ʹ͸ɺίϐϖ΋Ͱ͖ΔͷͰɺϨϕϧࠩΛ ٵऩ͠΍͍͢ɻ

  38. VS Live Share͸͍͍͓ͧ͡͞Μ
 ʮVS Live Share͸͍͍ͧʯ