News From Tech Ed 2013

Visual Studio 2013Sql Server 2014

Developing Mobile Websites with LightSwitch & jQuery Mobile

L. (Van) Van LoweTwitter: lvanlowe

Email: van@nuttin-but.netWeb: www.nuttin-but.net

IntroductionsIt always helps to know who you’re dealing with, so here’s a little background on me.

@lvanlowe

Computer Science MS

MCSD

Independent Consultant since 1996

Enterprise (LOB) Developer since 1979

Asp.Net Developer since 2003

Volunteer Developer Prince William Special Olympics

fortune 100 company 15+ years

Objective

To show how to create mobile websites with Lightswitch

Resources

Visual Studio LightSwitch Developers Center

http://msdn.microsoft.com/en-us/vstudio/ff796201

Visual Studio LightSwitch Team Bloghttp://blogs.msdn.com/b/lightswitch/

Visual Studio LightSwitch Help Websitehttp://www.lightswitchhelpwebsite.com

AgendaWhat are we going to talk about today?

Connecting to backend

JavaScript

Auhentication

History of Lightswithch

Creating Screens, Dialogs & Popups

Jquery Mobile Widgets

Real World ExamplePublishing

What is LightSwitch?

Development environment in Visual Studio for building data-based business productivity apps and data services quicklyPlumbing is all handled for you, the only code you write is the business logicLightSwitch provides a roadmap for the application as its needs and user base grows

Flexible deployment modelPublish On-Prem, Windows Azure or Office 365 / SharePoint

“LightSwitch is simple on the outside but rich on the inside.”

LightSwitch Sweet Spots

Mobile Web Business AppsOptimized for touch devices on multiple platforms (iOS, Android, WP8, WinRT)Default screen templates provide no-code experiences that can target multiple form factors

Desktop Business AppsOptimized for heavy data entry, mouse & keyboard scenarios, with legacy app integration (i.e. COM)Default screen templates provide no-code experiences for manipulating data in a variety of ways

Office 365 / SharePoint 2013 with Provider Hosting

Leverage experiences and infrastructure for app access, organizational identity, and lifecycle managementProvider hosting (IIS, Azure) allows flexible operational infrastructure choices

LightSwitch Version Roadmap

V2

V3

V1 July 2011: Visual Studio 2010 (Out-of-band)Silverlight In-Browser & Desktop apps, Azure Cloud Services

August 2012: Visual Studio 2012OData Services, Azure Websites

April 2013: Visual Studio 2012 Update 2HTML5 Mobile Client, SharePoint/O365 Integration

May 2013: HTML Client Runtime Update 1 (NuGet opt-in)Support for jQuery Mobile 1.3

iPad

Visual Studio 2012 Update 2LightSwitch Key Features

HTML ClientResponsive design supports multiple form factorsProduces Single-Page-Applications (SPAs)jQueryMobile 1.3 supportStreamlined screen creation and navigationCommand barsPopups and Screens as dialogsSemantic types

SharePoint 2013 appsConnect to SharePoint 2013 Lists as EntitiesAccess SharePoint assets via CSOMProvider-hosted & autohosted deploymentSharePoint On-Prem or Office 365

OtherLocalize app in multiple languagesGlobalizationLINQ queries over DataWorkspaceServerApplicationContext for custom services

PerformanceApp load: minification, static compressionOData: reduced payload size (JSON lite)

History

Release HTML Preview 1(June 2012)Gernaerate HTLM, CSS, Javascript & Jquery-Mobile

Release HTML Preview 2 (November 2012)Works with release version of VS2012

Visual Studio 2012 Update 2 (March 2013)Release HTML release version

jQuery Mobile

A simple to use, UI framework for building cross-platform Mobile Web applications

HTML Client Design GoalsTouch-oriented, immersive applications that run on all modern devices

“Mobile-first” - Enable all modern tablet & mobile devices to create connections to LightSwitch services Allow easy integration of JavaScript ecosystem widgets/controls for specific customization

Consistent design experienceStandards based

JQuery / JQueryMobile basedCSS 3.0HTML5

LightSwitch Architecture

Mid

dle

Tie

r

IIS 7

Submit Pipeline

Queries

Data Workspace

WCF Data Service

ASP.NET 4.0+

Data

Sou

rces

SQ

L Serv

er

Azu

re

Share

Poin

t

OD

ata

Serv

ices

Oth

er…

Clie

nt

Tier

Silverlight5

Desktop

MethodsControl

sScreen

s

Data Workspace

WCF Data Service

HTML5

Mobile

OData Service *

* Clients connect via OData, enabling custom clients (Excel, Windows Store apps, WPF, etc.) access to the middle-tier services also

LightSwitch Hosting Options

Office 365

On-Prem SharePoint 2013

- Windows Azure

- IIS on your premises

-SQL Azure

- SQL Server

Hosting the LS intrinsic database requires an edition of SQL Server (Express to Enterprise 2005 + higher). External data sources can be other types

IIS 7+ is recommended, IIS6 supported

SharePoint 2013 Apps (option)

Cloud

On-Prem

Desktop: Windows, Mac

Mobile: HTML5 Browsers

HTML client optimized for iOS 5/6, Android 4, WinRT, Win Phone 8. Desktop uses Silverlight 5 in-browser (Windows, Mac) or out-of-browser (Windows only)

LightSwitch SharePoint apps can be hosted in Azure for both O365 & SharePoint 2013 on premises. HTML or in-browser Silverlight clients supported.

HTML Client Supported Platforms

iOS 5/6Android 4Windows RTWindows Phone 8

Some limitations: Android 2.3, Windows Phone 7.5

Demo http://pwsocalendar.azurewebsites.net/client/

http://crossroadspca.azurewebsites.net/client/

Demo