Managing State in Frontend WebApps With Redux
Who's this guy
George Spake
IT Analyst at Web Services UTHSC
Passionate Programmer
Open Source Software Tech Community Evangelist
Memphis User Group Organizer / Speaker
Crummy Banjo Player
Twitter: @georgespake
Github: gpspake
georgespake.com
The State (heh) Of the web
New Challenges
And New Solutions
2010 / 2011
responsive design
Single page apps
js Evolution
React & redux
React
A JAVASCRIPT LIBRARY FOR BUILDING USER INTERFACES
https://facebook.github.io/react/
Redux
A predictable state container for JavaScript apps
http://redux.js.org/
THE problem
The DOM
Document Object Model
Photo of a web developer manipulating the DOM
DOM vs. HTML
you don't like javascript?
Well, actually...
Javascript & THe DOM API
Toggle a class
youmightnotneedjquery.com
JQUERY
Toggle a class
Text
youmightnotneedjquery.com
A Gift and a Curse
State
The dom is a crummy
state container
The Solution
Redux
egghead.io/courses/getting-started-with-redux
Redux
Three Principles
Single SOURCE OF TRUTH
STATE IS READ ONLY
Changes are made with pure functions
http://redux.js.org/docs/introduction/ThreePrinciples.html
Technical debt
vs
Technical Investment
DEMO
github.com/gpspake/laravel-api-demo-client
github.com/gpspake/redux-raffle
Wanna actually Learn this stuff?
Slides and notes
georgespake.com/blog/state-react-redux