Stimulusと他のフレームワークとの比較 / Comparison with Stimulus

Transcript

1. StimulusͱଞͷϑϨʔϜϫʔ Ϋͱͷൺֱ @aikyo02

2. Stimulusͱ͸ HTML͕طʹ͋Δͱ͖޲͚ͷ߇͑ΊͳϑϨʔϜ ϫʔΫ (A modest JavaScript framework for the HTML

   you already have.) https://stimulusjs.org/

3. ίʔυྫ(html)

4. ίʔυྫ(JavaScript)

5. StimulusͱଞͷϑϨʔϜϫʔΫ ͱͷൺֱ • Stimulus͸SPAͰ͸࢖͑ͳ͍ͷͰɺඇSPAͱ͠ ͯൺֱ͢Δɻ

6. ෼཭ • Stimulus: controller Λ࠶ར༻Մೳʹ͢Δ͜ͱ ͕ਪ঑͞Ε͍ͯΔɻ • Vue, Reactͷίϯϙʔωϯτʹ͍ۙɻ

7. ςϯϓϨʔτΤϯδϯ • Stimulus : ૉͷhtml • Vue : VueςϯϓϨʔτ(htmlʹσʔλόΠϯ σΟϯάͱಠࣗͷσΟϨΫςΟϒΛՃ͑ͨ΋

   ͷ) • React : JSX (htmlΛJavaScriptͰදݱ͍ͯ͠Δ)

8. StimulusͷϝϦοτ • ಋೖͷίετ͕গͳ͍ɻ(jQueryͱ΋ڞଘͰ͖ Δ) • ബ͍ϑϨʔϜϫʔΫͳͷͰࣺͯ΍͍͢ɻ

9. StimulusͷσϝϦοτ • SPA͸ෆՄೳɻ(turbolinksͱͷซ༻ͰSPA෩ʹ ͸Ͱ͖Δ) • DOMΛಈతʹଟ͘มߋ͢ΔΑ͏ͳΞϓϦέʔ γϣϯͷ৔߹͸޲͔ͳ͍ɻ

10. Stimulus͕Αͦ͞͏ͳͱ͖ • ϑϨʔϜϫʔΫͷಋೖʹ͋·ΓϦιʔεΛׂ ͚ͳ͍ͱ͖ • ։ൃϝϯόʔ͕JavaScriptϑϨʔϜϫʔΫʹश ख़͍ͯ͠ͳ͍ͱ͖

11. ͋Γ͕ͱ͏͍͟͝·ͨ͠