Transcript of "An overview of mobile html + java script frameworks"
Frameworks > jQuery Mobile > Resources• Download: http://jquerymobile.com/• Level of compatibility for different devices• List of data attributes
Frameworks > Kendo UI• Similar concept and syntax to jQuery Mobile• Components adaptively render to look and behave according to expectations for a particular platform – Currently supports: Android, iOS, Blackberry – Ex. Navigation controls for iOS are displayed at the bottom, on Android – at the top
Frameworks > PhoneGap• Phone Gap (classic) is used within the development environment of the mobile platform that you are targeting – Ex. Phone Gap provides JARs to use with Java, dlls to use for .NET• Phone Gap build is a new cloud-based service that builds multiple native packages in the cloud – In most cases it would not be necessary to setup development environment for each platform
Frameworks > PhoneGap• No components – Can use components from jQuery Mobile, Kendo UI, Sencha• Native API Accelerometer Events Camera File Capture Geolocation Compass Media Connection Notification Contacts Storage Device
Frameworks > PhoneGap > Resources• Project Website• GitHub directory of PhoneGap Plugins• Creating PhoneGap plugin for Android• Web Intent plugin for Android• Phonegap project structure using Git submodules• Crossing The PhoneGap For Multiplatform Mobile Applications
Frameworks > Sencha Touch 2• Components such as date pickers, toolbars, tabs• Note: components do not adaptively render like Telerik’s Kendo UI but do look “mobile- ish”
Frameworks > Sencha Touch 2 > Resources• Download• Guide• Tutorial #1• Tutorial #2• Examples on GitHub• Sencha blog posts – Includes fix for bug with Windows 7 (x64)• Look for the Examples folder in your installation
Testing > IIS Express• Problem: The default ASP .NET Development Server (Cassini) doesn’t allow for remote access – something required for testing mobile devices• One Solution: Switch to IIS Express – Will be default server in Visual Studio 11• Step-By-Step Instructions on My Blog : http://bit.ly/GzBZT0
Testing > IIS Express > Configuration• Change Visual Studio to use IIS Express instead of ASP .NET Development Server• Change default configuration of IIS Express to allow for remote access• Configure Firewall to grant permissions to allow mobile devices to request the local site – Ex. Allow inbound requests on a particular port number, provided that the computers are on the local subnet and the computer is on a network marked as Private
Testing > Emulators > Windows Phone• Download Microsoft Visual Studio Express 2010 for Windows Phone• Start > All Programs > Windows Phone SDK 7.1 > Windows Phone Emulator• To access localhost use IP address 127.0.0.1• Press Page Up / Page Down to enable / disable keyboard input (keyboard mapping reference)
Testing > Emulators > Android• Download the Android SDK & Android Virtual Device (AVD) Manager• To access localhost use IP address 10.0.2.2• Can use telnet to send commands to the emulator – Use following command: telnet localhost 5554 – Telnet will need to be enabled on your dev machine
Testing > Emulators > Android > Resources• Java SE Development Kit• Eclipse• Android SDK• ADT Plugin for Eclipse• MOTODEV• Samsung Emulators
Testing > Adobe Shadow• Wirelessly connect to multiple mobile devices and preview, inspect, debug in real time• Supported Environments: – Development Computer: Windows 7 & Mac OS X – Development Browser: Chrome – Mobile Devices: Any Android or iOS device, on same network as the development computer
Testing > Adobe Shadow• To test sites on mobile devices during development, use IIS Express and Adobe Shadow• Change default configuration of web site or web project to use computer name or IP address instead of localhost
Testing > Adobe Shadow > Resources• Download• Video• Using Visual Studio + IIS Express + Adobe Shadow to Test Local Websites on Mobile Devices
This presentation is available for viewing &download: http://slidesha.re/zWlQlQ “See you next time…”
A particular slide catching your eye?
Clipping is a handy way to collect important slides you want to go back to later.