TEA++

TEA++ &WPMWJOHUIF&MN"SDIJUFDUVSF !KJOKPS

!KJOKPS :PTVLF5PSJJ "VUIPSPGʮجૅ͔ΒΘ͔Δ&MNʯ 8SJUJOH&MNBU*EFJO*OD 1SPpMF

5IF&MN"SDIJUFDUVSF

)551 $PVOUFS 'PSN 5&"JTFBTZ

3FVTBCMF$PNQPOFOUT 41" *ODSFNFOUBMTFBSDI 'PSNWBMJEBUJPO 8FC4PDLFU -PDBM4UPSBHF 3FTQPOTJWF %BUF1JDLFS 0"VUI $PPLJF
$PFEJUJOH (SBQI2- 'JSFCBTF .JDSPTFSWJD VOUJMXFGBDFSFBMQSPCMFNT

41"JTEJ⒏DVMU

4JNQMF"SDIJUFDUVSF ʴ $PNNVOJUZT1SBDUJDF

)JTUPSZPG5SJBMTBOE&SSPST

5&" .PEFM 6QEBUF 7JFX 3FEVY /FTUFE$PNQPOFOUT 4UBSU"QQ &⒎FDUT *OUSPEVDF$NE /P/FTUFE$PNQPOFOUT
/P'31 *OUSPEVDF4VCTDSJQUJPOT FMNTQBFYBNQMF #SPXTFSBQQMJDBUJPO CVJMUJO41"SPVUJOHT 4UBSU"QQ FMNTQBFYBNQMF7 3FBDU)PPLT

"T5IF&MN"SDIJUFDUVSF FNFSHFE JUCFDBNFDMFBSUIBU ZPVDPVMEEPBMNPTUBMMZPVS &MNQSPHSBNNJOHXJUIPVU UIJOLJOHBCPVUTJHOBMTBUBMM4P UIFTUBSUBQQQBDLBHFXBTBO FYQFSJNFOUUPTFFXIBU IBQQFOTXIFOXFQVTITJHOBMT XBZMBUFSJOUIFMFBSOJOHQBUI
5IFSFTVMUTXFSFHSFBU'PMLT XFSFHFUUJOHTUBSUFERVJDLFS NBLJOHJUGBSUIFS BOEIBWJOH NPSFGVO*OUIFFOE XFIBE MPUTPGGPMLTXIPCFDBNF FYDFMMFOU&MNQSPHSBNNFST XJUIPVUFWFSSFBMMZMFBSOJOH NVDIBCPVUTJHOBMT5IFZXFSF OPUOFDFTTBSZ 5IF&MN"SDIJUFDUVSF͕ొ৔͢Δ ͱɺ৴߸Λ·ͬͨ͘ߟ͑ͣʹ΄ͱ ΜͲ͢΂ͯͷ&MNϓϩάϥϛϯά Λ࣮ߦͰ͖Δ͜ͱ͕໌Β͔ʹͳΓ ·ͨ͠ɻ͕ͨͬͯ͠ɺTUBSUBQQ ύοέʔδ͸ɺֶशύεͷޙ൒Ͱ γάφϧΛϓογϡͨ͠ͱ͖ʹԿ ͕ى͜Δ͔Λ֬ೝ͢ΔͨΊͷ࣮ݧ Ͱͨ͠ɻ݁Ռ͸ૉ੖Β͔ͬͨ͠Ͱ ͢ʂਓʑ͸ΑΓૣ࢝͘ΊɺΑΓԕ ͘ʹɺͦͯ͠΋ͬͱָ͠ΜͰ͍ ͨʂ࠷ऴతʹ͸ɺγάφϧʹ͍ͭ ͯଟ͘ΛֶͿ͜ͱͳ͘༏लͳ&MN ϓϩάϥϚʔʹͳͬͨଟ͘ͷਓʑ ͕͍·ͨ͠ɻͦΕΒ͸ඞཁ͋Γ· ͤΜͰͨ͠ɻ

͜Ε͸ɺਓʑΛ࿭Θ͍ͤͯ·ͨ͠ɻෆద੾ͳঢ়گ ͰͦΕΒΛ࢖͍͗͢ͳ͍Α͏ʹɺਓʑ͕͜ΕΒͷ ֓೦ʹऔΓ૊Ή͜ͱ͕Ͱ͖ΔྫΛ༻ҙ͢Δඞཁ͕ ͋Γ·͢ɻ

$PNQMFUFMZSFBSDIJUFDUFWFSZUIJOH

4P UIFBSDIJUFDUVSFXBSpOJTIFE /0 CVUNVDICFUUFSUIBOCFGPSF

5XPCFTUFYBNQMFT

FMNQBDLBHFFMNMBOHPSH SUGFMENBOFMNTQBFYBNQMF IUUQTHJUIVCDPN IUUQTHJUIVCDPN

QBDLBHFFMNMBOHPSH FMNTQBFYBNQMF #SPXTFSBQQMJDBUJPO $BDIFJO4FTTJPO -PHJO-PHPVU 4FTTJPOJO1BHF $SFEFOUJBMT 3PVUFUZQFT $36% 4LFMUPO
-PBEJOHTUBUF

8IBUJT4FTTJPO

module Page.X exposing (..) type alias Model = { ...
} init : Foo -> Bar -> Model -> (Model, Cmd Msg) update : Baz -> Msg -> Model -> (Model, Cmd Msg, Event) view : Hoge -> Fuga -> Model -> Html Msg -- Main.elm pass concrete args explicitly -- which makes Main.elm dirty! -- -- Also, an extra event should be introduced -- to modify the global state.

module Page.X exposing (..) type alias Model = { session
: Session , ... } init : Session -> Model -> (Model, Cmd Msg) update : Msg -> Model -> (Model, Cmd Msg) view : Model -> Html Msg -- Main.elm passes session type which contains -- various contexts such as user/credential, -- cached data, etc.

module Main exposing (..) getSession : Page -> Session getSession
page = case page of FooPage { session } -> session BarPage { session } -> session ... -- Sometimes `setSession` or `updateSession` -- is also needed...

1SPT .BJOFMNCFDPNFTDMFBOFS 5IFFYUFOTJPOJTDMPTFEJOUIFQBHF (MPCBMTUBUFDBOCFEJSFDUMZNPEJpFE $POT /FXCPJMFSQMBUFTBSFJOUSPEVDFE
$PNNPOPQFSBUJPOTTIPVMECFIBOEMFEJO FBDIQBHF

&YQFSJNFOU

KJOKPSFMNUFBQQ IUUQTHJUIVCDPN

QBDLBHFFMNMBOHPSH FMNTQBFYBNQMF #SPXTFSBQQMJDBUJPO $BDIFJO4FTTJPO -PHJO-PHPVU $SFEFOUJBMT 3PVUFUZQFT $36% 4LFMUPO -PBEJOHTUBUF
3FUVSO FMNUFBQQ 4IBSFEFSSPS 4FTTJPOJO1BHF

module Page.X exposing (..) type alias Model = { ...
} init : Session -> Model -> Return Model Msg update : Session -> Msg -> Model -> Return Model Msg view : Session -> Model -> Html Msg

update : Session -> Msg -> Model -> Return Model
Msg update session msg model = case msg of NoOp -> return model GetUser -> return model |> withTask (Api.getUser GotUser) GotUser user -> return model |> withSession (Session.setUser user session) |> withCommand ... -- There is no `Cmd.none`. -- -- More abstract than (Model, Cmd Msg), easy to -- extend the data structure.

1SPT -FTTCPJMFSQMBUF &BTZUPFYUFOEUIFA3FUVSOATUSVDUVSF $POT %BUBqPXDBOCFDPNFNPSFDPNQMFY

QBDLBHFFMNMBOHPSH FMNTQBFYBNQMF #SPXTFSBQQMJDBUJPO $BDIFJO4FTTJPO -PHJO-PHPVU $SFEFOUJBMT 3PVUFUZQFT $36% 4LFMUPO -PBEJOHTUBUF
3FUVSO FMNUFBQQ 4IBSFEFSSPS 4FTTJPOJO1BHF 5IFSFBSFOPTJMWFSCVMMFUT 'JOEUIFCFTU5&"GPSZPVSBQQ

5IBOLZPV

https://github.com/elm/package.elm-lang.org https://twitter.com/jinjor https://github.com/rtfeldman/elm-spa-example https://github.com/jinjor/elm-teapp

TEA++

TEA++

More Decks by Yosuke Torii

Other Decks in Programming

Featured

Transcript