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

Elm: A new approach to building the front end

Sponsored · Your Podcast. Everywhere. Effortlessly. Share. Educate. Inspire. Entertain. You do you. We'll handle the rest. →
Avatar for Joel Clermont Joel Clermont
September 22, 2015
Technology
120
0

Elm: A new approach to building the front end

Avatar for Joel Clermont

Joel Clermont

September 22, 2015

More Decks by Joel Clermont

See All by Joel Clermont
How to get unstuck
Avatar for Joel Clermont jclermont
0
180
Level Up Your Code Quality
Avatar for Joel Clermont jclermont
0
370
How to Save Time
Avatar for Joel Clermont jclermont
0
48
F# Type Providers
Avatar for Joel Clermont jclermont
0
110
Give Elm a Chance! (that conference)
Avatar for Joel Clermont jclermont
0
330
Give Elm a Chance (newCodeCamp)
Avatar for Joel Clermont jclermont
0
320
Give Elm a Chance!
Avatar for Joel Clermont jclermont
0
330
Property-based testing: work harder, not smarter
Avatar for Joel Clermont jclermont
0
470
Elm - A new approach to building the front end
Avatar for Joel Clermont jclermont
0
440

Other Decks in Technology

See All in Technology
Hacobu Tech Deck
Avatar for Hacobu hacobu
PRO
0
120
The Journey of Box Building
Avatar for Satoshi Tagomori tagomoris
4
3.2k
Expiration of Secure Boot Certificates for vSphere Virtual Machines
Avatar for MasahiroIrie mirie_sd
0
100
AI: Making Admin and Users, Lives Better
Avatar for Keith Brooks kbmsg
0
110
マルチエージェント × ハーネスエンジニアリング × GitLab Duo Agent Platformで実現する「AIエージェントに仕事をさせる時代へ。」 / 20260421 GitLab Duo Agent Platform
Avatar for Niishi Kubo n11sh1
0
170
Shipping AI Agents — Lessons from Production
Avatar for vvatanabe vvatanabe
0
280
AI駆動1on1〜AIに自分を育ててもらう〜
Avatar for Yoshiaki Yasuda yoshiakiyasuda
0
130
実践ハーネスエンジニアリング：TAKTで実現するAIエージェント制御 / Practical Harness Engineering: AI Agent Control Enabled by TAKT
Avatar for nrs nrslib
12
4.7k
Microsoft 365 / Microsoft 365 Copilot : 自分の状態を確認する「ラベル」について
Avatar for Taichi Nakamura taichinakamura
0
310
AgentCore×VPCでの設計パターンn選と勘所
Avatar for Har1101 har1101
3
290
目的ファーストのハーネス設計 ~ハーネスの変更容易性を高めるための優先順位~
Avatar for Gota gotalab555
8
2.2k
Route 53 Global Resolver で高額課金発生！
Avatar for otanikohei otanikohei2023
0
110

Featured

See All Featured
Leveraging Curiosity to Care for An Aging Population
Avatar for Cassini Nazir cassininazir
1
220
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
Avatar for Eileen M. Uchitelle eileencodes
27
3.4k
SEOcharity - Dark patterns in SEO and UX: How to avoid them and build a more ethical web
Avatar for Sara Fernández Carmona sarafernandez
0
170
How Software Deployment tools have changed in the past 20 years
Avatar for Geshan Manandhar geshan
0
33k
HU Berlin: Industrial-Strength Natural Language Processing with spaCy and Prodigy
Avatar for Ines Montani inesmontani
PRO
0
320
Done Done
Avatar for chrislema chrislema
186
16k
Taking LLMs out of the black box: A practical guide to human-in-the-loop distillation
Avatar for Ines Montani inesmontani
PRO
3
2.1k
Color Theory Basics | Prateek | Gurzu
Avatar for Gurzu gurzu
0
290
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
Avatar for Addy Osmani addyosmani
10
1.1k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
Avatar for Marc Duiker marcduiker
35
2.4k
Tell your own story through comics
Avatar for letsgokoyo letsgokoyo
1
900
The Success of Rails: Ensuring Growth for the Next 100 Years
Avatar for Eileen M. Uchitelle eileencodes
47
8.1k

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

  12. Statically Typed

  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

    • @elmlang • @czaplic • @rtfeldman • http://noredinktech.tumblr.com

  48. Questions? @jclermont

  49. Thank you! @jclermont