Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
Elm - A new approach to building the front end
Search
Joel Clermont
November 06, 2015
Programming
470
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Elm - A new approach to building the front end
As delivered at True North PHP 2015
Joel Clermont
November 06, 2015
Transcript
49 slides
Elm A new approach to building the front end Joel
Clermont @jclermont
What to expect • Elm language tour
What to expect • Elm language tour • Application architecture
overview
What to expect • Elm language tour • Application architecture
overview • Tour an Elm app
What to expect • Elm language tour • Application architecture
overview • Tour an Elm app • How does this fit in with my current process?
What to expect • Elm language tour • Application architecture
overview • Tour an Elm app • How does this fit in with my current process? • Tooling
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?
Elm as a language
Pure Functions
Immutable Data
Statically Typed (plus types as data)
Statically Typed (another example)
Functional Programming • higher-order functions • currying • recursion •
pattern matching
All hail the pipe!
Questions?
Elm architecture
Model
Update
View
Questions?
Tour a simple app
Model
Update
View
None
Questions?
How does this fit in?
From Elm to your browser • compile to JS
From Elm to your browser • compile to JS •
link JS source in your web app
From Elm to your browser • compile to JS •
link JS source in your web app • Elm.fullscreen
From Elm to your browser • compile to JS •
link JS source in your web app • Elm.fullscreen • Elm.embed
It’s just HTML/CSS/JS
Excellent JS interop
Questions?
Tooling
Compiler
Excellent tooling • Package manager
Excellent tooling • Package manager • REPL
Excellent tooling • Package manager • REPL • Interactive debugger
Excellent tooling • Package manager • REPL • Interactive debugger
• Great documentation
Questions?
Why should I consider Elm? • It’s fast
Why should I consider Elm? • It’s fast • It’s
safe
Why should I consider Elm? • It’s fast • It’s
safe • Great tooling and ecosystem
Why should I consider Elm? • It’s fast • It’s
safe • Great tooling and ecosystem • Easy to integrate gradually
Why should I consider Elm? • It’s fast • It’s
safe • Great tooling and ecosystem • Easy to integrate gradually • It’s FUN
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
Questions? @jclermont
https://joind.in/15744 Thank you! @jclermont
More Decks by Joel Clermont
See All by Joel Clermont
How to get unstuck
jclermont
0
220
Level Up Your Code Quality
jclermont
0
420
How to Save Time
jclermont
0
65
F# Type Providers
jclermont
0
120
Give Elm a Chance! (that conference)
jclermont
0
370
Give Elm a Chance (newCodeCamp)
jclermont
0
350
Give Elm a Chance!
jclermont
0
360
Property-based testing: work harder, not smarter
jclermont
0
510
Elm: A new approach to building the front end
jclermont
0
140
Other Decks in Programming
See All in Programming
TanStack Vue Query と Pinia Colada から学ぶ非同期状態の型設計
aoshi
0
660
Apple Intelligenceとオンデバイス時代の到来
yahir0
0
240
3回つくってわかった、 定期実行ジョブ基盤の本質情報
takai
4
3.9k
現場と育てるRailsモデリング 〜Spreadsheetから始めたモデル設計〜
siroemk
2
1.2k
まずはコードより業務と向き合う:テーブル解体のためにPdMを呼んだ話
sakawe_ee
0
220
Engineering Biometric UX Across Android Versions | DroidKnights 2026
ryunen344
1
200
Coding with AI: How to trust the storyteller (AWS Community Day Adria, Ljubljana 2026)
slobodan
0
140
flutter_test のその先へ — Flutter アプリの LLM 機能に「評価」という品質保証を
kosukesaigusa
0
200
Claude Code ハーネスDeep Dive – 君はどこまで制御する? -
takateeen_knj
6
5.6k
作れるエンジニアから、価値を届けるエンジニアへ
ryunakayama
1
280
AIがコードを書いてくれる時代、我々は何を確かめるのか
yosuke_furukawa
PRO
13
5.9k
地方こそサーバーレス — 10年続けた、顔が見えるチームで確かな基盤を / Serverless Matters Most in Regional Areas — 10 Years of Building Reliable Foundations with Close-Knit Teams
seike460
PRO
1
420
Featured
See All Featured
Reality Check: Gamification 10 Years Later
codingconduct
0
2.4k
16th Malabo Montpellier Forum Presentation
akademiya2063
PRO
0
460
The #1 spot is gone: here's how to win anyway
tamaranovitovic
4
1.2k
[Rails World 2026] Durable orchestration on Rails: from continuation to workflow
palkan
4
1.2k
How to Talk to Developers About Accessibility
jct
2
620
Navigating the Design Leadership Dip - Product Design Week Design Leaders+ Conference 2024
apolaine
2
520
How to build an LLM SEO readiness audit: a practical framework
nmsamuel
2
980
XXLCSS - How to scale CSS and keep your sanity
sugarenia
250
1.3M
The AI Revolution Will Not Be Monopolized: How open-source beats economies of scale, even for LLMs
inesmontani
PRO
3
3.8k
Odyssey Design
rkendrick25
PRO
3
940
How to Think Like a Performance Engineer
csswizardry
28
2.9k
Deep Space Network (abreviated)
tonyrice
0
410