ReasonML et React Native

Un peu de pratique pour voir comment utiliser React Native via ReasonML et les différences avec l'utilisation via JavaScript.

- http://reasonml.github.io
- https://bucklescript.github.io
- https://reasonml.github.io/reason-react/
- https://reasonml-community.github.io/reason-react-native/

Transcript

1. @MoOx
   Reason React Native
   1
   

   View Slide

2. @MoOx
   2
   https://moox.io/
   @MoOx
   Maxime Thirouin
   • PostCSS
   • cssnext
   • Phenomic
   • …
   Known for its contributions to…
   putaindecode.io
   

   View Slide

3. @MoOx
   3
   

   View Slide

4. @MoOx
   C'est qui Reason(ML)
   et qu'est ce qu'il fait là?
   4
   Previously in React Toulouse…
   

   View Slide

5. @MoOx
   5
   add(1, 1); // 2
   add(1, "1"); // "11"
   add(1, null); // 1
   add(1, undefined); // NaN
   
   JS
   

   View Slide

6. @MoOx
   6
   
   JS JS
   

   View Slide

7. @MoOx
   7
   • ESLint?
   • Flow?
   • TypeScript?
   

   View Slide

8. @MoOx
   8
   

   View Slide

9. @MoOx
   9
   

   View Slide

10. @MoOx
    1. A language
    2. A syntax
    3. A compiler
    4. An ecosystem
    10
    RE
    

    View Slide

11. @MoOx
    RE
    11
    JS
    BuckleScript
    

    View Slide

12. @MoOx
    12
    Creator of React
    Jordan Walke wrote the
    first React prototype in
    SML
    & ReasonML
    Ocaml friend
    

    View Slide

13. @MoOx
    13
    

    View Slide

14. @MoOx
    React Native?
    14
    

    View Slide

15. @MoOx
    15
    JS
    

    View Slide

16. @MoOx
    bs-react-native
    16
    

    View Slide

17. @MoOx
    17
    bs-react-native
    
    

    View Slide

18. @MoOx
    18
    

    View Slide

19. @MoOx
    Reason React Native
    19
    

    View Slide

20. @MoOx
    reason-react-native
    20
    

    View Slide

21. @MoOx
    21
    JS
    

    View Slide

22. @MoOx
    22
    RE
    

    View Slide

23. @MoOx
    Zero-cost
    23
    bs-react-native View vs reason-react-native View
    bs-react-native Style vs reason-react-native Style
    bs-react-native Platform vs reason-react-native Platform
    reason-react-native
    

    View Slide

24. @MoOx
    Wanna try?
    24
    npm install -g react-native-cli
    react-native init MyApp --template reason
    Cd MyApp
    yarn add bs-platform --dev
    react-native run-ios
    reason-react-native
    

    View Slide

25. @MoOx
    25
    reason-react-native 0.x.*
    should work with
    react-native@^0.x.*.
    reason-react-native
    

    View Slide

26. @MoOx
    SHOWTIME
    26
    reason-react-native
    

    View Slide

27. @MoOx
    https://reasonml-
    community.github.io/
    reason-react-native/en/
    docs/cheatsheet/
    https://reasonml-community.github.io/
    reason-react-native/en/docs/
    cheatsheet/
    27
    reason-react-native
    

    View Slide

28. @MoOx
    28
    Questions ?
    https://moox.io/
    @MoOx
    Maxime Thirouin
    
    

    View Slide