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
97
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
97
Level Up Your Code Quality
jclermont
0
310
How to Save Time
jclermont
0
32
F# Type Providers
jclermont
0
75
Give Elm a Chance! (that conference)
jclermont
0
260
Give Elm a Chance (newCodeCamp)
jclermont
0
240
Give Elm a Chance!
jclermont
0
260
Property-based testing: work harder, not smarter
jclermont
0
410
Elm - A new approach to building the front end
jclermont
0
400
Other Decks in Technology
See All in Technology
非機能品質を作り込むための実践アーキテクチャ
knih
3
840
re:Invent 2024 Innovation Talks(NET201)で語られた大切なこと
shotashiratori
0
300
継続的にアウトカムを生み出し ビジネスにつなげる、 戦略と運営に対するタイミーのQUEST(探求)
zigorou
0
520
多領域インシデントマネジメントへの挑戦:ハードウェアとソフトウェアの融合が生む課題/Challenge to multidisciplinary incident management: Issues created by the fusion of hardware and software
bitkey
PRO
2
100
株式会社ログラス − エンジニア向け会社説明資料 / Loglass Comapany Deck for Engineer
loglass2019
3
31k
Jetpack Composeで始めるServer Cache State
ogaclejapan
2
160
DevOps視点でAWS re:invent2024の新サービス・アプデを振り返ってみた
oshanqq
0
180
WACATE2024冬セッション資料(ユーザビリティ)
scarletplover
0
190
ブラックフライデーで購入したPixel9で、Gemini Nanoを動かしてみた
marchin1989
1
520
オプトインカメラ:UWB測位を応用したオプトイン型のカメラ計測
matthewlujp
0
170
Microsoft Azure全冠になってみた ~アレを使い倒した者が試験を制す!?~/Obtained all Microsoft Azure certifications Those who use "that" to the full will win the exam! ?
yuj1osm
1
110
re:Invent をおうちで楽しんでみた ~CloudWatch のオブザーバビリティ機能がスゴい!/ Enjoyed AWS re:Invent from Home and CloudWatch Observability Feature is Amazing!
yuj1osm
0
120
Featured
See All Featured
The Art of Programming - Codeland 2020
erikaheidi
53
13k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
45
2.2k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
95
17k
Imperfection Machines: The Place of Print at Facebook
scottboms
266
13k
What’s in a name? Adding method to the madness
productmarketing
PRO
22
3.2k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
247
1.3M
Facilitating Awesome Meetings
lara
50
6.1k
Put a Button on it: Removing Barriers to Going Fast.
kastner
59
3.6k
The Straight Up "How To Draw Better" Workshop
denniskardys
232
140k
Building Better People: How to give real-time feedback that sticks.
wjessup
365
19k
Making the Leap to Tech Lead
cromwellryan
133
9k
Automating Front-end Workflow
addyosmani
1366
200k
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