smartphone enable your dotnetnuke apps with jq-touch & jquerymobile smartphone-enable your...

Smartphone-enable your

DNN apps with jQTouch

Antonio Chagoury

Day of DotNetNuke, Chicago October 2, 2010

1

2

www.inspectorit.com

About Me

• DotNetNuke Core Team Member and Project Lead, Blog and Install Utility

• Principal & Software Architect, Inspector IT, Inc.• Use DotNetNuke as the Development Platform of

choice for large Web 2.0 and Enterprise Implementations

• Microsoft MVP, Visual Basic• I blog at www.cto20.com • Co-Founder and President, Capital

DotNetNuke User Group (CDUG)

3

www.inspectorit.com

Many thanks to our sponsors for making the event possible

4

www.inspectorit.com

Why jQTouch?

• Who wants to learn Objective-C?• HTML 5 + jQuery is cool! Plus, you may learn

new tricks in the process• Go offline with HTML 5 using SQLlite and ApplicationCache

• Deploy Apps without the AppStore headaches and bureaucracy

• But, If you must have AppStore, deploy with PhoneGap, AppCelerator, or others

5

www.inspectorit.com

Approach: Build a mobile version of the DotNetNuke Blog• DotNetNuke website hosting our blog• Add low-fidelity data service to return JSON

responses• Add jQTouch Framework + jQuery• A touch of HTML 5 + CSS• Test Mobile App with MobiOne Test Center

6

www.inspectorit.com

DotNetNuke

Website: CTO20.DE

V

Our Framework’s Architecture

DNN Database

Desktop Browser

MobiOne Test Center

Json

jQTouch +

jQuery

HTML

DAL

7

www.inspectorit.com

Buckle Up!

1.Install jQTouch framework

2.Explore jQTouch sample mobile web app

3.Review how we are exposing JSON data from the DotNetNuke Blog Module

4.Build a mobile web app version of our blog

5.Consume JSON with jQuery

6.Test App with MobiOne

8

www.inspectorit.com

Let’s Code

Have you had enough PowerPoint?

9

www.inspectorit.com

Resources

• jQuery: www.jquery.com • jQTouch Framework: www.jqtouch.com• jQTouch Support and Docs:

http://code.google.com/p/jqtouch/ • MobiOne Emulator: http://www.genuitec.com/mobile/ • Book: Building iPhone Apps with HTML, CSS and Javascript

• My Blog: www.cto20.com • Follow my tweets: www.twitter.com/antoniochagoury• Connect with me:

http://linkedin.com/in/antoniochagoury • Email me: antonio@inspectorit.com