WebAppConf 2017 - Elm in Production

Transcript

1. Elm in Production Marco Sampellegrini @_alpacaaa // #webappconf17
2. Marco Sampellegrini Software Engineer @_alpacaaa // #webappconf17
3. Agenda How I got to Elm What makes it unique Migrating an app to Elm @_alpacaaa // #webappconf17
4. Why Elm? @_alpacaaa // #webappconf17
5. Javascript in a nutshell @_alpacaaa // #webappconf17
6. same mistakes @_alpacaaa // #webappconf17
7. same mistakes same mistakes @_alpacaaa // #webappconf17
8. same mistakes same mistakes u n d e f i n e d @_alpacaaa // #webappconf17
9. same mistakes same mistakes u n d e f i n e d same mistakes @_alpacaaa // #webappconf17
10. Insanity: doing the same thing over and over again and expecting different results. Einstein @_alpacaaa // #webappconf17
11. @_alpacaaa // #webappconf17
12. Functional Programming + Static typing @_alpacaaa // #webappconf17
13. So... Haskell? @_alpacaaa // #webappconf17
14. @_alpacaaa // #webappconf17
15. @_alpacaaa // #webappconf17
16. elm A delightful language for reliable webapps. @_alpacaaa // #webappconf17
17. Started coding little games Also https://runelm.io/ @_alpacaaa // #webappconf17
18. Real World Apps? @_alpacaaa // #webappconf17
19. Hacker News Clone Routing Fetch data from GraphQL endpoint Non trivial UI state @_alpacaaa // #webappconf17
20. https://elm­hn.surge.sh @_alpacaaa // #webappconf17
21. Let's Talk about Elm! Common myths The Elm Architecture (TEA) @_alpacaaa // #webappconf17
22. Common Myths @_alpacaaa // #webappconf17
23. Common Myth #1 ­ FP Myth: Functional Programming == m a p ( ) . r e d u c e ( ) Truth: Functional Programming is about abstractions! @_alpacaaa // #webappconf17
24. Common Myth #2 ­ Tests Myth: Huge and complex Test suite == Lack of errors Writing unit tests is reinventing functional programming in non­ functional languages http://noss.github.io/2009/02/25/writing­unit­tests­is­reinventing­functional­programming­in­non­functional­languages.html @_alpacaaa // #webappconf17
25. Testing is washing the dishes. Automatic tests are a dishwasher. Types are proof that your dishes are not even dirty. https://twitter.com/runarorama/status/929754554111004672 @_alpacaaa // #webappconf17
26. Common Myth #3 ­ Types Myth: Static Typing == Java Truth: You can write Elm code without ever writing a type signature (not a great idea though). The type system in Elm is much more powerful and expressive. @_alpacaaa // #webappconf17
27. The static typing debate is silly. Instead the question must be, what can we prove about our programs before we run them & what is the cost? https://twitter.com/jdegoes/status/924035236035530752 @_alpacaaa // #webappconf17
28. No Runtime Errors. Ever. @_alpacaaa // #webappconf17
29. Breaking News Elm does not have n u l l or u n d e f i n e d @_alpacaaa // #webappconf17
30. In case you don't know I call it my billion­dollar mistake. It was the invention of the null reference in 1965. Tony Hoare @_alpacaaa // #webappconf17
31. Well, unless... ­ ­ Y o u c a n f o r c e E l m t o c r a s h ! ­ ­ I n c a s e y o u m i s s J S f r o m t i m e t o t i m e . . . D e b u g . c r a s h " L O L r u n t i m e e r r o r s ! " ( ) @_alpacaaa // #webappconf17
32. The Elm Architecture @_alpacaaa // #webappconf17
33. reactjs/redux Redux evolves the ideas of Flux, but avoids its complexity by taking cues from Elm. @_alpacaaa // #webappconf17
34. Elm Architecture Elm Runtime Model update Html Msg view @_alpacaaa // #webappconf17
35. All apps are written the same way. @_alpacaaa // #webappconf17
36. Migrating an Angular app to Elm @_alpacaaa // #webappconf17
37. @_alpacaaa // #webappconf17
38. Rewrite one piece at a time. @_alpacaaa // #webappconf17
39. I noticed that everyone who successfully introduces Elm at work tells the same story. They introduce Elm gradually into an existing JS project. This process works because it minimizes risk. Evan Czaplicki (Author of Elm) @_alpacaaa // #webappconf17
40. Our Master plan Modify current app as little as possible Start serving the new Elm app at a specific route @_alpacaaa // #webappconf17
41. In practice Elixir backend served the correct app depending on route Elm app would serve requests to / d o c u m e n t s Angular app would serve all other requests @_alpacaaa // #webappconf17
42. Elm is ready for production use, today. @_alpacaaa // #webappconf17
43. The Elm compiler is fantastic and super stable. @_alpacaaa // #webappconf17
44. Ecosystem http://package.elm­lang.org/ Use p o r t s for everything that's not available as a native package. @_alpacaaa // #webappconf17
45. Elm is great for teams. The Elm Architecture e l m ­ f o r m a t @_alpacaaa // #webappconf17
46. Unconventional development model Single person working on the Elm compiler, full time Not very open to contribution Elm releases take a while, focus on doing things right It's done when it's done @_alpacaaa // #webappconf17
47. Is Elm the solution? @_alpacaaa // #webappconf17
48. FP and Static Typing are the solution. @_alpacaaa // #webappconf17
49. Alternatives Typescript (with f p ­ t s ) Purescript ReasonML Fable (F#) @_alpacaaa // #webappconf17
50. Join The FP Revolution #fp on italiajs.slack.com @_alpacaaa // #webappconf17
51. Thanks! Send me your runtime errors on Twitter: @_alpacaaa @_alpacaaa // #webappconf17