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

Components for managing input and state

Sponsored · Your Podcast. Everywhere. Effortlessly. Share. Educate. Inspire. Entertain. You do you. We'll handle the rest. →
Avatar for Ossi Hanhinen Ossi Hanhinen
June 06, 2016
Programming
1.6k
1

Components for managing input and state

This talk was given in the first-ever Elm Remote Meetup.

Avatar for Ossi Hanhinen

Ossi Hanhinen

June 06, 2016

More Decks by Ossi Hanhinen

See All by Ossi Hanhinen
Beyond Hello World and Todo Lists
Avatar for Ossi Hanhinen ohanhi
1
450
Confidence in the frontend with Elm
Avatar for Ossi Hanhinen ohanhi
2
1.8k
What's so special about Elm?
Avatar for Ossi Hanhinen ohanhi
1
400
HTML5 Drag and Drop API is a hot steaming 💩
Avatar for Ossi Hanhinen ohanhi
0
160
On Simplicity
Avatar for Ossi Hanhinen ohanhi
0
1.1k

Other Decks in Programming

See All in Programming
AIを導入する前にやるべきこと
Avatar for Negima negima
2
340
【26新卒研修】OpenAPI/Swagger REST API研修
Avatar for ディップ株式会社 dip_tech
PRO
0
150
2026-04-15 Spring IO - I Can See Clearly Now
Avatar for Jonatan Ivanov jonatan_ivanov
1
190
過去のレビュー知見をSkillsで資産化した話
Avatar for PKSHA Technology（パークシャテクノロジー） pkshadeck
PRO
1
1.7k
The Less-Told Story of Socket Timeouts
Avatar for Misaki Shioi(塩井美咲/しおい) coe401_
3
1.1k
AWSはOSSをどのように 考えているのか？
Avatar for アキキー | Akihisa Ikeda akihisaikeda
0
100
Explore CoroutineScope
Avatar for tomoEng11 tomoeng11
0
180
JCON - Create Agentic AI Apps, The Easy Way!
Avatar for Kevin Dubois kdubois
1
100
Making the RBS Parser Faster
Avatar for Soutaro Matsumoto soutaro
0
680
ソースコード→AST→オペコード、の旅を覗いてみる
Avatar for hideki kinjyo o0h
PRO
1
130
運転動画を検索可能にする〜Cosmos-Embed1とDatabricks Vector Searchで〜/cosmos-embed1-databricks-vector-search
Avatar for 開発室Graph studio_graph
1
680
[RubyKaigi 2026] Require Hooks
Avatar for Vladimir Dementyev palkan
1
310

Featured

See All Featured
GraphQLとの向き合い方2022年版
Avatar for Yosuke Kurami quramy
50
15k
Stop Working from a Prison Cell
Avatar for Chris Michel hatefulcrawdad
274
21k
We Have a Design System, Now What?
Avatar for Morgane Peng morganepeng
55
8.1k
How to Ace a Technical Interview
Avatar for Jacob Kaplan-Moss jacobian
281
24k
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
180
Leveraging Curiosity to Care for An Aging Population
Avatar for Cassini Nazir cassininazir
1
230
How to make the Groovebox
Avatar for あそなす asonas
2
2.2k
The #1 spot is gone: here's how to win anyway
Avatar for Tamara Novitovic tamaranovitovic
2
1k
Designing for Timeless Needs
Avatar for Cassini Nazir cassininazir
0
220
BBQ
Avatar for Matthew Crist matthewcrist
89
10k
How to Grow Your eCommerce with AI & Automation
Avatar for Katarina Dahlin katarinadahlin
PRO
1
180
The Language of Interfaces
Avatar for Des Traynor destraynor
162
26k

Transcript

  1. Components for managing input and state Ossi Hanhinen @ohanhi

  2. The Elm Architecture Msg Update User View Model View

  3. main = Html.App.program { init = init , view =

    view , update = update , subscriptions = subscriptions }

  4. App Component Init Model, Cmd Msg

  5. App Component Init Model, Cmd Msg Msg, Model Update Model,

    Cmd Msg

  6. Init Model, Cmd Msg Msg, Model Update Model, Cmd Msg

    App Components Nest Init Model, Cmd Msg Msg, Model Update Model, Cmd Msg

  7. App Components’ Public API Msg, Model Update Model, Cmd Msg

    Init Model, Cmd Msg

  8. App Components’ Public API Msg, Model Update Model, Cmd Msg

    Msg Model Model Cmd Msg Init Model, Cmd Msg

  9. Extending the Pattern Msg Model Update Init Some extra Model,

    Cmd Msg Msg, Model Some extra, Model, Cmd Msg

  10. Don’t limit yourself to just init, update and view!