SlideShare a Scribd company logo

Thinking Reactively

Sabin Marcu, profile picture
Sabin Marcu

The document provides an overview of a developer's background, showcasing their skills in various programming languages such as Java, C++, and JavaScript, alongside their experience in web development and leading projects. It discusses the frameworks and technologies they've worked with, including React, Angular.js, and Node.js, highlighting their contributions to a startup in analytics. Additionally, it includes links to their projects and further resources related to React and web development.

Internet
1 of 139
Download to read offline
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
Thinking Reactively
Thinking Reactively
Thinking Reactively
! twitter.com/sabinmarcu "facebook.com/sabinmarcu # linkedin.com/in/sabinmarcu $ github.com/sabinmarcu
• Startup in Analytics ! twitter.com/sabinmarcu "facebook.com/sabinmarcu # linkedin.com/in/sabinmarcu $ github.com/sabinmarcu
• Startup in Analytics • Developer (not Web Developer / Java Developer, etc) • 3rd Year – Computer Science @ Southampton Uni • Experience: ๏ Java, C++, PHP, JavaScript ๏ Projects starting from CMS / whole systems, to libraries and experiments ! twitter.com/sabinmarcu "facebook.com/sabinmarcu # linkedin.com/in/sabinmarcu $ github.com/sabinmarcu
• Startup in Analytics • Developer (not Web Developer / Java Developer, etc) • 3rd Year – Computer Science @ Southampton Uni • Experience: ๏ Java, C++, PHP, JavaScript ๏ Projects starting from CMS / whole systems, to libraries and experiments • Web Development since 2009 • Node JS since 2011 • Angular JS since 2013 • React since 2015 ! twitter.com/sabinmarcu "facebook.com/sabinmarcu # linkedin.com/in/sabinmarcu $ github.com/sabinmarcu
• Startup in Analytics • Developer (not Web Developer / Java Developer, etc) • 3rd Year – Computer Science @ Southampton Uni • Experience: ๏ Java, C++, PHP, JavaScript ๏ Projects starting from CMS / whole systems, to libraries and experiments • Web Development since 2009 • Node JS since 2011 • Angular JS since 2013 • React since 2015 • HackaSoton director since the beginning ! twitter.com/sabinmarcu "facebook.com/sabinmarcu # linkedin.com/in/sabinmarcu $ github.com/sabinmarcu
Thinking Reactively
Thinking Reactively
• Overview • Competition
• Overview • Competition • Facebook’s Reasoning • Comparison with Angular
• Overview • Competition • Facebook’s Reasoning • Comparison with Angular • Redux • Flux • React
• Overview • Competition • Facebook’s Reasoning • Comparison with Angular • Redux • Flux • React • Examples
• Overview • Competition • Facebook’s Reasoning • Comparison with Angular • Redux • Flux • React • Examples • Recap • Questions
• Overview • Competition • Facebook’s Reasoning • Comparison with Angular • Redux • Flux • React • Examples • Recap • Questions • ???
• Overview • Competition • Facebook’s Reasoning • Comparison with Angular • Redux • Flux • React • Examples • Recap • Questions • ??? • Profit
React
React UI Framework
React UI Framework Facebook
Thinking Reactively
Thinking Reactively
Thinking Reactively
Thinking Reactively
Thinking Reactively
Thinking Reactively
Thinking Reactively
Thinking Reactively
Thinking Reactively
Thinking Reactively
Thinking Reactively
Thinking Reactively
Thinking Reactively
Basic Websites / General Website Frontend
Basic Websites / General Website Frontend Small Scripts / Fiddles
Basic Websites / General Website Frontend Small Scripts / Fiddles Showing off as a beginner
Basic Websites / General Website Frontend Small Scripts / Fiddles Showing off as a beginner
Basic Websites / General Website Frontend Small Scripts / Fiddles Showing off as a beginner NOT to be used as a primary tool with an app
Thinking Reactively
Thinking Reactively
Web applications
Web applications works with dom / svg at best
Web applications works with dom / svg at best two way data bindings
Web applications works with dom / svg at best two way data bindings
Web applications works with dom / svg at best two way data bindings scope tree
Web applications works with dom / svg at best two way data bindings scope tree
Web applications works with dom / svg at best two way data bindings scope tree digest loops
Thinking Reactively
ScopeScopeScopeScopeScope
one comment ScopeScopeScopeScopeScope
Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope
Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope one comment box author timestamp comment
Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope
Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope one comment box
Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope one comment box Comment form
Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope one comment box Comment form Comment section
Thinking Reactively
Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope
Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Comment Section
Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Comment Section Article
Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Comment Section Article Admin
Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope cope cope cope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope S Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scop Scope Scop Scop Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope
Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope cope cope cope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope S Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scop Scope Scop Scop Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope
Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope cope cope cope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope S Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scop Scope Scop Scop Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope
Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope cope cope cope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope S Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scop Scope Scop Scop Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope
Thinking Reactively
Thinking Reactively
Thinking Reactively
Thinking Reactively
React
Thinking Reactively
Workflow
1. Reducers Workflow
1. Reducers 2. Store Workflow
1. Reducers 2. Store 3. Virtual DOM Workflow
1. Reducers 2. Store 3. Virtual DOM 4. Actual Dom Workflow
1. Reducers 2. Store 3. Virtual DOM 4. Actual Dom 5. Action Workflow
1. Reducers 2. Store 3. Virtual DOM 4. Actual Dom 5. Action 6. Dispatch Workflow
1. Reducers Workflow
1. Reducers 2. Store Workflow
Reducers & Store
1. Initial State Reducers & Store
1. Initial State 2. Reducers Reducers & Store
1. Initial State 2. Reducers 3. Final State Reducers & Store
Reducers & Store 1. Initial State 2. Reducers 3. Intermediary State
Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope one comment box Comment form Comment section
Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope cope cope cope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope S Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scop Scope Scop Scop Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope
Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Sco S Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope S Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Store
Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Sco S Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope S Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Store
Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Sco S Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope S Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Store
Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Sco S Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope S Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Store Dispatch
Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Sco S Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope S Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Store Dispatch
Diffs Only changes where it’s needed
Thinking Reactively
Thinking Reactively
Thinking Reactively
Thinking Reactively
Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Legend: • Affected • Dispatcher
Thinking Reactively
React (Facebook)
Ember React (Facebook)
Incremental DOM (Google) Ember React (Facebook)
Incremental DOM (Google) Ember React (Facebook)
Thinking Reactively
Thinking Reactively
• DOM
• DOM • SVG
• DOM • SVG • Canvas
• DOM • SVG • Canvas • WebGL
• DOM • SVG • Canvas • WebGL …
• DOM • SVG • Canvas • WebGL … • Serverside?
• DOM • SVG • Canvas • WebGL … • Serverside? AngularJS
• DOM • SVG • Canvas • WebGL … • Serverside? Incremental DOM
• DOM • SVG • Canvas • WebGL … • Serverside? Ember
• DOM • SVG • Canvas • WebGL … • Serverside? jQuery
• DOM • SVG • Canvas • WebGL … • Serverside? React
React
React Flux Redux
React Flux Redux UI DATA
React REDUX FLUX
Reducers Initial state final state Redux
Reducers Initial state final state
Reducers Initial state final state Flux Reducers Initial state final state Reducers Initial state final state Reducers Initial state final state Reducers Initial state final state Reducers final state Reducers Initial state final state
Reducers Initial state final state Redux
Reducers Initial state final state React
Reducers Initial state final state React virtual dom
Reducers Initial state final state React REAL dom SVGWEBGL virtual dom
Reducers Initial state final state React REAL dom SVGWEBGL static page rest api virtual dom

 EXAMPLES
Thinking Reactively
Thinking Reactively
Thinking Reactively
Thinking Reactively
Thinking Reactively
Own Projects • http://sabinmarcu.github.io/labs/ • http://sabinmarcu.github.io/labs/react-demo/ • http://sabinmarcu.github.io/labs/sortable-paper/ Canvas & WebGL • http://react.rocks/tag/Canvas • http://react.rocks/tag/WebGL Serverside Render • https://github.com/mhart/react-server-example Real life examples • https://www.messenger.com/ • http://react.rocks/
Thinking Reactively
Thinking Reactively
Thinking Reactively
Thinking Reactively

More Related Content

PPTX
From the Unknown to the Known
Ben Gardner
 
PDF
Migrating from Flux to Redux. Why and how.
Astrails
 
PDF
React Native for multi-platform mobile applications
Matteo Manchi
 
PDF
Universal JavaScript Web Applications with React - Luciano Mammino - Codemoti...
Codemotion
 
PPTX
React + Redux Introduction
Nikolaus Graf
 
PDF
React JS and why it's awesome
Andrew Hull
 
PDF
How to not blow up spaceships
Sabin Marcu
 
PDF
Past and today of Metasepi project
Kiwamu Okabe
 
From the Unknown to the Known
Ben Gardner
 
Migrating from Flux to Redux. Why and how.
Astrails
 
React Native for multi-platform mobile applications
Matteo Manchi
 
Universal JavaScript Web Applications with React - Luciano Mammino - Codemoti...
Codemotion
 
React + Redux Introduction
Nikolaus Graf
 
React JS and why it's awesome
Andrew Hull
 
How to not blow up spaceships
Sabin Marcu
 
Past and today of Metasepi project
Kiwamu Okabe
 

Similar to Thinking Reactively (20)

PDF
Building reusable components with generics and protocols
Donny Wals
 
PDF
Getting Up and Running with BDD on Rails
Nicholas Cancelliere
 
PDF
Getting Up and Running with BDD on Rails
elliando dias
 
PPT
Upgrade Your Website to HTML5 - VSLive Conference New York @iRajLal
Raj Lal
 
PDF
Clojure at ardoq
Erik Bakstad
 
PDF
A Backpack to go the Extra-Functional Mile (a hitched hike by the PROWESS pro...
Laura M. Castro
 
PDF
Rails is not enough, by Javier Ramirez, at Conferencia Rails 2010 in Madrid, ...
javier ramirez
 
PDF
Metasepi team meeting #16: Safety on ATS language + MCU
Kiwamu Okabe
 
PPT
Linking chemistry: wider lessons for how we publish research
Royal Society of Chemistry
 
PDF
Introduction to Responsive Web Design
Clarissa Peterson
 
PDF
Cms Workshop Long
emily
 
PPTX
Container Days NYC Keynote
Boyd Hemphill
 
PDF
Webconf 2013 - Media Query 123
Hina Chen
 
PPTX
Docker Docker - Docker Security - Docker
Boyd Hemphill
 
PPT
Wikis Cluster Presentation
digikids
 
PDF
Functional IoT: Programming Language and OS
Kiwamu Okabe
 
PDF
Prototyping: Helping to take away the suck
Harvard Web Working Group
 
PPT
Advanced online search through the web
netknowlogy
 
PPTX
Recycling & Repurposing Great Content
Corrin Foster
 
PDF
Godaddy and WordPress
Russ Shirley
 
Building reusable components with generics and protocols
Donny Wals
 
Getting Up and Running with BDD on Rails
Nicholas Cancelliere
 
Getting Up and Running with BDD on Rails
elliando dias
 
Upgrade Your Website to HTML5 - VSLive Conference New York @iRajLal
Raj Lal
 
Clojure at ardoq
Erik Bakstad
 
A Backpack to go the Extra-Functional Mile (a hitched hike by the PROWESS pro...
Laura M. Castro
 
Rails is not enough, by Javier Ramirez, at Conferencia Rails 2010 in Madrid, ...
javier ramirez
 
Metasepi team meeting #16: Safety on ATS language + MCU
Kiwamu Okabe
 
Linking chemistry: wider lessons for how we publish research
Royal Society of Chemistry
 
Introduction to Responsive Web Design
Clarissa Peterson
 
Cms Workshop Long
emily
 
Container Days NYC Keynote
Boyd Hemphill
 
Webconf 2013 - Media Query 123
Hina Chen
 
Docker Docker - Docker Security - Docker
Boyd Hemphill
 
Wikis Cluster Presentation
digikids
 
Functional IoT: Programming Language and OS
Kiwamu Okabe
 
Prototyping: Helping to take away the suck
Harvard Web Working Group
 
Advanced online search through the web
netknowlogy
 
Recycling & Repurposing Great Content
Corrin Foster
 
Godaddy and WordPress
Russ Shirley
 
Ad

Recently uploaded (20)

PPTX
Database Information System - Management Information System
faizhossain3
 
PDF
Alethe Consulting Corporate Profile and Solution Aproach
debashisrakshit2025
 
PDF
Introduction to the IoT system, how the IoT system works
TinBinh
 
PPT
12 Things That Make People Trust a Website Instantly
Shethil Ahammed
 
PPTX
t_and_OpenAI_Combined_two_pressentations
wuvjwfnaadbnzelauy
 
PDF
The Evolution of Traditional to New Media .pdf
NIKKODENSMIRO
 
PPTX
module 1-Part 1.pptxdddddddddddddddddddddddddddddddddddd
KevinSeelu
 
PDF
FINAL CALL-6th International Conference on Networks & IOT (NeTIOT 2025)
IJMIT JOURNAL
 
PPT
Ethics in Information System - Management Information System
faizhossain3
 
PPT
250152213-Excitation-SystemWERRT (1).ppt
woldemariamworku2
 
PDF
BIOCHEM CH2 OVERVIEW OF MICROBIOLOGY.pdf
tbasharababneh
 
DOC
Rose毕业证学历认证,利物浦约翰摩尔斯大学毕业证国外本科毕业证
acoqwo
 
PPTX
Introduction to cybersecurity and digital nettiquette
shanefrancisjavier21
 
PDF
Uptota Investor Deck - Where Africa Meets Blockchain
jjc123linkedin
 
PDF
📍 LABUAN4D EXCLUSIVE SERVER STAR GAMING ASIA NO.1 TERPOPULER DI INDONESIA ! 🌟
alexiskandar061
 
PPT
415456121-Jiwratrwecdtwfdsfwgdwedvwe dbwsdjsadca-EVN.ppt
woldemariamworku2
 
PPTX
Power Point - Lesson 3_2.pptx grad school presentation
JoyPPD
 
PDF
Lean-Manufacturing-Tools-Techniques-and-How-To-Use-Them.pdf
Turreteng
 
PPT
isotopes_sddsadsaadasdasdasdasdsa1213.ppt
Kenneth James Alamillo
 
PDF
Session 1 (Week 1)fghjmgfdsfgthyjkhfdsadfghjkhgfdsa
ssuser25df8b
 
Database Information System - Management Information System
faizhossain3
 
Alethe Consulting Corporate Profile and Solution Aproach
debashisrakshit2025
 
Introduction to the IoT system, how the IoT system works
TinBinh
 
12 Things That Make People Trust a Website Instantly
Shethil Ahammed
 
t_and_OpenAI_Combined_two_pressentations
wuvjwfnaadbnzelauy
 
The Evolution of Traditional to New Media .pdf
NIKKODENSMIRO
 
module 1-Part 1.pptxdddddddddddddddddddddddddddddddddddd
KevinSeelu
 
FINAL CALL-6th International Conference on Networks & IOT (NeTIOT 2025)
IJMIT JOURNAL
 
Ethics in Information System - Management Information System
faizhossain3
 
250152213-Excitation-SystemWERRT (1).ppt
woldemariamworku2
 
BIOCHEM CH2 OVERVIEW OF MICROBIOLOGY.pdf
tbasharababneh
 
Rose毕业证学历认证,利物浦约翰摩尔斯大学毕业证国外本科毕业证
acoqwo
 
Introduction to cybersecurity and digital nettiquette
shanefrancisjavier21
 
Uptota Investor Deck - Where Africa Meets Blockchain
jjc123linkedin
 
📍 LABUAN4D EXCLUSIVE SERVER STAR GAMING ASIA NO.1 TERPOPULER DI INDONESIA ! 🌟
alexiskandar061
 
415456121-Jiwratrwecdtwfdsfwgdwedvwe dbwsdjsadca-EVN.ppt
woldemariamworku2
 
Power Point - Lesson 3_2.pptx grad school presentation
JoyPPD
 
Lean-Manufacturing-Tools-Techniques-and-How-To-Use-Them.pdf
Turreteng
 
isotopes_sddsadsaadasdasdasdasdsa1213.ppt
Kenneth James Alamillo
 
Session 1 (Week 1)fghjmgfdsfgthyjkhfdsadfghjkhgfdsa
ssuser25df8b
 
Ad

Thinking Reactively

  • 4. ! twitter.com/sabinmarcu "facebook.com/sabinmarcu # linkedin.com/in/sabinmarcu $ github.com/sabinmarcu
  • 5. • Startup in Analytics ! twitter.com/sabinmarcu "facebook.com/sabinmarcu # linkedin.com/in/sabinmarcu $ github.com/sabinmarcu
  • 6. • Startup in Analytics • Developer (not Web Developer / Java Developer, etc) • 3rd Year – Computer Science @ Southampton Uni • Experience: ๏ Java, C++, PHP, JavaScript ๏ Projects starting from CMS / whole systems, to libraries and experiments ! twitter.com/sabinmarcu "facebook.com/sabinmarcu # linkedin.com/in/sabinmarcu $ github.com/sabinmarcu
  • 7. • Startup in Analytics • Developer (not Web Developer / Java Developer, etc) • 3rd Year – Computer Science @ Southampton Uni • Experience: ๏ Java, C++, PHP, JavaScript ๏ Projects starting from CMS / whole systems, to libraries and experiments • Web Development since 2009 • Node JS since 2011 • Angular JS since 2013 • React since 2015 ! twitter.com/sabinmarcu "facebook.com/sabinmarcu # linkedin.com/in/sabinmarcu $ github.com/sabinmarcu
  • 8. • Startup in Analytics • Developer (not Web Developer / Java Developer, etc) • 3rd Year – Computer Science @ Southampton Uni • Experience: ๏ Java, C++, PHP, JavaScript ๏ Projects starting from CMS / whole systems, to libraries and experiments • Web Development since 2009 • Node JS since 2011 • Angular JS since 2013 • React since 2015 • HackaSoton director since the beginning ! twitter.com/sabinmarcu "facebook.com/sabinmarcu # linkedin.com/in/sabinmarcu $ github.com/sabinmarcu
  • 12. • Overview • Competition • Facebook’s Reasoning • Comparison with Angular
  • 13. • Overview • Competition • Facebook’s Reasoning • Comparison with Angular • Redux • Flux • React
  • 14. • Overview • Competition • Facebook’s Reasoning • Comparison with Angular • Redux • Flux • React • Examples
  • 15. • Overview • Competition • Facebook’s Reasoning • Comparison with Angular • Redux • Flux • React • Examples • Recap • Questions
  • 16. • Overview • Competition • Facebook’s Reasoning • Comparison with Angular • Redux • Flux • React • Examples • Recap • Questions • ???
  • 17. • Overview • Competition • Facebook’s Reasoning • Comparison with Angular • Redux • Flux • React • Examples • Recap • Questions • ??? • Profit
  • 18. React
  • 34. Basic Websites / General Website Frontend
  • 35. Basic Websites / General Website Frontend Small Scripts / Fiddles
  • 36. Basic Websites / General Website Frontend Small Scripts / Fiddles Showing off as a beginner
  • 37. Basic Websites / General Website Frontend Small Scripts / Fiddles Showing off as a beginner
  • 38. Basic Websites / General Website Frontend Small Scripts / Fiddles Showing off as a beginner NOT to be used as a primary tool with an app
  • 42. Web applications works with dom / svg at best
  • 43. Web applications works with dom / svg at best two way data bindings
  • 44. Web applications works with dom / svg at best two way data bindings
  • 45. Web applications works with dom / svg at best two way data bindings scope tree
  • 46. Web applications works with dom / svg at best two way data bindings scope tree
  • 47. Web applications works with dom / svg at best two way data bindings scope tree digest loops
  • 51. Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope
  • 52. Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope one comment box author timestamp comment
  • 53. Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope
  • 54. Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope one comment box
  • 55. Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope one comment box Comment form
  • 56. Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope one comment box Comment form Comment section
  • 58. Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope
  • 59. Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Comment Section
  • 60. Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Comment Section Article
  • 61. Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Comment Section Article Admin
  • 62. Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope cope cope cope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope S Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scop Scope Scop Scop Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope
  • 63. Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope cope cope cope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope S Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scop Scope Scop Scop Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope
  • 64. Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope cope cope cope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope S Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scop Scope Scop Scop Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope
  • 65. Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope cope cope cope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope S Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scop Scope Scop Scop Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope
  • 70. React
  • 75. 1. Reducers 2. Store 3. Virtual DOM Workflow
  • 76. 1. Reducers 2. Store 3. Virtual DOM 4. Actual Dom Workflow
  • 77. 1. Reducers 2. Store 3. Virtual DOM 4. Actual Dom 5. Action Workflow
  • 78. 1. Reducers 2. Store 3. Virtual DOM 4. Actual Dom 5. Action 6. Dispatch Workflow
  • 82. 1. Initial State Reducers & Store
  • 83. 1. Initial State 2. Reducers Reducers & Store
  • 84. 1. Initial State 2. Reducers 3. Final State Reducers & Store
  • 85. Reducers & Store 1. Initial State 2. Reducers 3. Intermediary State
  • 86. Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope one comment box Comment form Comment section
  • 87. Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope cope cope cope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope S Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scop Scope Scop Scop Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope
  • 88. Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Sco S Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope S Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Store
  • 89. Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Sco S Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope S Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Store
  • 90. Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Sco S Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope S Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Store
  • 91. Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Sco S Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope S Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Store Dispatch
  • 92. Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Sco S Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope S Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Store Dispatch
  • 93. Diffs Only changes where it’s needed
  • 98. Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Scope Legend: • Affected • Dispatcher
  • 109. • DOM • SVG • Canvas • WebGL
  • 110. • DOM • SVG • Canvas • WebGL …
  • 111. • DOM • SVG • Canvas • WebGL … • Serverside?
  • 112. • DOM • SVG • Canvas • WebGL … • Serverside? AngularJS
  • 113. • DOM • SVG • Canvas • WebGL … • Serverside? Incremental DOM
  • 114. • DOM • SVG • Canvas • WebGL … • Serverside? Ember
  • 115. • DOM • SVG • Canvas • WebGL … • Serverside? jQuery
  • 116. • DOM • SVG • Canvas • WebGL … • Serverside? React
  • 117. React
  • 123. Reducers Initial state final state Flux Reducers Initial state final state Reducers Initial state final state Reducers Initial state final state Reducers Initial state final state Reducers final state Reducers Initial state final state
  • 128. Reducers Initial state final state React REAL dom SVGWEBGL static page rest api virtual dom
  • 135. Own Projects • http://sabinmarcu.github.io/labs/ • http://sabinmarcu.github.io/labs/react-demo/ • http://sabinmarcu.github.io/labs/sortable-paper/ Canvas & WebGL • http://react.rocks/tag/Canvas • http://react.rocks/tag/WebGL Serverside Render • https://github.com/mhart/react-server-example Real life examples • https://www.messenger.com/ • http://react.rocks/