Elm 開発サンプル - Speaker Deck

Elm 開発サンプル

by Yosuke Torii

Slide 1

Slide 1 text

&MN։ൃαϯϓϧ &MNೖ໳ϋϯζΦϯʹͯ :PTVLF5PSJJ

Slide 2

Slide 2 text

ࣗݾ঺հ :PTVLF5PSJJ!KJOKPS w &MNྺ೥΄Ͳ w &MNຊࣥචத w *EFJO*ODۈ຿ ରԠʂʢॏཁʣ

Slide 3

Slide 3 text

ϋϯζΦϯ͓ർΕ༷Ͱͨ͠

Slide 4

Slide 4 text

ͩΜͩΜγϯλοΫεʹ׳Ε͖ͯͨ

Slide 5

Slide 5 text

ͩΜͩΜγϯλοΫεʹ׳Ε͖ͯͨ ϥΠϒϥϦͷυΩϡϝϯτ΋ಡΊΔΑ͏ʹͳͬͨ

Slide 6

Slide 6 text

ͩΜͩΜγϯλοΫεʹ׳Ε͖ͯͨ ϥΠϒϥϦͷυΩϡϝϯτ΋ಡΊΔΑ͏ʹͳͬͨ ؆୯ͳ50%0ΞϓϦ͸ॻ͚ͨ

Slide 7

Slide 7 text

ͩΜͩΜγϯλοΫεʹ׳Ε͖ͯͨ ϥΠϒϥϦͷυΩϡϝϯτ΋ಡΊΔΑ͏ʹͳͬͨ ؆୯ͳ50%0ΞϓϦ͸ॻ͚ͨ Ͱ΋ʜ

Slide 8

Slide 8 text

ͩΜͩΜγϯλοΫεʹ׳Ε͖ͯͨ ϥΠϒϥϦͷυΩϡϝϯτ΋ಡΊΔΑ͏ʹͳͬͨ ؆୯ͳ50%0ΞϓϦ͸ॻ͚ͨ Ͱ΋ʜ ·ͱ΋ͳΞϓϦ͕׬੒͢ΔΠϝʔδ͕࣋ͯͳ͍

Slide 9

Slide 9 text

ࠓ೔͓఻͍͑ͨ͜͠ͱ

Slide 10

Slide 10 text

ࠓ೔͓఻͍͑ͨ͜͠ͱ &MNͰී௨ͷΞϓϦ͕ී௨ʹ࡞ΕΔ

Slide 11

Slide 11 text

ϢʔβʔετʔϦʔϚοϐϯά

Slide 12

Slide 12 text

&MNͰ ϢʔβʔετʔϦʔϚοϐϯά ͷπʔϧΛ࡞ͬͯΈͨ

Slide 13

Slide 13 text

TUPSZOPUFTIFSPLVBQQDPN 4UPSZ/PUFT .71WFS

Slide 14

Slide 14 text

TUPSZOPUFTIFSPLVBQQDPN 4UPSZ/PUFT .71WFS ͬ͘͟Γ͍͏ͱɺετʔϦʔʹԊͬͯ ΞϓϦέʔγϣϯͷػೳΛݟੵ΋ΔπʔϧͰ͢

Slide 15

Slide 15 text

ܦҢ

Slide 16

Slide 16 text

ܦҢ w *EFJO*ODͰ։ൃதͷ8FCαʔϏε

Slide 17

Slide 17 text

ܦҢ w *EFJO*ODͰ։ൃதͷ8FCαʔϏε w ్த͔ΒεΫϥϜಋೖ

Slide 18

Slide 18 text

ܦҢ w *EFJO*ODͰ։ൃதͷ8FCαʔϏε w ్த͔ΒεΫϥϜಋೖ w ϢʔβʔετʔϦʔϚοϐϯάͰ΋΍ͬͯΈΔ͔

Slide 19

Slide 19 text

ܦҢ w *EFJO*ODͰ։ൃதͷ8FCαʔϏε w ్த͔ΒεΫϥϜಋೖ w ϢʔβʔετʔϦʔϚοϐϯάͰ΋΍ͬͯΈΔ͔ w ୭΋෇ᝦΛݟͳ͘ͳͬͨ w ੮͔Βԕ͍ϦϞʔτϫʔΫଟ͍

Slide 20

Slide 20 text

ܦҢ w *EFJO*ODͰ։ൃதͷ8FCαʔϏε w ్த͔ΒεΫϥϜಋೖ w ϢʔβʔετʔϦʔϚοϐϯάͰ΋΍ͬͯΈΔ͔ w ୭΋෇ᝦΛݟͳ͘ͳͬͨ w ੮͔Βԕ͍ϦϞʔτϫʔΫଟ͍ w ΦϯϥΠϯͷπʔϧͰ΋࡞ͬͯΈΔ͔ w ΄΅झຯ

Slide 21

Slide 21 text

%&.0

Slide 22

Slide 22 text

ղઆ

Slide 23

Slide 23 text

ߏ੒ w %#1PTUHSF42- w 4FSWFS/PEFKT &YQSFTT5ZQF4DSJQU w 'SPOUFOE&MN

Slide 24

Slide 24 text

ߏ੒ w %#1PTUHSF42- w 4FSWFS/PEFKT &YQSFTT5ZQF4DSJQU w 'SPOUFOE&MN

Slide 25

Slide 25 text

Ϗϧυ w OQNTDSJQUͰେମͲ͏ʹ͔ͳΔ w XFCQBDL΋࢖͓͏ͱࢥ͑͹࢖͑Δ w EPDLFSDPNQPTF

Slide 26

Slide 26 text

σϓϩΠɾͦͷଞ w )FSPLV w $JSDMF$*

Slide 27

Slide 27 text

$44 w ී௨ͷ$44ϑΝΠϧ DTT w ΠϯϥΠϯΛਪ঑͍ͯ͠ΔΘ͚Ͱ͸ͳ͍ w είʔϓ͕ཉ͚͠Ε͹FMNDTTͱ͔΋͋Δ

Slide 28

Slide 28 text

ϩάΠϯ w ී௨ͷ0"VUI w QBTTQPSUϞδϡʔϧ࢖༻ w GPSNཁૉͰը໘ભҠ w DPPLJF

Slide 29

Slide 29 text

ಉ࣌ฤू

Slide 30

Slide 30 text

ಉ࣌ฤू .PEFM 7JFX 6QEBUF

Slide 31

Slide 31 text

ಉ࣌ฤू %# .PEFM 7JFX 6QEBUF

Slide 32

Slide 32 text

ಉ࣌ฤू %# .PEFM 7JFX 6QEBUF .PEFM 7JFX 6QEBUF

Slide 33

Slide 33 text

ಉ࣌ฤू %# .PEFM 7JFX 6QEBUF .PEFM 7JFX 6QEBUF 1 1

Slide 34

Slide 34 text

ಉ࣌ฤू %# .PEFM 7JFX 6QEBUF .PEFM 7JFX 6QEBUF 1 1 1

Slide 35

Slide 35 text

ಉ࣌ฤू %# .PEFM 7JFX 6QEBUF .PEFM 7JFX 6QEBUF 1 1 1 1

Slide 36

Slide 36 text

ಉ࣌ฤू %# .PEFM 7JFX 6QEBUF .PEFM 7JFX 6QEBUF 1 1 1 1 1

Slide 37

Slide 37 text

ಉ࣌ฤू %# .PEFM 6QEBUF 1 1 1 1 .PEFM 6QEBUF 1 1 1 1 7JFX 7JFX

Slide 38

Slide 38 text

ಉ࣌ฤू 1

Slide 39

Slide 39 text

ϧʔςΟϯά w ϋογϡͰϫʔΫεϖʔε੾Γସ͑ w Bʜ

Slide 40

Slide 40 text

ϧʔςΟϯά w ϋογϡͰϫʔΫεϖʔε੾Γସ͑ w Bʜ w 3PVUFΛܕͰఆ͓ٛͯ͘͠ͱศར

Slide 41

Slide 41 text

ϧʔςΟϯά w #SPXTFSBQQMJDBUJPOΛ࢖͏

Slide 42

Slide 42 text

ϧʔςΟϯά w #SPXTFSBQQMJDBUJPOΛ࢖͏

Slide 43

Slide 43 text

ϧʔςΟϯά .PEFM 7JFX 6QEBUF %#

Slide 44

Slide 44 text

ϧʔςΟϯά .PEFM 7JFX 6QEBUF %# PO6SM3FRVFTU

Slide 45

Slide 45 text

ϧʔςΟϯά 7JFX 6QEBUF %# PO6SM3FRVFTU PO6SM$IBOHF .PEFM

Slide 46

Slide 46 text

ϧʔςΟϯά 7JFX 6QEBUF %# PO6SM3FRVFTU PO6SM$IBOHF .PEFM #3322a08…

Slide 47

Slide 47 text

ϧʔςΟϯά 7JFX 6QEBUF %# PO6SM3FRVFTU PO6SM$IBOHF .PEFM #3322a08… Workspace “3322a08…”

Slide 48

Slide 48 text

ϧʔςΟϯά .PEFM 7JFX 6QEBUF %# PO6SM3FRVFTU PO6SM$IBOHF #3322a08… Workspace “3322a08…”

Slide 49

Slide 49 text

ϧʔςΟϯά .PEFM 7JFX 6QEBUF %# PO6SM3FRVFTU PO6SM$IBOHF #3322a08… Workspace “3322a08…”

Slide 50

Slide 50 text

ϧʔςΟϯά .PEFM 6QEBUF %# PO6SM3FRVFTU PO6SM$IBOHF #3322a08… Workspace “3322a08…” 7JFX

Slide 51

Slide 51 text

εΫϩʔϧͷ࣮૷

Slide 52

Slide 52 text

εΫϩʔϧͷ࣮૷

Slide 53

Slide 53 text

εΫϩʔϧͷ࣮૷ 6QEBUF .PEFM scroll = { x = .., y = .. }

Slide 54

Slide 54 text

εΫϩʔϧͷ࣮૷ 6QEBUF .PEFM scroll = { x = .., y = .. }

Slide 55

Slide 55 text

%SBHBOE%SPQͷ࣮૷

Slide 56

Slide 56 text

%SBHBOE%SPQͷ࣮૷ 6QEBUF .PEFM type_ = Note 1 start = { x = .., y = .. }  current = { x = .., y = .. }

Slide 57

Slide 57 text

ඳըͷύϑΥʔϚϯεΛߟྀ [ viewBackground backgroundState , viewNotes notes , viewDraggingNote dragState ]

Slide 58

Slide 58 text

ඳըͷύϑΥʔϚϯεΛߟྀ [ lazy viewBackground backgroundState , lazy viewNotes notes , viewDraggingNote dragState ]

Slide 59

Slide 59 text

ඳըͷύϑΥʔϚϯεΛߟྀ [ lazy viewBackground backgroundState , lazy viewNotes notes , viewDraggingNote dragState ] 1VSF$PNQPOFOUXJUIPVUUIF)FBEBDIF

Slide 60

Slide 60 text

ෳࡶ͞ʹཱͪ޲͔͏

Slide 61

Slide 61 text

ෳࡶ͞ʹཱͪ޲͔͏ wܕ

Slide 62

Slide 62 text

ෳࡶ͞ʹཱͪ޲͔͏ wܕ w ΞΫηε੍ޚ

Slide 63

Slide 63 text

ෳࡶ͞ʹཱͪ޲͔͏ wܕ w ΞΫηε੍ޚ %BUB 6QEBUF JOUFSGBDF

Slide 64

Slide 64 text

·ͱΊ

Slide 65

Slide 65 text

·ͱΊ &MNͰී௨ͷΞϓϦ͕ී௨ʹ࡞ΕΔ w Ұൠతͳ41"ʹඞཁͳಓ۩͸͋Δ w ྗΛೖΕ͍ͨͱ͜ΖҎ֎͸खΛൈ͍͍͍ͯ

Slide 66

Slide 66 text

5IBOLZPV !KJOKPS