wordpress & backbone · 2014-04-29 · backbone.js the dawn of web apps @jesperbylund user...

36
WordPress & BackBone.js The Dawn of Web Apps

Upload: others

Post on 29-Jul-2020

0 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: WordPress & BackBone · 2014-04-29 · BackBone.js The Dawn of Web Apps @JesperBylund User Experience Developer Odd Alice. WordPress & BackBone.js The Dawn of Web Apps. In the beginning

WordPress & BackBone.js

The Dawn of Web Apps

Page 2: WordPress & BackBone · 2014-04-29 · BackBone.js The Dawn of Web Apps @JesperBylund User Experience Developer Odd Alice. WordPress & BackBone.js The Dawn of Web Apps. In the beginning

@JesperBylund User Experience Developer

Odd Alice

Page 3: WordPress & BackBone · 2014-04-29 · BackBone.js The Dawn of Web Apps @JesperBylund User Experience Developer Odd Alice. WordPress & BackBone.js The Dawn of Web Apps. In the beginning

WordPress & BackBone.js

The Dawn of Web Apps

Page 4: WordPress & BackBone · 2014-04-29 · BackBone.js The Dawn of Web Apps @JesperBylund User Experience Developer Odd Alice. WordPress & BackBone.js The Dawn of Web Apps. In the beginning

In the beginning there was static content

Page 5: WordPress & BackBone · 2014-04-29 · BackBone.js The Dawn of Web Apps @JesperBylund User Experience Developer Odd Alice. WordPress & BackBone.js The Dawn of Web Apps. In the beginning

Suddenly, mobile emerged

Page 6: WordPress & BackBone · 2014-04-29 · BackBone.js The Dawn of Web Apps @JesperBylund User Experience Developer Odd Alice. WordPress & BackBone.js The Dawn of Web Apps. In the beginning

Everything became function and really cool

form

Page 7: WordPress & BackBone · 2014-04-29 · BackBone.js The Dawn of Web Apps @JesperBylund User Experience Developer Odd Alice. WordPress & BackBone.js The Dawn of Web Apps. In the beginning
Page 8: WordPress & BackBone · 2014-04-29 · BackBone.js The Dawn of Web Apps @JesperBylund User Experience Developer Odd Alice. WordPress & BackBone.js The Dawn of Web Apps. In the beginning
Page 9: WordPress & BackBone · 2014-04-29 · BackBone.js The Dawn of Web Apps @JesperBylund User Experience Developer Odd Alice. WordPress & BackBone.js The Dawn of Web Apps. In the beginning

JavaScript eats the world

Page 10: WordPress & BackBone · 2014-04-29 · BackBone.js The Dawn of Web Apps @JesperBylund User Experience Developer Odd Alice. WordPress & BackBone.js The Dawn of Web Apps. In the beginning

WordPress + BackBone.js

Page 11: WordPress & BackBone · 2014-04-29 · BackBone.js The Dawn of Web Apps @JesperBylund User Experience Developer Odd Alice. WordPress & BackBone.js The Dawn of Web Apps. In the beginning

BackBone.js

Page 12: WordPress & BackBone · 2014-04-29 · BackBone.js The Dawn of Web Apps @JesperBylund User Experience Developer Odd Alice. WordPress & BackBone.js The Dawn of Web Apps. In the beginning

JavaScript framework for RESTful JSON APIs

Page 13: WordPress & BackBone · 2014-04-29 · BackBone.js The Dawn of Web Apps @JesperBylund User Experience Developer Odd Alice. WordPress & BackBone.js The Dawn of Web Apps. In the beginning

Single Page Apps

Page 14: WordPress & BackBone · 2014-04-29 · BackBone.js The Dawn of Web Apps @JesperBylund User Experience Developer Odd Alice. WordPress & BackBone.js The Dawn of Web Apps. In the beginning

Model +

View +

Router

Page 15: WordPress & BackBone · 2014-04-29 · BackBone.js The Dawn of Web Apps @JesperBylund User Experience Developer Odd Alice. WordPress & BackBone.js The Dawn of Web Apps. In the beginning

Model +

View

Page 16: WordPress & BackBone · 2014-04-29 · BackBone.js The Dawn of Web Apps @JesperBylund User Experience Developer Odd Alice. WordPress & BackBone.js The Dawn of Web Apps. In the beginning

Model: JSON object

Page 17: WordPress & BackBone · 2014-04-29 · BackBone.js The Dawn of Web Apps @JesperBylund User Experience Developer Odd Alice. WordPress & BackBone.js The Dawn of Web Apps. In the beginning

View: functions and representations for the

model

Page 18: WordPress & BackBone · 2014-04-29 · BackBone.js The Dawn of Web Apps @JesperBylund User Experience Developer Odd Alice. WordPress & BackBone.js The Dawn of Web Apps. In the beginning

WordPress (JSON API)

Page 19: WordPress & BackBone · 2014-04-29 · BackBone.js The Dawn of Web Apps @JesperBylund User Experience Developer Odd Alice. WordPress & BackBone.js The Dawn of Web Apps. In the beginning

What can WordPress serve? Everything.

Page 20: WordPress & BackBone · 2014-04-29 · BackBone.js The Dawn of Web Apps @JesperBylund User Experience Developer Odd Alice. WordPress & BackBone.js The Dawn of Web Apps. In the beginning

What can WordPress serve? Everything.

Page 21: WordPress & BackBone · 2014-04-29 · BackBone.js The Dawn of Web Apps @JesperBylund User Experience Developer Odd Alice. WordPress & BackBone.js The Dawn of Web Apps. In the beginning

What can WordPress serve? Everything.

Page 22: WordPress & BackBone · 2014-04-29 · BackBone.js The Dawn of Web Apps @JesperBylund User Experience Developer Odd Alice. WordPress & BackBone.js The Dawn of Web Apps. In the beginning

WP API delivers models to BackBone.js

Page 23: WordPress & BackBone · 2014-04-29 · BackBone.js The Dawn of Web Apps @JesperBylund User Experience Developer Odd Alice. WordPress & BackBone.js The Dawn of Web Apps. In the beginning

BackBone.js renders templates from Models

Page 24: WordPress & BackBone · 2014-04-29 · BackBone.js The Dawn of Web Apps @JesperBylund User Experience Developer Odd Alice. WordPress & BackBone.js The Dawn of Web Apps. In the beginning

WordPress templates as backwards compatibility?

Page 25: WordPress & BackBone · 2014-04-29 · BackBone.js The Dawn of Web Apps @JesperBylund User Experience Developer Odd Alice. WordPress & BackBone.js The Dawn of Web Apps. In the beginning

LoL!Nothing works without

JS.

Page 26: WordPress & BackBone · 2014-04-29 · BackBone.js The Dawn of Web Apps @JesperBylund User Experience Developer Odd Alice. WordPress & BackBone.js The Dawn of Web Apps. In the beginning

So how can we use it?

Page 27: WordPress & BackBone · 2014-04-29 · BackBone.js The Dawn of Web Apps @JesperBylund User Experience Developer Odd Alice. WordPress & BackBone.js The Dawn of Web Apps. In the beginning

Demo Time

Page 28: WordPress & BackBone · 2014-04-29 · BackBone.js The Dawn of Web Apps @JesperBylund User Experience Developer Odd Alice. WordPress & BackBone.js The Dawn of Web Apps. In the beginning

Collection (model)

Page 29: WordPress & BackBone · 2014-04-29 · BackBone.js The Dawn of Web Apps @JesperBylund User Experience Developer Odd Alice. WordPress & BackBone.js The Dawn of Web Apps. In the beginning
Page 30: WordPress & BackBone · 2014-04-29 · BackBone.js The Dawn of Web Apps @JesperBylund User Experience Developer Odd Alice. WordPress & BackBone.js The Dawn of Web Apps. In the beginning
Page 31: WordPress & BackBone · 2014-04-29 · BackBone.js The Dawn of Web Apps @JesperBylund User Experience Developer Odd Alice. WordPress & BackBone.js The Dawn of Web Apps. In the beginning

View

Page 32: WordPress & BackBone · 2014-04-29 · BackBone.js The Dawn of Web Apps @JesperBylund User Experience Developer Odd Alice. WordPress & BackBone.js The Dawn of Web Apps. In the beginning
Page 33: WordPress & BackBone · 2014-04-29 · BackBone.js The Dawn of Web Apps @JesperBylund User Experience Developer Odd Alice. WordPress & BackBone.js The Dawn of Web Apps. In the beginning
Page 34: WordPress & BackBone · 2014-04-29 · BackBone.js The Dawn of Web Apps @JesperBylund User Experience Developer Odd Alice. WordPress & BackBone.js The Dawn of Web Apps. In the beginning

But what can we build with this?

Page 35: WordPress & BackBone · 2014-04-29 · BackBone.js The Dawn of Web Apps @JesperBylund User Experience Developer Odd Alice. WordPress & BackBone.js The Dawn of Web Apps. In the beginning

Anything WordPress couldn’t do

Page 36: WordPress & BackBone · 2014-04-29 · BackBone.js The Dawn of Web Apps @JesperBylund User Experience Developer Odd Alice. WordPress & BackBone.js The Dawn of Web Apps. In the beginning

Questions? !

@jesperbylund