kuncevic.dev
TOC
✅ Single Page Apps (SPA)
✅ Reactive Services and RxJS
✅ rx-service library
Slide 8
Slide 8 text
kuncevic.dev
Angular vs AngularJS
2+
1.x
Slide 9
Slide 9 text
kuncevic.dev
npm show @angular/core version
Slide 10
Slide 10 text
kuncevic.dev
RxJS
Slide 11
Slide 11 text
kuncevic.dev
What is the most common
challenge in SPA's ?
Slide 12
Slide 12 text
kuncevic.dev
Component communication
Slide 13
Slide 13 text
kuncevic.dev
Component communication
Slide 14
Slide 14 text
kuncevic.dev
Parent
Nested components
Child 1
Child 2
Child N
Slide 15
Slide 15 text
kuncevic.dev
Parent
Child 1
Component communication
Child 2
Child N
Slide 16
Slide 16 text
kuncevic.dev
Parent
Child 1
Component communication
Child 2
Child N
Sibling
Slide 17
Slide 17 text
kuncevic.dev
Basic example
Slide 18
Slide 18 text
kuncevic.dev
Basic solution
✅ Parent to Child @Input()
✅ Child to Parent @Output()
Slide 19
Slide 19 text
kuncevic.dev
Nested components
@Input() and @Output()
Slide 20
Slide 20 text
kuncevic.dev
Reactive Services
Slide 21
Slide 21 text
kuncevic.dev
Reactive Services
Slide 22
Slide 22 text
kuncevic.dev
What is Service ?
Slide 23
Slide 23 text
kuncevic.dev
What is Reactive Service ?
Slide 24
Slide 24 text
kuncevic.dev
RxJS BehaviorSubject
✅ Set initial value
✅ Set new value
✅ Get current value
Slide 25
Slide 25 text
kuncevic.dev
Demo
Slide 26
Slide 26 text
kuncevic.dev
Can we do better than that ?
Slide 27
Slide 27 text
kuncevic.dev
Slide 28
Slide 28 text
kuncevic.dev
rx-service
Slide 29
Slide 29 text
kuncevic.dev
github.com/kuncevic/rx-service
Slide 30
Slide 30 text
kuncevic.dev
Demo
Slide 31
Slide 31 text
kuncevic.dev
Component Communication
Reactive Services and RxJS
Reactive Services in Angular
rx-service library
Slide 32
Slide 32 text
kuncevic.dev
Slide 33
Slide 33 text
kuncevic.dev
twitter.com/kuncevic
linkedin.com/in/kuncevic
Th nk you!
dev.to/kuncevic
Slide 34
Slide 34 text
kuncevic.dev
kuncevic.dev/daily
Slide 35
Slide 35 text
kuncevic.dev
meetup.com/Angular-Sydney
Slide 36
Slide 36 text
kuncevic.dev
Links
Demo code and full talk video
github.com/kuncevic/progressive-state-manag
ement-with-ngxs
youtu.be/mY9rlno7_uc
rx-service library
github.com/kuncevic/rx-service