Intro to elm lang

Talk given at http://fest.colombia-dev.org/

Functional programming for your web browser, with love from Medellín.

Transcript

1. ELM-lang
2. It is a js replacement as many others
3. Maintainability
4. Functional
5. Clean syntax
6. Literals
7. 3 => 3 3.1415 => 3.1415 "Hello world!" => "Hello world!" true => True [1,2,3] => [1,2,3]
8. js => elm Diffs
9. (?) Multiline strings not widely supported (?) """multiline string"""
10. (js) Multiline strings not widely supported (elm) """multiline string"""
11. (?) Cannot use single quotes for strings (?) 'Hello world!'
12. (elm) Cannot use single quotes for strings (js) 'Hello world!'
13. (?) No distinction between characters and strings (?) 'a'
14. (js) No distinction between characters and strings (elm) 'a'
15. Functions
16. function(x,y) { return x + y; }
17. \x y -> x + y
18. Math.max(3, 4)
19. max 3 4
20. Math.min(1, Math.pow(2, 4))
21. min 1 (2^4)
22. numbers.map(Math.sqrt)
23. List.map sqrt numbers
24. points.map(function(p) { return p.x })
25. List.map .x points
26. Inmutable data
27. Pure functions
28. Tasks monads?
29. No runtime exceptions
30. JS
31. var message = "Hello world!;
32. Error ???
33. $ node js-ex/ex1.js /Users/sarcilav/Desktop/fest/js-ex/ex1.js:1 n (exports, require, module, __filename, __dirname) { var message = "Hello wor ^^^^^^^^^^^^^^ SyntaxError: Unexpected token ILLEGAL at Module._compile (module.js:439:25) at Object.Module._extensions..js (module.js:474:10) at Module.load (module.js:356:32) at Function.Module._load (module.js:312:12) at Function.Module.runMain (module.js:497:10) at startup (node.js:119:16) at node.js:906:3
34. elm
35. let message = "Hello world!
36. Error?
37. elm-make e1.e ## ERRORS in e1.e ############################################################## -- SYNTAX PROBLEM --------------------------------------------------------- e1.e I ran into something unexpected when parsing your code! 1| let message = "Hello World! ^ I am looking for one of the following things: "\"" "\\" "\n" "\r" Detected errors in 1 module.
38. numbers = [ 1, 2, 3 ] first = List.head numbers last = List.head (List.reverse numbers) firstAndLast = first + last
39. what is the expected value of doubleFirst?
40. what if numbers is []?
41. JS
42. NaN
43. Elm ?
44. ???
45. Surprise!!! It doesn't compile
46. $ elm-make e2.elm ## ERRORS in e2.elm ############################################################ -- TYPE MISMATCH -------------------------------------------------------- e2.elm The right argument of (+) is causing a type mismatch. 7| first + last ^^^^ As I infer the type of values flowing through your program, I see a conflict between these two types: number Maybe number ...
47. -- TYPE MISMATCH -------------------------------------------------------- e2.elm The left argument of (+) is causing a type mismatch. 7| first + last ^^^^^ As I infer the type of values flowing through your program, I see a conflict between these two types: number Maybe number Detected errors in 1 module.
48. numbers = [ 1, 2, 3 ] first = Maybe.withDefault 0 (List.head numbers) last = Maybe.withDefault 0 (List.head (List.reverse numbers)) firstAndLast = first + last
49. import List exposing (..) import Maybe exposing (withDefault) numbers = [ 1, 2, 3 ] first = withDefault 0 (head numbers) last = withDefault 0 (head (reverse numbers)) firstAndLast = first + last
50. Not intelligent enough for you?
51. first = List.heat numbers
52. $ elm-make e2.elm ## ERRORS in e2.elm ############################################################ -- NAMING ERROR --------------------------------------------------------- e2.elm Cannot find variable `List.heat`. 15| first = List.heat numbers ^^^^^^^^^ `List` does not expose `heat`. Maybe you want one of the following? List.head Detected errors in 1 module.
53. Does it still work with the imports?
54. first = heat numbers
55. $ elm-make e2.elm ## ERRORS in e2.elm ############################################################ -- NAMING ERROR --------------------------------------------------------- e2.elm Cannot find variable `heat` 15| first = heat numbers ^^^^ Maybe you want one of the following? head List.head Detected errors in 1 module.
56. Time- traveling debugger
57. http://debug.elm-lang.org/edit/Mario.elm
58. → Live reloading
59. Fast rendering
60. Benchmark
62. Average time in milliseconds.
63. Winners Om, Mercury, and Elm.
64. Winners Om, Mercury, and Elm. All three of these projects are based on the Virtual DOM approach and make heavy use of immutability to get these speed gains.
65. References (1) → Elm lang docs and references http://elm- lang.org/ → Elm: Concurrent FRP for Functional GUIs, Evan Czaplicki, 30 March 2012.
66. References (2) → Asynchronous Functional Reactive Programming for GUIs, Evan Czaplicki, Harvard University, evan.czaplicki@post.harvard.edu, Stephen Chong, Harvard University, chong@seas.harvard.edu → Mario example https://github.com/evancz/elm- examples/blob/master/Mario.elm → Benchmark http://evancz.github.io/todomvc-perf- comparison/
67. @sarcilav