Elm - A new approach to building the front end

Transcript

1. Elm
 A new approach to building the front end Joel

   Clermont
 @jclermont

2. What to expect • Elm language tour

3. What to expect • Elm language tour • Application architecture

   overview

4. What to expect • Elm language tour • Application architecture

   overview • Tour an Elm app

5. What to expect • Elm language tour • Application architecture

   overview • Tour an Elm app • How does this fit in with my current process?

6. What to expect • Elm language tour • Application architecture

   overview • Tour an Elm app • How does this fit in with my current process? • Tooling

7. What to expect • Elm language tour • Application architecture

   overview • Tour an Elm app • How does this fit in with my current process? • Tooling • Why should I give Elm a try?

8. Elm as a language

9. Pure Functions

10. Immutable Data

11. Statically Typed (plus types as data)

12. Statically Typed (another example)

13. Functional Programming • higher-order functions • currying • recursion •

    pattern matching

14. All hail the pipe!

15. Questions?

16. Elm architecture

17. Model

18. Update

19. View

20. Questions?

21. Tour a simple app

22. Model

23. Update

24. View

25. None

26. Questions?

27. How does this fit in?

28. From Elm to your browser • compile to JS

29. From Elm to your browser • compile to JS •

    link JS source in your web app

30. From Elm to your browser • compile to JS •

    link JS source in your web app • Elm.fullscreen

31. From Elm to your browser • compile to JS •

    link JS source in your web app • Elm.fullscreen • Elm.embed

32. It’s just HTML/CSS/JS

33. Excellent JS interop

34. Questions?

35. Tooling

36. Compiler

37. Excellent tooling • Package manager

38. Excellent tooling • Package manager • REPL

39. Excellent tooling • Package manager • REPL • Interactive debugger

40. Excellent tooling • Package manager • REPL • Interactive debugger

    • Great documentation

41. Questions?

42. Why should I consider Elm? • It’s fast

43. Why should I consider Elm? • It’s fast • It’s

    safe

44. Why should I consider Elm? • It’s fast • It’s

    safe • Great tooling and ecosystem

45. Why should I consider Elm? • It’s fast • It’s

    safe • Great tooling and ecosystem • Easy to integrate gradually

46. Why should I consider Elm? • It’s fast • It’s

    safe • Great tooling and ecosystem • Easy to integrate gradually • It’s FUN

47. Next steps • http://elm-lang.org (live demos, debugger, REPL) • https://pragmaticstudio.com/elm

    • https://pragmaticstudio.com/blog/2014/12/19/ getting-started-with-elm • @elmlang @czaplic @rtfeldman • http://noredinktech.tumblr.com

48. Questions? @jclermont

49. https://joind.in/15744 Thank you! @jclermont