Tweet
Tweet

Slide 1

Slide 1 text

HTML5 JavaScript On Crack Kyle Simpson http://getify.me @getify

Slide 2

Slide 2 text

+ HTML5 & Friends

Slide 3

Slide 3 text

let's build a game: We Puzzle It!

Slide 4

Slide 4 text

http:// ogp.geti.fi/github/wepuzzleit code for today

Slide 5

Slide 5 text

Getting hooked on “gateway drugs” • localStorage / sessionStorage • History • appCache •

Slide 6

Slide 6 text

localStorage / sessionStorage

Slide 7

Slide 7 text

History API

Slide 8

Slide 8 text

History API

Slide 9

Slide 9 text

appCache

Slide 10

Slide 10 text

Slide 11

Slide 11 text

Slide 12

Slide 12 text

Slide 13

Slide 13 text

Slide 14

Slide 14 text

Slide 15

Slide 15 text

Slide 16

Slide 16 text

Now for the hardcore stuff • Native Drag & Drop • Local Files + XHR2 • Web Sockets (socket.io) • Web Workers

Slide 17

Slide 17 text

Native Drag & Drop

Slide 18

Slide 18 text

Native Drag & Drop

Slide 19

Slide 19 text

Native Drag & Drop

Slide 20

Slide 20 text

Native Drag & Drop

Slide 21

Slide 21 text

Local Files

Slide 22

Slide 22 text

Local Files

Slide 23

Slide 23 text

Local Files

Slide 24

Slide 24 text

Local Files + XHR2

Slide 25

Slide 25 text

addicted yet?

Slide 26

Slide 26 text

Web Sockets

Slide 27

Slide 27 text

Web Sockets (socket.io client)

Slide 28

Slide 28 text

Web Sockets (socket.io client)

Slide 29

Slide 29 text

Web Sockets (socket.io server)

Slide 30

Slide 30 text

Web Workers

Slide 31

Slide 31 text

Web Workers (main page)

Slide 32

Slide 32 text

Web Workers (main page)

Slide 33

Slide 33 text

Web Workers (ww.js)

Slide 34

Slide 34 text

Web Workers (ww.js)

Slide 35

Slide 35 text

Web Workers (shim)

Slide 36

Slide 36 text

one more thing

Slide 37

Slide 37 text

getUserMedia &

Slide 38

Slide 38 text

getUserMedia &

Slide 39

Slide 39 text

getUserMedia &

Slide 40

Slide 40 text

http:// hpi.geti.fi/wepuzzleit/game play!

Slide 41

Slide 41 text

Kyle Simpson http://getify.me @getify