React with Reason

Introduction to Reason language with React using ReasonReact. I talk this in Roppongi.js #1.

Transcript

1. ©2018 Wantedly, Inc. React with Reason Roppongi.js #1 20.Mar.2018 - Yuki Yamada
2. ©2018 Wantedly, Inc. Yuki Yamada @yamadayuki I’m an Engineer @ Wantedly I write JS, Golang, Ruby … etc. Now I focus on Machine Learning.
3. ©2018 Wantedly, Inc. What is Reason / BuckleScript ?
4. ©2018 Wantedly, Inc. Reason https://reasonml.github.io Reason have BuckleScript/OCaml backend. It gives OCaml a familiar syntax geared toward JavaScript programmers. Powerful, safe type inference means you rarely have to annotate types, but everything gets checked for you.
5. ©2018 Wantedly, Inc. BuckleScript https://bucklescript.github.io BuckleScript makes OCaml compile to clean, readable and performant JavaScript code. - Sound type system - Strong type inference - Expressive type features
6. ©2018 Wantedly, Inc. ReasonReact
7. ©2018 Wantedly, Inc. ReasonReact Why & What ReasonReact is safer and simpler than the React Application implemented with vanilla JavaScript. And you can easily integrate with benefit from OCaml syntax and its functionality such as Variants and pattern matching.
8. ©2018 Wantedly, Inc. ReasonReact Sample Simple Button component
9. ©2018 Wantedly, Inc. ReasonReact Sample Button component (Solid / Ghost / Transparent)
10. ©2018 Wantedly, Inc. ReasonReact Sample Button component (Solid / Ghost / Transparent)
11. ©2018 Wantedly, Inc. ReasonReact Sample Button component (Solid / Ghost / Transparent)
12. ©2018 Wantedly, Inc. ReasonReact State, Action and Reducer ReasonReact stateful components are like ReactJS stateful components, except with the concept of "reducer" (like Redux) built in.
13. ©2018 Wantedly, Inc. ReasonReact Router ReasonReact has tiny router functions to use with ReasonReact. - The simplest, thinnest possible - Easily pluggable anywhere into your existing code - Performant and tiny
14. ©2018 Wantedly, Inc. Enjoy