$30 off During Our Annual Pro Sale. View Details »

The reason for using reason

mzp
July 22, 2017

The reason for using reason

mzp

July 22, 2017
Tweet

More Decks by mzp

Other Decks in Technology

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