Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Elm: A new approach to building the front end
Search
Joel Clermont
September 22, 2015
Technology
0
110
Elm: A new approach to building the front end
Joel Clermont
September 22, 2015
Tweet
Share
More Decks by Joel Clermont
See All by Joel Clermont
How to get unstuck
jclermont
0
160
Level Up Your Code Quality
jclermont
0
350
How to Save Time
jclermont
0
37
F# Type Providers
jclermont
0
92
Give Elm a Chance! (that conference)
jclermont
0
300
Give Elm a Chance (newCodeCamp)
jclermont
0
300
Give Elm a Chance!
jclermont
0
310
Property-based testing: work harder, not smarter
jclermont
0
450
Elm - A new approach to building the front end
jclermont
0
430
Other Decks in Technology
See All in Technology
激動の2025年、Modern Data Stackの最新技術動向
sagara
0
850
Digitization部 紹介資料
sansan33
PRO
1
5.8k
re:Inventに行くまでにやっておきたいこと
nagisa53
0
1.1k
初海外がre:Inventだった人間の感じたこと
tommy0124
1
200
日本のソブリンAIを支えるエヌビディアの生成AIエコシステム
acceleratedmu3n
0
130
kotlin-lsp の開発開始に触発されて、Emacs で Kotlin 開発に挑戦した記録 / kotlin‑lsp as a Catalyst: My Journey to Kotlin Development in Emacs
nabeo
2
340
NOT A HOTEL SOFTWARE DECK (2025/11/06)
notahotel
0
3.2k
AIがコードを書いてくれるなら、新米エンジニアは何をする? / komekaigi2025
nkzn
25
17k
JAWS UG AI/ML #32 Amazon BedrockモデルのライフサイクルとEOL対応/How Amazon Bedrock Model Lifecycle Works
quiver
1
830
AI連携の新常識! 話題のMCPをはじめて学ぶ!
makoakiba
0
180
今のコンピュータ、AI にも Web にも 向いていないので 作り直そう!!
piacerex
0
650
AIエージェントを導入する [ 社内ナレッジ活用編 ] / Implement AI agents
glidenote
1
220
Featured
See All Featured
Optimising Largest Contentful Paint
csswizardry
37
3.5k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
253
22k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
333
22k
Code Review Best Practice
trishagee
72
19k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
231
22k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
31
2.9k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
132
19k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
54k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
21
1.2k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
37
2.6k
Embracing the Ebb and Flow
colly
88
4.9k
Designing for humans not robots
tammielis
254
26k
Transcript
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
Statically Typed
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
• @elmlang • @czaplic • @rtfeldman • http://noredinktech.tumblr.com
Questions? @jclermont
Thank you! @jclermont