react.js and redux overview
TRANSCRIPT
React / Redux
Introduction to JavaScript components and state management
It’s an awesome time to be a front-end developer
Choose your JavaScript framework
Flexible app architecture
API 1
API 2
More vanilla JS
● ES2015 Modules● Native JavaScript APIs● Classes and Functions
ABL always be learning
Tooling
Functional Programming
OMG! They’re still using HTML tables.
Functional Programming
Reduce
Pure Functionsgiven the same arguments, they always return the same value, without producing any observable side effect
Higher-Order Functionsfunction that can take another function as an argument, or that returns a function as a result
Why React.js ?
Smart components
Dumb components
React.js ecosystem
React Native Platforms
State management
Redux
Predictability of outcome
Maintainability
Server side rendering
Ease of testing
One way data flow
Actions Reducers StorePure functions that take the current state of the application and an action and then return a new state.
Store is the object that holds the application state. Any action returns a new state via reducers.
Actions are events, which send data to store. Actions are simple objects with type and payload.
Actions Reducers Store
Actions
Reducers
Store
Redux Data Flow
Dev Tools
React + Redux app architecture
React + Redux middleware
react-router
react-redux
react-router-redux
redux-thunk
@netxm
www.priceline.com/careers
slide URL
bit.ly/redux-intro