Slide 1

Slide 1 text

On the evolution and changes of Riotjs@4 We Are JavaScripters! @30th ʲॳ৺ऀ׻ܴLTେձʳ

Slide 2

Slide 2 text

About me

Slide 3

Slide 3 text

Basic Information const my_info = { : ‘܂ݪ੟ਔ’, : ‘Yumemi Inc’, : ‘kuwahara_jsri’, : ‘k-kuwahara’, : ‘k-kuwahara’, }

Slide 4

Slide 4 text

Communities translator staff staff

Slide 5

Slide 5 text

Sorry... $ Plz feedback for me called “Masakari” about my English.

Slide 6

Slide 6 text

Have you ever used riotjs before?

Slide 7

Slide 7 text

before that …

Slide 8

Slide 8 text

What is ?

Slide 9

Slide 9 text

image by: https://riot.js.org/

Slide 10

Slide 10 text

Characteristics ‣ Custom tags(Component based) ‣ Simple syntax ‣ Human-readable ‣ Small leaning curve

Slide 11

Slide 11 text

More example

Slide 12

Slide 12 text

For more details, URL: https://speakerdeck.com/clown0082/re-revolution-to-front-end-with-riot-dot-js

Slide 13

Slide 13 text

Next @4

Slide 14

Slide 14 text

There are breaking changes. Let’s pick up some of them.

Slide 15

Slide 15 text

Change Riot4

Slide 16

Slide 16 text

Change Riot4 type, src, extension are changes

Slide 17

Slide 17 text

Change Riot4

Slide 18

Slide 18 text

Change Riot4 specifying a mount point by “div” is invalid

Slide 19

Slide 19 text

Change Riot4

Slide 20

Slide 20 text

Change Riot4 riot.compile() is probably required

Slide 21

Slide 21 text

Change Riot4 No error message is displayed in “console.log()”

Slide 22

Slide 22 text

Change Riot4 Specifying “*” results in an error

Slide 23

Slide 23 text

Change Riot4

Slide 24

Slide 24 text

Change Riot4 props, state parameters !?

Slide 25

Slide 25 text

Change Riot4 export default syntax !!

Slide 26

Slide 26 text

Change Riot4 props, state arguments !!

Slide 27

Slide 27 text

Display whole code again

Slide 28

Slide 28 text

Demo Riot4 Code1

Slide 29

Slide 29 text

Demo Riot4 Code2

Slide 30

Slide 30 text

Pick up some of the roadmap @4 ‣ “this.tags” ‣ “riot-observable” ‣ “shouldUpdate” method ‣ “:scope” → “:host” ‣ parser/compiler ‣ high performance

Slide 31

Slide 31 text

Progress Two modules released!! ‣ riot → v4.0.0-beta.2 ‣ dom-bindings → v0.11.2 ‣ parser → v0.8.1 Demo: https://codesandbox.io/s/o452941pn6

Slide 32

Slide 32 text

⚠Caution⚠

Slide 33

Slide 33 text

It is still in beta, so specifications may change.

Slide 34

Slide 34 text

Please wait for the official release Riot.js@4!!

Slide 35

Slide 35 text

Publicity

Slide 36

Slide 36 text

We’re looking for Engineers!!

Slide 37

Slide 37 text

No content