36
REACT.JS DOM AS IT WAS MEANT A LITTLE LOVE STORY, BORN OUT OF EXPERIENCE @WOLFRAMKRIESING

react.js - DOM as it was meant

Embed Size (px)

Citation preview

R E A C T. J S D O M A S I T W A S M E A N T

A L I T T L E L O V E S T O R Y, B O R N O U T O F E X P E R I E N C E

@ W O L F R A M K R I E S I N G

98% JavaScript, since 2008

@wolframkriesing

refactored https://github.com/wolframkriesing/todomvc/tree/react-componentize/examples/react/js

NO BLACK NO WHITE

but, a step forward for sure

N O L I K E ?

J S X

A L M O S T W E B C O M P O N E N T SV I R T U A L D O M

beautiful but there is more, go explore

J S XV I R T U A L

D O M

J S X

(X)HTML

embedded in JavaScript

E N F O R C E S S E PA R AT I O N

because we don’t program in (X)HTML, right?

prepare data (in JS)

pass to view (in XHTML)

D I D T H E D O M E V E R D O T H AT F O R Y O U ?

J S X I S N O T M A G I C

plus some restrictions

V I R T U A L D O M

data binding

C O D E P L E A S E

1

2

3

4

re-render only on change

Real HTML

2

1

3

R E S T R I C T E D A C C E S S

of course, react.js wants to stay in control

L I S T E N T O Y O U R C O D E

E S P E C I A L LY T E S TA B I L I T Y

H E A R Y O U R C O D E ?

T O O K U S F I V E M O N T H S

source at https://github.com/wolframkriesing/todomvc/tree/react-componentize/examples/react/js

T E S TA B I L I T Y

UNIT TEST

INTEGRATION TEST

A N D M O R E !

production code + tests + styles + assets = component

J S X +

V I RT U A L D O M

U X E B U . C O M

We are hiring!!!

come and join us!

source https://github.com/wolframkriesing/todomvc