elmから学ぼう

関数型リアクティブなフロントエンド言語であるelmの紹介

Transcript

1. elm͔Βֶ΅͏ 2016/04/02 ܂ാ ӳࢿ #satoimo
2. ࣗݾ঺հ • ܂ാ ӳࢿ (32) • גࣜձࣾΞϥλφ • ීஈ͸όοΫΤϯυ΍ͬͯ·͢ • Scalaͱ͔Haskellͱ͔ • ΧϝϥͱεΩϡʔόμΠϏϯά͕झຯ
3. ࠓ೔ͷ಺༰ • elmͷ঺հ • σϞ • ؔ਺ܕͱϦΞΫςΟϒ • ·ͱΊ
4. elm
5. elm • http://elm-lang.org/ • ·ͩൃల్্(ݱࡏver. 0.16.0)ͳݴޠ • ؔ਺ܕϦΞΫςΟϒͳϑϩϯτΤϯυݴޠ • HTML, JavaScript(, CSS)Λੜ੒͢Δ • HaskellϥΠΫͳهड़͕Ͱ͖Δ
6. લஔ͖ • elm͸·࣮ͩ༻తͳஈ֊Ͱ͸͋Γ·ͤΜ • elm͕࢖͑ͳͯ͘΋ྑ͍Ͱ͢ • Τοηϯε͚ͩͳΜͱͳ͘Θ͔ͬͯ͘ΕΔͱ͋ Γ͕͍ͨͰ͢(^_^ʎ
7. σϞ
8. TodoMVC (ެࣜσϞ)
9. ׬ྃͨ͠λεΫΛ࡟আ ະ׬ྃͷλεΫ਺ ͲͷλεΫ͕ݟΕΔঢ়ଶ͔ʁ λεΫ͸
   ׬ྃͨ͠ʁ λεΫϦετ
10. ؔ਺ܕͱϦΞΫςΟϒ
11. ঢ়ଶͷ਺ͱෳࡶ͞ • ؅ཧ͢Δঢ়ଶͷ਺͕ଟ͍ˠෳࡶʹͳΔ • ϑϥάͷ؅ཧɺදࣔ༻ͷ਺஋ɺetc… • ࣮ࡍʹ͸ผͷঢ়ଶʹґଘ͍ͯ͠Δ͜ͱ΋ • ґଘ͍ͯ͠Δ͸ͣͷঢ়ଶ͕ಉظ࿙Εˠόά • ෳ਺ͷঢ়ଶΛಉظ͢ΔͨΊͷίʔυ͕૿͑Δ
12. ґଘ͍ͯ͠Δ͸ͣͷঢ়ଶ var str = “hoge”; var len = str.length; var str = “fugafuga”; if (str.length === len) { // 正常 } else { // 例外処理！？ }
13. ؅ཧ͢Δঢ়ଶΛ࠷খݶʹ͢Δ ΞϓϦέʔγϣϯͷ
    શͯͷঢ়ଶ ҰͭͷλεΫͷ
    ঢ়ଶ
14. ঢ়ଶ͔Β஋Λಋ͘ λεΫϦετΛ༩͑Δͱʜ ඞཁͳ஋ΛλεΫϦετ͔Β
    ಋ͖ग़ͯ͠ʜ )5.-Λॻ͖ग़͢ ؔ਺ܕ 'VODUJPOBM
15. ΞΫγϣϯͷͨͼʹ࣍ͷঢ়ଶ΁ "DUJPOΛड͚ͯࠓͷঢ়ଶ͔Β
    ৽͍͠ঢ়ଶ΁
    ʢߋ৽͸͠ͳ͍ʣ
16. ΞΫγϣϯ΋ܾΊ͓ͯ͘
17. Ͳ͏΍ͬͯߋ৽͢Δʁ .PEFM .PEFM .PEFM λεΫ௥Ճ λεΫ׬ྃ ׬ྃࡁΈ
    λεΫ࡟আ ೖྗ͞ΕͨΞΫγϣϯʹ ൓Ԡͯ͠৽͍͠ঢ়ଶʹ͢Δ ʹϦΞΫςΟϒ(Reactive)
18. ·ͱΊ
19. ϦΞΫςΟϒདྷͯ·͢ • ϦΞΫςΟϒ΋ͩΜͩΜਁಁ͖ͯͨ͠ • React.jsͱͦͷϑϨʔϜϫʔΫ(Flux) • FluxϑϨʔϜϫʔΫͷҰͭRedux͸elmΛࢀ ߟʹ͍ͯ͠Δ
20. ঢ়ଶΛ೺Ѳͯ͠·͔͢ʁ • ஌Β͵ؒʹ૿͑Δϑϥά • ঢ়ଶύλʔϯͷݟམͱ͠ɾෆ੔߹ • ͦΕɺؔ਺ܕͷߟ͑ํͰ͍͚·͢Αʁ • ඞཁͳঢ়ଶΛߜΓࠐΉ • ঢ়ଶ͔Β஋ΛऔΓग़͢Α͏ʹ͢Δ
21. ͋Γ͕ͱ͏͍͟͝·ͨ͠