Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Give Elm a Chance! (that conference)

Joel Clermont
August 08, 2017
140

Give Elm a Chance! (that conference)

Joel Clermont

August 08, 2017
Tweet

Transcript


  1. Give Elm a Chance!
    Joel Clermont

    @jclermont

    View Slide

  2. Hello audience

    View Slide

  3. Goal

    You leave here wanting to

    play with Elm for an afternoon

    View Slide

  4. What to expect
    Elm language tour

    View Slide

  5. What to expect
    What is Elm?

    View Slide

  6. What to expect
    Why bother with Elm instead of Javascript?

    View Slide

  7. What to expect
    What makes Elm useful and interesting?
    • Code that doesn’t crash
    • A powerful type system
    • Ecosystem: quality over quantity
    • Care-free refactoring
    • Amazing QA / debug experience

    View Slide

  8. What is Elm?

    View Slide

  9. What is Elm?
    Elm is a language that compiles to JS

    View Slide

  10. What is Elm?
    Elm (currently) targets the browser

    View Slide

  11. What is Elm?
    Elm does not replace PHP, C#, Elixir, etc

    View Slide

  12. What is Elm?
    Elm does not (yet) replace JavaScript

    View Slide

  13. The Elm Architecture

    View Slide

  14. Language + Framework

    View Slide

  15. Model

    View Slide

  16. Update

    View Slide

  17. View

    View Slide

  18. View Slide

  19. No side effects

    View Slide

  20. Questions?

    View Slide

  21. Why bother with Elm
    instead of Javascript?

    View Slide

  22. View Slide

  23. Why bother with Elm instead of
    Javascript?
    User interfaces get complex quickly

    View Slide

  24. View Slide

  25. View Slide

  26. View Slide

  27. View Slide

  28. What makes Elm
    useful and interesting?

    View Slide

  29. No runtime exceptions

    View Slide

  30. No runtime exceptions
    • Hooray, no bugs! Not quite.

    View Slide

  31. No runtime exceptions
    • Hooray, no bugs! Not quite.
    • Runtime exceptions are a common class of bugs

    View Slide

  32. No runtime exceptions
    • Hooray, no bugs! Not quite.
    • Runtime exceptions are a common class of bugs
    • “undefined is not a function”

    View Slide

  33. No Red Ink’s testimonial
    Since we began using Elm in 2015, our production Elm
    code has yet to cause a single runtime exception. Our
    error logs show plenty of crashes from our legacy
    JavaScript code, but none from our Elm code. We've also
    found our Elm-powered front-end substantially easier to
    scale than our previous React code base.

    View Slide

  34. Spot the error

    View Slide

  35. Pattern matching

    View Slide

  36. Error handling in types

    View Slide

  37. Algebraic data types

    View Slide

  38. The power of the type system
    • PHP’s type system is getting better, but still basic
    • C# and Java? Better yet, but not very expressive
    • ML type system

    View Slide

  39. Data modeling!!
    https://youtu.be/IcgmSRJHu_8

    View Slide

  40. Refactoring
    • refactoring can be scary on
    larger projects, even with tests
    • First few times, I thought it
    couldn’t possibly be that easy
    in Elm
    • Move things around, get
    everything to compile, done

    View Slide

  41. Questions?

    View Slide

  42. Ecosystem

    View Slide

  43. Elm ecosystem
    • Package manager enforces semantic versioning

    View Slide

  44. Elm ecosystem
    • Package manager enforces semantic versioning
    • API design is extremely thoughtful

    View Slide

  45. Elm ecosystem
    • Package manager enforces semantic versioning
    • API design is extremely thoughtful
    • Awesome tooling!

    View Slide

  46. Compiler

    View Slide

  47. Editors

    View Slide

  48. Editors

    View Slide

  49. Editors

    View Slide

  50. Editors

    View Slide

  51. Editors

    View Slide

  52. Debugger
    http://elm-lang.org/assets/blog/0.18/todomvc.html

    View Slide

  53. Ellie
    https://ellie-app.com/kLKCgY6sK9/0

    View Slide

  54. Bonus Elm Goodies
    Elm Search
    Elm CSS
    Style Elements

    View Slide

  55. Questions?

    View Slide

  56. My story with Elm

    View Slide

  57. My final sales pitch
    • Welcoming community
    • Lots of effort to making concepts accessible
    • Easy to use it gradually
    • Will make you a better JavaScript developer
    • Developing with Elm is fun!

    View Slide

  58. Closing survey

    View Slide

  59. Next steps
    • http://elm-lang.org
    • https://guide.elm-lang.org/
    • https://pragmaticstudio.com/elm
    • https://frontendmasters.com/courses/elm/
    • https://www.dailydrip.com/topics/elm
    • @elmlang @czaplic @rtfeldman @jclermont

    View Slide

  60. I want to hear from you

    @jclermont

    View Slide

  61. Questions?
    @jclermont

    View Slide

  62. Thank you!
    @jclermont


    View Slide