The reason for using reason

https://ml-lang.connpass.com/event/58151/

Transcript

1. 5IFSFBTPOGPSVTJOHSFBTPO
   N[Q
   .-ษڧձ
   

   View Slide

2. ཁ໿
   .PEFSO+BWB4DSJQU❤.-GFBUVSFT
   Ͱ΋ಋೖ͸େม
   0$BNMΛ+BWB4DSJQUͬΆ͘͠Α͏
   

   View Slide

3. View Slide

4. Ҿ༻ݩ3*05"3FBDUMJLFVTFSJOUFSGBDFNJDSPMJCSBSZ
   IUUQNJLFXBSEOFUUBMLSJPUKT
   

   View Slide

5. View Slide

6. class Greeting extends React.Component {
   render() {
   return Hello;
   }
   }
   3FBDUWJFXͷߏங
   

   View Slide

7. 3FEVYঢ়ଶ؅ཧ
   ભҠؔ਺Λఆٛ͠ঢ়ଶΛ؅ཧ͢Δ
   ͜ͷؔ਺ΛSFEVDFSΛݺͿ
   state -> action -> state
   

   View Slide

8. function counter(state = 0, action) {
   switch (action.type) {
   case 'INCREMENT':
   return state + 1
   case 'DECREMENT':
   return state - 1
   default:
   return state
   }
   }
   ྫDPVOUFSSFEVDFS
   {
   type: "INCREMENTAL"
   }
   

   View Slide

9. function todo(state, action) {
   switch (action.type) {
   case 'TOGGLE':
   if(state.id == action.id) {
   return {...state ,
   completed: !state.completed }
   } else {
   return state
   }
   default:
   return state
   }
   }
   ྫUPEPSFEVDFS
   { type: 'TOGGLE',
   id: 42 }
   { id: 42,
   name: "create slide",
   completed: false,
   ... }
   

   View Slide

10. SFEVDFSJEJPN
    UZQF͕Yͷͱ͖ɺZͱ͍͏߲໨Λ࣋ͭ
    ঢ়ଶΛίϐʔ͠ɺҰ෦͚ͩߋ৽͢Δ
    ˠόϦΞϯτܕͬΆ͍
    ˠϨίʔυܕͬΆ͍
    

    View Slide

11. .-༝དྷͷػೳͷಋೖ
    ύλʔϯϚον
    .BZCFϞφυ
    ඇಉظϞφυ
    ੩తܕݕࠪ
    

    View Slide

12. +
    2016
    Ҿ༻ݩ5IF%BXOPG3FBTPO
    IUUQTTBOEFSTQJFTHJUIVCJPTMJEFTEBXOPGSFBTPOQEG
    

    View Slide

13. ✨ཧ૝ͷݴޠ✨
    όϦΞϯτϨίʔυܕ͕͋Δ
    ύλʔϯϚον͕͋Δ
    ੩తܕݕ͕ࠪ͋Δ
    +BWB4DSJQU͕ੜ੒Ͱ͖Δ
    

    View Slide

14. JS developer trying to grasp OCaml syntax
    Ҿ༻ݩ5IF%BXOPG3FBTPO
    IUUQTTBOEFSTQJFTHJUIVCJPTMJEFTEBXOPGSFBTPOQEG
    

    View Slide

15. JavaScript OCaml
    Flow Reason
    Adopting features of ML
    Becoming familiar to JS
    developers
    Syntax + tooling
    A lot of work
    Ҿ༻ݩ5IF%BXOPG3FBTPO
    IUUQTTBOEFSTQJFTHJUIVCJPTMJEFTEBXOPGSFBTPOQEG
    

    View Slide

16. 3FBTPO͕΍ͬͯΔ͜ͱ
    

    View Slide

17. #VDLMF4DSJQUͱͷ࿈ܞ
    0$BNM͔Β+BWB4DSJQUΛੜ੒͢ΔίϯύΠϥ
    IUUQHJUIVCDPNCMPPNCFSHCVDLMFTDSJQU
    function fact(n) {
    if (n !== 0) {
    return imul(n,
    fact(n - 1 | 0));
    } else {
    return 1;
    }
    }
    let rec fact = function
    | 0 -> 1
    | n -> n * fact (n - 1)
    0$BNM +BWB4DSJQU
    

    View Slide

18. 'use strict';
    var Pervasives = require("bs-platform/lib/js/pervasives");
    var Http = require("http");
    var hostname = "127.0.0.1";
    function create_server(http) {
    var server = http.createServer(function (_, resp) {
    resp.statusCode = 200;
    resp.setHeader("Content-Type", "text/plain");
    return resp.end("Hello world\n");
    });
    return server.listen(3000, hostname, function () {
    console.log("Server running at http://" + (hostname +
    (":" + (Pervasives.string_of_int(3000) + "/"))));
    return /* () */0;
    });
    }
    create_server(Http);
    IVNBOSFBEBCMFDPEF
    

    View Slide

19. Ҿ༻ݩ0$BNM+BWBTDSJQU
    IUUQTHJUIVCDPN#VDLMF4DSJQUCVDLMFTDSJQUCMPCNBTUFSEPDTTMJEFT#VDLMF@NFFUVQNE
    

    View Slide

20. let greeting = "hello!";
    let name = "mzp";
    .....
    จ๏ม਺ଋറ
    

    View Slide

21. if (showMenu) {
    displayMenu ();
    };
    จ๏৚݅෼ذ
    

    View Slide

22. switch data {
    | GoodResult theMessage =>
    "Success! " ^ theMessage
    | BadResult errorCode =>
    "Something's wrong. The error code
    is: " ^ (string_of_int errorCode)
    };
    จ๏ύλʔϯϚον
    

    View Slide

23. ύοέʔδϚωʔδϟʔ
    OQNΛར༻͢Δ
    PQBN͸࢖Θͳ͍
    OQNJOTUBMMCTQMBUGPSNͰ0$BNMͷϏ
    ϧυ͕࢝·Δ
    

    View Slide

24. ίʔυิ׬NFSMJO
    

    View Slide

25. ΤσΟλ֦ு
    

    View Slide

26. #FUUFS&SSPST
    Ҿ༻ݩIUUQTHJUIVCDPNSFBTPONM#FUUFS&SSPST
    

    View Slide

27. SFE
    Ҿ༻ݩIUUQTHJUIVCDPNSFBTPONMSFE
    

    View Slide

28. ༨ஊ3FBTPOͱ͍͏໊લ
    ؔ࿈ϓϩμΫτ͕શ෦Ұൠ໊ࢺ

    qPX JOGFS SFBTPO
    
    FYBNQMFʹSFBTPOPGMJGF͕͋Δ
    

    View Slide

29. 3FBTPOͷར༻ྫ
    

    View Slide

30. IUUQTUXJUUFSDPNMPZPMOZTUBUVT
    'BDFCPPL.FTTBOHFSͷ͸
    3FBTPOʹஔ͖׵͑ΒΕͯΔ
    

    View Slide

31. Meanwhile at…
    Concurrent React Prototype in OCaml
    @jordwalke
    Ҿ༻ݩ5IF%BXOPG3FBTPO
    IUUQTTBOEFSTQJFTHJUIVCJPTMJEFTEBXOPGSFBTPOQEG
    

    View Slide

32. View Slide

33. 3FBTPOͷΑ͍໘
    

    View Slide

34. let redux state = function
    | `Toggle id ->
    if state.id = id then
    { state with
    complete=not state.complete
    }
    else
    state
    | _ ->
    state
    ύλʔϯϚον࠷ߴ
    

    View Slide

35. Ϗϧυ଎౓
    

    View Slide

36. let maybeSay (s: string Js.null) =
    Js.Null.iter s
    (fun message -> Js.log message)
    let maybeSay (s: string Js.undefined) =
    Js.Undefined.iter s
    (fun message -> Js.log message)
    OVMMVOEFpOFE
    

    View Slide

37. take_if context ~f:(function
    `DelayedInc -> Some ()
    | _ -> None)
    >>= (fun () -> call (delay 1000))
    >>= (fun () -> put context `Inc)
    DBMMCBDLIFMM
    

    View Slide

38. 3FBTPOͷͭΒ͍໘
    

    View Slide

39. Πϯετʔϧ࣌ؒͷ૿Ճ
    

    View Slide

40. external request : config -> response Js.Promise.t =
    "get" [@@bs.module "axios"];
    external get : string -> config Js.null -> response
    Js.Promise.t = "get" [@@bs.module "axios"];
    external delete: string -> config Js.null -> response
    Js.Promise.t = "delete" [@@bs.module "axios"];
    external head: string -> config Js.null -> response
    Js.Promise.t = "head" [@@bs.module "axios"];
    external post: string -> 'a Js.null -> config Js.null ->
    response Js.Promise.t = "post" [@@bs.module "axios"];
    external put: string -> config Js.null -> response
    Js.Promise.t = "put" [@@bs.module "axios"];
    external patch: string -> config Js.null -> response
    Js.Promise.t = "patch" [@@bs.module "axios"];
    ܕఆ͕ٛେม
    

    View Slide

41. let expect_array json =
    switch (Js.Json.reifyType json) {
    | Js.Json.Array, data ->
    swtich (Js.Json.reifyType data) {
    ...
    }
    | _ ->
    failwith "unexpected response type"
    }
    +40/͔ΒͷσʔλऔΓग़͠
    

    View Slide

42. type tree =
    | Leaf
    | Node of int * tree * tree
    (* Leaf --> 0 *)
    (* Node(a,b,c) --> [a,b,c]*)
    όϦΞϯτͷϥϯλΠϜදݱ
    

    View Slide

43. Α͘Θ͔ͬͯͳ͍෦෼
    

    View Slide

44. WJNͷϋΠϥΠτ
    ΩʔϫʔυͷϋΠϥΠτ͕ෆ׬શ
    ????
    

    View Slide

45. +4$BNM
    Ҿ༻ݩIUUQTHJUIVCDPNGBDFCPPLFYQFSJNFOUBM+4$BNM
    

    View Slide

46. FTZ
    ZBSOͷGPSL
    μ΢ϯϩʔυͱϏϧυ͕۠ผ͞Ε͍ͯΔ
    

    View Slide

47. PQBNϒϦοδ
    

    View Slide

48. ࢀߟจݙ
    BXFTPNFSFBTPO

    IUUQTHJUIVCDPNWSBNBOBBXFTPNFSFBTPONMCMPCNBTUFS3&"%.&NE
    
    %BXOPG3FBTPO

    IUUQTTBOEFSTQJFTHJUIVCJPTMJEFTEBXOPGSFBTPOQEG
    
    3FBTPOHVJEF

    IUUQTSFBTPONMHJUIVCJPHVJEF
    
    #VDLMF4DSJQUNBOVBM

    IUUQCVDLMFTDSJQUHJUIVCJPCVDLMFTDSJQU.BOVBMIUNM
    

    View Slide

49. ·ͱΊ
    +BWB4DSJQUʹ͸.-ͷػೳ͕ඞཁ
    ಋೖ͸େมͩ͠ɺ0$BNM࢖ͬͨ΄͏͕
    ͍͍
    ͦͷ··͸ͭΒ͍ͷͰ࢖͍΍ͨ͘͢͠ͷ
    ͕3FBTPO
    

    View Slide

50. View Slide