serving mobile apps from content management systems

53

Upload: james-pearce

Post on 12-Jan-2015

4.799 views

Category:

Technology


5 download

DESCRIPTION

Hundreds of millions of web sites around the world are served from Content Management Systems like WordPress and Drupal. How do you equip these platforms to deal with the inevitable rise of mobile web technologies? In this session, we will explore how to create great mobile sites and apps from your existing content, using Sencha Touch.

TRANSCRIPT

Page 1: Serving Mobile Apps from Content Management Systems
Page 2: Serving Mobile Apps from Content Management Systems

Serving Mobile Appsfrom

Content Management Systems

JAMES PEARCE, SENCHA INC.

Page 3: Serving Mobile Apps from Content Management Systems

James Pearce Director, Developer Relations @ jamespearce [email protected]

Page 4: Serving Mobile Apps from Content Management Systems
Page 5: Serving Mobile Apps from Content Management Systems

How Mobile IsChanging The Web

And what does this word even mean?

Page 6: Serving Mobile Apps from Content Management Systems

A perfect storm

HTML5CSS3JS++

And all thatother stuff

Page 7: Serving Mobile Apps from Content Management Systems

New assumptions

HTML

Thick servers

Sedentary user

JS & JSON

Thick clients

Mobile user

This is what it means!

Page 8: Serving Mobile Apps from Content Management Systems
Page 9: Serving Mobile Apps from Content Management Systems

Old Dogs&

New Tricks

Page 10: Serving Mobile Apps from Content Management Systems

Content management

HTML, CSS...

Database

Core

Plugins

Themes

Page 11: Serving Mobile Apps from Content Management Systems

Simple mobile support

Database

Core

Mobile

DesktopSw

itch

er HTML, CSS...

Page 12: Serving Mobile Apps from Content Management Systems

WordPress Mobile Pack

http://wordpress.org/extend/plugins/wordpress-mobile-pack

Page 13: Serving Mobile Apps from Content Management Systems

An application approach

JSONDatabase

Core

Mobile

DesktopSw

itch

er

REST

Page 14: Serving Mobile Apps from Content Management Systems

Stack evolution

Storage

Security Business logic

User interfacesync

Page 15: Serving Mobile Apps from Content Management Systems

EnterSencha Touch

Page 16: Serving Mobile Apps from Content Management Systems

A quick walkthough

Simple switching plugin

Stores populated with JSON Demotime!

Model-View-Controller

CMS categories & posts

Page 17: Serving Mobile Apps from Content Management Systems
Page 18: Serving Mobile Apps from Content Management Systems
Page 19: Serving Mobile Apps from Content Management Systems
Page 20: Serving Mobile Apps from Content Management Systems
Page 21: Serving Mobile Apps from Content Management Systems
Page 22: Serving Mobile Apps from Content Management Systems

categories post lists & detail

Page 23: Serving Mobile Apps from Content Management Systems

Our MVC pattern

Routes

Controllerscategories.index categories.show

posts.show

ViewscategoriesList

postsListpostsDetail

ModelsCategory, Post

Storescategories, posts

Page 24: Serving Mobile Apps from Content Management Systems
Page 25: Serving Mobile Apps from Content Management Systems
Page 26: Serving Mobile Apps from Content Management Systems
Page 27: Serving Mobile Apps from Content Management Systems
Page 28: Serving Mobile Apps from Content Management Systems
Page 29: Serving Mobile Apps from Content Management Systems
Page 30: Serving Mobile Apps from Content Management Systems
Page 31: Serving Mobile Apps from Content Management Systems
Page 32: Serving Mobile Apps from Content Management Systems

Our MVC pattern

Routes

Controllerscategories.index categories.show

posts.show

ViewscategoriesList

postsListpostsDetail

ModelsCategory, Post

Storescategories, posts

Page 33: Serving Mobile Apps from Content Management Systems
Page 34: Serving Mobile Apps from Content Management Systems
Page 35: Serving Mobile Apps from Content Management Systems

change to postsList

Page 36: Serving Mobile Apps from Content Management Systems

need to implement the server API

Page 37: Serving Mobile Apps from Content Management Systems
Page 38: Serving Mobile Apps from Content Management Systems
Page 39: Serving Mobile Apps from Content Management Systems
Page 40: Serving Mobile Apps from Content Management Systems
Page 41: Serving Mobile Apps from Content Management Systems
Page 42: Serving Mobile Apps from Content Management Systems
Page 43: Serving Mobile Apps from Content Management Systems
Page 44: Serving Mobile Apps from Content Management Systems

Success?

Page 45: Serving Mobile Apps from Content Management Systems

Taking It Further

To ∞ & beyond

Page 46: Serving Mobile Apps from Content Management Systems

Thematic consistency

w3c-speak

http://mycms.com/?post=123

http://mycms.com/#posts/123

Page 47: Serving Mobile Apps from Content Management Systems

Smart detection& user choice

“Switch to our desktop site”

Page 48: Serving Mobile Apps from Content Management Systems

Brand consistency

Page 49: Serving Mobile Apps from Content Management Systems

A little can go a long way

Page 50: Serving Mobile Apps from Content Management Systems

Other CMS functionality

Smart sync for large datasets

Administration interface

Sidebars & widgets

Thumbnails & images

Rescale withhttp://tinysrc.net

Comments and user feedback

Account management

Page 51: Serving Mobile Apps from Content Management Systems

Mobile devicesare di!erent

Telephony

Geolocation

Camera

Messaging

Page 52: Serving Mobile Apps from Content Management Systems

Mobile usersare di!erent

Page 53: Serving Mobile Apps from Content Management Systems

James Pearce Director, Developer Relations @ jamespearce [email protected]