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

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ʯΛԡͯ͠ɺʮ-BVODI
    4JHO
    *OʯΛԡ͢ɻ

21. αΠϯΠϯ

22. αΠϯΠϯ׬ྃ

23. λʔϛφϧͰ֬ೝ

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

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͸͍͍ͧʯ