Intro to Elm - RRuG 05/2016

An intro to the Elm programming languague

Transcript

1. Intro to Elm / Josiah Mory @kickinbahk
2. What is Elm?
3. Elm is a programming language - It compiles to HTML5: HTML, CSS and JavaScript and used to build web apps.
4. Similar to CoffeeScript or TypeScript, Elm Compiles to Javascript
5. Elm doesn’t replicate or try to mend the intricacies of JavaScript.
6. Elm is a language and ecosystem of its own, and it just happens to compile to JavaScript.
7. Evan Czaplicki - Creator of Elm
8. Inspired by the Kubler-Ross model
9. Syntax
10. Comments - - a s i n g l e l i n e c o m m e n t { - a m u l t i l i n e c o m m e n t { - c a n b e n e s t e d - } - }
11. Literals - - B o o l e a n T r u e : B o o l F a l s e : B o o l - - I n t o r F l o a t d e p e n d i n g o n u s a g e 4 2 : n u m b e r 3 . 1 4 : F l o a t ' a ' : C h a r " a b c " : S t r i n g - - m u l t i - l i n e S t r i n g " " " T h i s i s u s e f u l f o r h o l d i n g J S O N o r o t h e r c o n t e n t t h a t h a s " q u o t a t i o n m a r k s " . " " "
12. Lists [ 1 . . 4 ] [ 1 , 2 , 3 , 4 ] 1 : : [ 2 , 3 , 4 ] 1 : : 2 : : 3 : : 4 : : [ ]
13. Conditionals i f p o w e r L e v e l > 9 0 0 0 t h e n " O V E R 9 0 0 0 ! ! ! " e l s e " m e h " - - O R i f k e y = = 4 0 t h e n n + 1 e l s e i f k e y = = 3 8 t h e n n - 1 e l s e n
14. Functions s a y H e l l o n a m e = S t r i n g . a p p e n d " H e l l o " n a m e - - f u n c t i o n : S t r i n g - > S t r i n g s a y H e l l o n a m e = \ S t r i n g . a p p e n d " H e l l o " n a m e - - f u n c t i o n : S t r i n g - > S t r i n g
15. Elm Architecture
16. Model t y p e a l i a s M o d e l = { . . . }
17. Update t y p e A c t i o n = R e s e t | . . . u p d a t e : A c t i o n - > M o d e l - > M o d e l u p d a t e a c t i o n m o d e l = c a s e a c t i o n o f R e s e t - > . . . . . .
18. View v i e w : M o d e l - > H t m l v i e w = . . .
19. Why Elm?
20. 1. Functional Reactive Programming
21. Functional Functions are First Class Pure Functions - always return the same value given the same arguments
22. Pure functions - always return the same value given the same arguments, with no side-effects. In essence, the function must not depend on anything else besides the arguments, and it must not mutate anything.
23. Reactive - something that a component can start listening for, and react to the events as it pleases In Elm, these listenable things are signals. The component using a signal knows how to utilize it, but the signal has no knowledge of the component(s) that it is affecting.
24. 2. General refactoring experience is: 1. Make changes, any changes. 2. The compiler tells what you missed. 3. Go to 1.
25. 3. Strong static types Find errors fast with readable compiler messages.
26. 4. No n u l l or u n d e f i n e d Never miss a potential problem.
27. 5. Total immutability Focus on what you are writing right now without worrying about outer state.
28. 6. Purely functional Leads to decoupled and easily refactorable code.
29. 7. No runtime exceptions Gives incomparable reliability.
30. 8. Reactive by design FRP isn’t opt-in, it is baked right in the language.
31. What I think of Elm...