Angular Advanced:
State Management
Whoami
Alexandru Albu
Trainer @JSLeague
frontend developer @6yo
design: photoshop, illustrator
development: javascript. python, sql, mongo
tools: docker, cypress, jest
and gaming and basketball
INTRO
Angular Advanced: State Management
Angular Advanced: State Management
Angular Advanced: State Management
state
server data
user information
user input
ui state
router / location state
Angular Advanced: State Management
Angular Advanced: State Management
Why?
the reason behind state management
Angular Advanced: State Management
How?
the process to get to state management
Angular Advanced: State Management
What?
the tool to handle states
REDUX
Angular Advanced: State Management
Angular Advanced: State Management
principles
single source of truth
state is read-only
pure functions update the state
Angular Advanced: State Management
core concepts
single state tree
actions
reducers
store
one way data flow
Angular Advanced: State Management
how does it work?
component triggers action
action is dispatched to reducer
reducer processes action and returns new state
store is updated with new state
store notifies subscribers
Q&A
Angular Advanced: State Management
Thank you!