Pro Yearly is on sale from $80 to $50! »

Intro to Elm - RRuG 05/2016

Intro to Elm - RRuG 05/2016

An intro to the Elm programming languague

55e2e1f28b890e26c101ed44c5f1d3af?s=128

kickinbahk

May 11, 2016
Tweet

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...