Re:code, FRP

1. FRP
FOR
DUMMIES

2. INSTRUCTIONS FOR USE
EDIT IN GOOGLE SLIDES
Click on the button under the presentation preview
that says "Use as Google Slides Theme".
You will get a copy of this document on your Google
Drive and will be able to edit, add or delete slides.
You have to be signed in to your Google account.
EDIT IN POWERPOINT®
Click on the button under the presentation preview that
says "Download as PowerPoint template". You will get a
.pptx file that you can edit in PowerPoint.
Remember to download and install the fonts used in this
presentation (you’ll find the links to the font files needed in
the Presentation design slide)
More info on how to use this template at www.slidescarnival.com/help-use-presentation-template
This template is free to use under Creative Commons Attribution license. You can keep the Credits slide or mention
SlidesCarnival and other resources used in a slide footer.

3. TRANSITION
HEADLINE
Let’s start with the first set of slides

6. THIS IS A SLIDE
TITLE∎ Here you have a list of items
∎ And some text
∎ But remember not to overload your slides with content
Your audience will listen to you or read the content, but won’t do both.

7. SPLIT YOUR
CONTENT

8. INSTRUCTIONS FOR USE
EDIT IN GOOGLE SLIDES
Click on the button under the presentation preview
that says "Use as Google Slides Theme".
You will get a copy of this document on your Google
Drive and will be able to edit, add or delete slides.
You have to be signed in to your Google account.
EDIT IN POWERPOINT®
Click on the button under the presentation preview that
says "Download as PowerPoint template". You will get a
.pptx file that you can edit in PowerPoint.
Remember to download and install the fonts used in this
presentation (you’ll find the links to the font files needed in
the Presentation design slide)

9. AND TABLES

10. Основные особенности и действия со стримами
● Стрим может быть дан на вход другому стриму
● Стримы можно соединять(merge)
● Стримы можно также фильтровать
● Можно мапить значения стримов

11. Стрим может emit-ить
1. Значения
2. Ошибку
3. Сигнал завершения

13. Что такое
асинхронность?

15. THIS IS A SLIDE
TITLE
1. Default-ная загрузка 3 вариантов
2. Search / refresh кнопки
3. Другой вариант

16. var stream = Rx.Observable.just('URL');
stream.subscribe(function(requestUrl) {
jQuery.getJSON(requestUrl, function(responseData) {
});
}

17. requestStream.subscribe(function(requestUrl) {
// execute the request
var responseStream = Rx.Observable.create(function (observer) {
jQuery.getJSON(requestUrl)
.done(function(response) { observer.onNext(response); })
.fail(function(jqXHR, status, error) { observer.onError(error); })
.always(function() { observer.onCompleted(); });
});
responseStream.subscribe(function(response) {
// do something with the response
});
}

18. INSTRUCTIONS FOR USE
EDIT IN GOOGLE SLIDES
Click on the button under the presentation preview
that says "Use as Google Slides Theme".
You will get a copy of this document on your Google
Drive and will be able to edit, add or delete slides.
You have to be signed in to your Google account.
EDIT IN POWERPOINT®
Click on the button under the presentation preview that
says "Download as PowerPoint template". You will get a
.pptx file that you can edit in PowerPoint.
Remember to download and install the fonts used in this
presentation (you’ll find the links to the font files needed in
the Presentation design slide)
YES

20. var responseStream = requestStream
.map(function(requestUrl) {
return Rx.Observable.fromPromise(jQuery.getJSON(requestUrl));
});

21. var responseMetastream = requestStream
.map(function(requestUrl) {
return Rx.Observable.fromPromise(jQuery.getJSON(requestUrl));
});
Что будет возвращать stream?

22. AND TABLES

24. var requestStream = Rx.Observable.just('https://api.com/users');
var responseStream = requestStream
.flatMap(function(requestUrl) {
return Rx.Observable.fromPromise(jQuery.getJSON(requestUrl));
});
responseStream.subscribe(function(response) {
// render `response` to the DOM however you wish
});

25. var refreshButton = document.querySelector('.refresh');
var refreshClickStream = Rx.Observable.fromEvent(refreshButton, 'click');

26. var requestStream = refreshClickStream
.map(function() {
var randomOffset = Math.floor(Math.random()*500);
return 'https://api.com/users?since=' + randomOffset;
});

27. var requestOnRefreshStream = refreshClickStream
.map(function() {
var randomOffset = Math.floor(Math.random()*500);
return 'https://api.com/users?since=' + randomOffset;
});
var startupRequestStream = Rx.Observable.just('https://api.com/users');
var requestStream = Rx.Observable.merge(
requestOnRefreshStream, startupRequestStream
);

28. map, flatMap
vs
for, if, while

30. Reactive is not
only Rx.*

31. INSTRUCTIONS FOR USE

32. TRANSITION
HEADLINE
Let’s start with the first set of slides

33. Thanks!k.arshuk-
popov@crossroadlabs.xyz