using react js to drive change at a car maker
TRANSCRIPT
APPS
MANAGERENGINEERSUPPLIERS
Yes/NoYes/NoYes/NoYes/NoYes/NoYes/No
Question
Question
Question
Evidence Yes/NoYes/NoYes/NoYes/NoYes/NoYes/No
Question
Question
Question
Accept?
PLATFORM
SUPPLIER DATA (SAP) HR DATA (SAP) DELIVERY CAPACITY PARTS DATA
MARIA DB
CMSWSO2
HTTP SERVER
USERS
MANAGER
SUPPLIER DATA (SAP) HR DATA (SAP) DELIVERY CAPACITY PARTS DATA
ENGINEERSUPPLIERS
MARIA DB
CMSWSO2
HTTP SERVER
REDUX
+
VIEW (COMPONENTS)
1. INTERACTION5. NEW STATE
2. DISPATCHACTION
3. OLD STATE
4. NEW STATE
ACTIONCREATORS
STORE REDUCERS
COMPOSITION
containerComponent containerComponent.js
presentationComponent
presentationComponent.js
presentationComponent.scss
containerComponent containerComponent.js
presentationComponent
presentationComponent.js
presentationComponent.scss
COMPOSITION
containerComponent containerComponent.js
presentationComponent
presentationComponent.js
presentationComponent.scss
COMPOSITION
ITERATIVE APPROACH
INTERACTIVEWIREFRAME
VALIDATEWITH PRODUCT OWNERS
TESTWITH ENGINEERS
ITERATEPROTOTYPE
REACT LINKSIntroduction: https://facebook.github.io/react/ Documentation: https://facebook.github.io/react/docs/getting-started.html Training videos: https://egghead.io/ Using React and Webpack: http://survivejs.com/webpack_react/introduction Community chat: http://www.reactiflux.com/ (via Discord) Redux: http://rackt.org/redux/ (documentation)
How to learn the React ecosystem in an order that makes you productive without feeling overwhelmed by tool fatigue: https://github.com/petehunt/react-howto https://github.com/gaearon/react-makes-you-sad
Code style guide: https://github.com/airbnb/javascript/tree/master/react React cheat sheet: http://reactcheatsheet.com/
THANK YOU
twitter: @richmcmRichard McMenamin