いろいろな駆動開発の話 / various-driven-development

自己流の技術の勉強方法についてです。

Transcript

1. ͍Ζ͍Ζͳʓʓۦಈ։ൃͷ࿩ ͸ͱ (@kthatoto)
2. • Twitterɿ@kthatoto • Vue,Nuxt,React,TypeScript,Ruby, Rails,Go,Firebase,AWS • झຯɿϑοταϧ,Ξχϝ,ϙʔΧʔ, ɹɹɹLTۦಈ։ൃ ࣗݾ঺հ ͸ͱ
3. ಺༰ ָ͘͠ษڧ͢Δํ๏
4. ʓʓۦಈ։ൃͱ͸ʁ • ݸਓతʹΑ͘ฉ͘΋ͷͩͱ ʮςετۦಈ։ൃʯͱ͔ʮυϝΠϯۦಈ։ൃʯͱ͔ • ʮςετʯʹΑͬͯʮۦಈʯ͢Δʮ։ൃʯ • ʮςετʯΛॻ͍ͯςετ͕௨ΔΑ͏ʹʮ։ൃʯ • ʓʓۦಈ։ൃɿʓʓΛਖ਼ͱ͢ΔΑ͏ʹ։ൃΛ͢Δ
5. ࠓճ࿩͢ʓʓۦಈ։ൃʹ͍ͭͯ • ଞʹ΋ʮϏϔΠϏΞۦಈ։ൃʯʮνέοτۦಈ։ൃʯ ʮϞσϧۦಈ։ൃʯͳͲ͍Ζ͍Ζ͋Γ·͢ • ͦ͏͍͏೉͍͠࿩͸Ͱ͖ͳ͍͠ͳ͍Ͱ͢ ʮకΊ੾Γۦಈ։ൃʯͳΜ͍ͯ͏΋ͷ΋w
6. ʓʓۦಈ։ൃ ʔ ͦͷ1 ϋοΧιϯۦಈ։ൃ
7. ϋοΧιϯۦಈ։ൃ ʔ ྲྀΕ • "·ͣ" ϋοΧιϯʹԠื͠·͢ (connpassͰʮϋοΧιϯʯͰݕࡧ) ϋοΧιϯͳͷͰۦಈྗൈ܈ɺ͋ͱ͸΍Γ͖ΔͷΈʂ ϋοΧιϯͰͰ͖ͨ΋ͷΛݸਓ։ൃͱͯ͠ଓ͚ͯ։ൃΛଓ͚ͯ΋Α͍ • ࠷ॳ͸νʔϜԠืͰ͖ΔΑ͏ͳΠϕϯτʹ஌Γ߹͍ͱࢀՃʂ • ࣗ෼͕ৄ͘͠ͳ͍/஌Βͳ͍ٕज़Λ࢖͏νϟϯε͕͝Ζ͝Ζ͍ͯ͠Δʂ
8. ϋοΧιϯۦಈ։ൃ ʔ ษڧ๏ʹ͍ͭͯ Ұൠతͳษڧϑϩʔ
   ʓʓΛษڧ
   ˠʓʓΛ࢖ͬͯԿ࡞Ζ͏͔ͳʁ
   ˠ˘˘Λ࡞Ζ͏ʂ
   ˠʓʓΛ࢖ͬͯ։ൃʂ ϋοΧιϯۦಈͳษڧϑϩʔ
   ϋοΧιϯࢀՃʂ
   ˠԿ࡞Ζ͏͔ͳʁ
   ˠ˘˘Λ࡞Ζ͏ʂ
   ˠԿͷٕज़࢖͓͏͔ͳʁ
   ˠ͔ͤͬͩ͘͠˚˚ͷ෦෼ͷ࣮૷ʹ
   ɹʓʓΛ࢖ͬͯΈΑ͏ʂ
   ˠ˚˚Λ࣮૷͢ΔͨΊʹʓʓΛௐࠪ
   ɹ ษڧʹͳΔʂ
9. ϋοΧιϯۦಈ։ൃ ʔ ࣮ྫ1 https://github.com/team-aluminum/super-heisei-mario ࣮ࡍʹϓϨΠͰ͖ΔϦϯΫ͕READMEʹ͋Γ·͢ʂ
10. ϋοΧιϯۦಈ։ൃ ʔ ࣮ྫ1 • Πϕϯτɿฏ੒࠷ޙͷϋοΧιϯ • ɹςʔϚɿʮฏ੒Λָ͘͠ৼΓฦΔ͜ͱ͕Ͱ͖ΔαʔϏε/Ϟϊʯ • ΞΠσΞɿฏ੒ݩ೥ʹొ৔ͨ͠ήʔϜϘʔΠ͔Βۙ೥ͷϋʔυ΁ ɹɹɹɹɹঃʑʹਐԽ͍ͯ͘͠ϚϦΦͷήʔϜ • ֶ΂ͨ͜ͱɾͩ͜ΘΓϙΠϯτ • Vue.js, VuexͷΈͰϚϦΦͷήʔϜΛ࣮૷ • جຊతʹଞͷϥΠϒϥϦ,ήʔϜΤϯδϯͳͲ͸ෆ࢖༻ • ήʔϜͰΑ͋͘Δিಥ൑ఆϩδοΫ(2D)ͷ࣮૷ • ϑϩϯτΤϯυઃܭ
11. ϋοΧιϯۦಈ։ൃ ʔ ࣮ྫ2 https://bonbon-bon.web.app/ https://github.com/kthatoto/shateki-frontend
12. ϋοΧιϯۦಈ։ൃ ʔ ࣮ྫ2 • Πϕϯτɿ͓ຍdeϋοΧιϯ • ɹςʔϚɿʮ԰୆ʯ • ΞΠσΞɿଞͷਓͱҰॹͷ԰୆Ͱ༡ΜͰ͍ΔମݧΛఏڙ͍ͨ͠ ɹɹɹɹɹશһಉ࣌ʹ༡΂ΔΦϯϥΠϯࣹతήʔϜ • ֶ΂ͨ͜ͱɾͩ͜ΘΓϙΠϯτ • Firebase Realtime DatabaseΛར༻ͯ͠ϦΞϧλΠϜ௨৴Λ࣮ݱ • ൓ল఺ • ࣮ࡍʹϓϨΠ͢ΔͨΊʹϩάΠϯ͕ඞཁ (ϥϯΩϯάूܭͷͨΊ) ϩάΠϯ͠ͳͯ͘΋༡΂ΔΑ͏ʹ͢Ε͹Α͔ͬͨ
13. ϋοΧιϯۦಈ։ൃ ʔ ϝϦοτͱσϝϦοτ • ϝϦοτ • ݟͤΔ৔͕͋ΔͷͰϞνϕʔγϣϯʹͳΔ ࣗ෼Ͱ࡞ͬͨ΋ͷΛϓϨθϯ͢Δܦݧ͕ੵΊΔ • ॠൃྗ͕ͭ͘ ࣮૷଎౓ɺ୹ظؒͰͷೱ͍νʔϜ࿈ܞ • ͍Ζ͍Ζͳٕज़Λࢼ͢͜ͱ͕Ͱ͖Δ • σϝϦοτ • جຊతʹϋοΧιϯ͕0͔Βͷελʔτ (ࣗ෼ͷϓϩμΫτΛ੒௕ͤ͞ΒΕ ΔΘ͚Ͱ͸ͳ͍) • ٸ͍Ͱ࡞ΔͨΊઃܭͳͲ͕ૄ͔ʹͳΓ͕ͪ
14. ʓʓۦಈ։ൃ ʔ ͦͷ2 LTۦಈ։ൃ
15. LTۦಈ։ൃ ʔ ྲྀΕ • "·ͣ" LTʹԠื͠·͢ (connpassͰʮLTʯͰݕࡧ) ͦͷ࣌ʹ "·ͣ" LTλΠτϧΛܾΊ·͢ ͦͯ͠େࡶ೺ʹൃද͍ͨ͠಺༰ͷεϥΠυΛ "·ͣ" ࡞Γ·͢ ͦͷεϥΠυΛਖ਼ͱ͢ΔͨΊʹ ࣗ෼ͷ࡞ͬͨLTʹΑͬͯۦಈ͢Δ։ൃΛ࢝Ί·͢ • ্هύλʔϯɿԠืˠλΠτϧܾఆˠεϥΠυ࡞੒ˠ։ൃ • ผύλʔϯ̍ɿԠืˠλΠτϧܾఆˠ։ൃˠͰ͖ͨͱ͜·ͰεϥΠυ࡞੒ • ผύλʔϯ̎ɿԠืˠ։ൃˠͰ͖ͨͱ͜·ͰεϥΠυ࡞੒ˠλΠτϧܾఆ
16. ઌͣԠืΑΓ࢝ΊΑ ("ઌͣᯂΑΓ࢝ΊΑ"෩ʹ)
17. LTۦಈ։ൃ ʔ ྫ • ྫ)ʮHTML,CSS,JSͰి୎࡞ͬͯΈͨʯͱ͍͏λΠτϧͰLTʹԠืɻ ɹɹLTΠϕϯτ͸1िؒޙɻ1िؒͰి୎ͱLTΛ࡞Δɻ ɹɹ22222...ͱೖྗ͢Δͱి୎ͷग़ྗ෦෼ʹɺ ɹɹNyan Cat͕ྲྀΕΔԋग़ΛೖΕΔɻ ɹɹൃද಺༰͸ओʹCSSͰͩ͜Θͬͨ఺ͱJSͰͷ ɹɹܭࢉϩδοΫʹ͍ͭͯɻ࢛ଇԋࢉͷॱংͱ͔ɻ 2222222
18. LTۦಈ։ൃ ʔ ϝϦοτͱσϝϦοτ • ϝϦοτ • ݟͤΔ৔͕͋ΔͷͰϞνϕʔγϣϯʹͳΔɺ ѹ౗తਐḿ ࣗ෼Ͱ࡞ͬͨ΋ͷΛϓϨθϯ͢Δܦݧ͕ੵΊΔ • σϝϦοτ • ։ൃҎ֎ʹεϥΠυΛ࡞Δ͕࣌ؒൃੜͯ͠͠·͏ • ϝϦοτʁ • ൃද಺༰ͷมߋɺ్தΩϟϯηϧ(௚લͰͳ͚Ε͹େ఍)͸Մೳ
19. LTۦಈ։ൃ ʔ ࣮ྫ https://speakerdeck.com/kthatoto/saikyou-houti-game ಺༰ͷมߋ...
20. ௕ظతͳϞνϕʔγϣϯ • ֎తཁҼʹΑͬͯϞνϕʔγϣϯΛ࡞͍ͬͯ͘ํ๏ • LTʹਃ͠ࠐΉ,ϋοΧιϯʹਃ͠ࠐΉ • LT͸தظతͳϞνϕʔγϣϯ • ϋοΧιϯ͸୹ظతͳϞνϕʔγϣϯ • ௕ظతͳϞνϕʔγϣϯ͸ʁ • ࣗ෼ͷ࡞Γ͍ͨ΋ͷΛ࡞͍ͬͯ͘ • ໨ඪઃఆ͕ɺʮWebαʔϏε׬੒ʂϦϦʔεʂʯʹͳͬͯ ͠·͏ͱ࠳ં͢Δ͜ͱ͕ଟ͍ (ݸਓͷҙݟͰ͕͢) • ͡Ό͋Ͳ͏͢Δ͔ʁ
21. ௕ظతͳϞνϕʔγϣϯ • LTΛར༻͠·͠ΐ͏ʂ • ʓʓ։ൃதͷ˘˘ͷ࿩ • ྫ) ݸਓήʔϜ։ൃதʹCypressͰͷςετΛ ɹ GitHub ActionsͰࣗಈԽͨ͠࿩ • ήʔϜͷ঺հΛͭͭ͠ຊ୊͸։ൃதʹۤ࿑ͨ͜͠ͱͱ͔ ٕज़తʹͩ͜Θͬͨ͜ͱͱ͔ • ໨ඪઃఆΛʮLTͰʓʓʹ͍ͭͯ࿩͢ʂʯʹͯ͠։ൃΛଓ͚ Δ͜ͱͰܧଓతʹখ͞ͳਐḿΛग़͠ଓ͚Δ͜ͱ͕Ͱ͖Δ