strategies for building mobile apps using arcgis api for ...€¦ · device_model = ipad ....
TRANSCRIPT
Esri UC 2014 | Technical Workshop |
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript Kelly Hutchins, Lloyd Heberlie
Esri UC 2014 | Technical Workshop |
• Introductions • Expectations • Agenda
Welcome
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Esri UC 2014 | Technical Workshop |
Why are we here?
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Esri UC 2014 | Technical Workshop |
Mobile resources in the API Kelly Hutchins
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Esri UC 2014 | Technical Workshop |
Mobile resources in the API
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Esri UC 2014 | Technical Workshop | Esri UC 2014 | Technical Workshop |
Kelly Hutchins
ArcGIS for Developers website
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Esri UC 2014 | Technical Workshop |
Designing for mobile Lloyd Heberlie
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Esri UC 2014 | Technical Workshop |
Touch aware map
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Esri UC 2014 | Technical Workshop |
HTML 5 input types
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Esri UC 2014 | Technical Workshop |
Geocoder, HomeButton
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
esri/dijit/Geocoder
esri/dijit/HomeButton
Esri UC 2014 | Technical Workshop |
Popup Mobile
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
esri/dijit/PopupMobile
Esri UC 2014 | Technical Workshop |
Basemap Gallery
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
esri/dijit/BasemapGallery
Esri UC 2014 | Technical Workshop |
Basemap Toggle
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
esri/dijit/BasemapToggle
Esri UC 2014 | Technical Workshop |
Custom components
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Custom basemap switcher
Esri UC 2014 | Technical Workshop | Esri UC 2014 | Technical Workshop |
Lloyd Heberlie
Designing for mobile
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Esri UC 2014 | Technical Workshop |
Productivity and code management Kelly Hutchins
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Esri UC 2014 | Technical Workshop |
Setup a developer machine
Source Control
Code quality and verification
web server
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Esri UC 2014 | Technical Workshop |
Code formatting and management
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Esri UC 2014 | Technical Workshop |
Automation and continuous integration
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Esri UC 2014 | Technical Workshop |
• JSLint • JSHint
Code validation
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Esri UC 2014 | Technical Workshop |
CSS preprocessors
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Esri UC 2014 | Technical Workshop | Esri UC 2014 | Technical Workshop |
Lloyd Heberlie
Productivity and code management
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Esri UC 2014 | Technical Workshop |
Debugging and testing for mobile Kelly Hutchins
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Esri UC 2014 | Technical Workshop |
Emulators / Simulators Opera Mobile Emulator iOS Simulator * Windows Phone Emulator * Android Emulator
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Esri UC 2014 | Technical Workshop |
Physical devices
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Esri UC 2014 | Technical Workshop |
Browser based testing
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Esri UC 2014 | Technical Workshop |
Remote debugging
• Safari Web Inspector Remote • Google Chrome remote debugging • Adobe Edge Inspect
- Synchronized screen capture, device details - Node.js (weinre local)
• Web Inspector Remote (weinre)
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Esri UC 2014 | Technical Workshop |
Enable Safari remote web inspection
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Esri UC 2014 | Technical Workshop |
Safari remote debugging
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Esri UC 2014 | Technical Workshop |
Safari remote debugging
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Esri UC 2014 | Technical Workshop |
Chrome remote debugging
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Esri UC 2014 | Technical Workshop |
Chrome remote debugging
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Esri UC 2014 | Technical Workshop |
Adobe Edge Inspect
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Esri UC 2014 | Technical Workshop |
Adobe Edge Inspect
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Esri UC 2014 | Technical Workshop |
Adobe Edge Inspect
device_model = iPhone device_res = 1136x640 orientation = portrait os_name = iOS os_version = 7.0.4 pixel_density = 326 ppi
device_model = LGE Nexus 5 device_res = 1080x1776 orientation = portrait os_name = Android os_version = 4.4.2 pixel_density = 480 dpi
device_model = iPad device_res = 1024x768 orientation = landscape os_name = iOS os_version = 7.0.4 pixel_density = 132 ppi
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Esri UC 2014 | Technical Workshop | Esri UC 2014 | Technical Workshop |
Lloyd Heberlie
Debugging mobile
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Esri UC 2014 | Technical Workshop |
Optimizing for mobile Lloyd Heberlie
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Esri UC 2014 | Technical Workshop |
HTML manifest
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Esri UC 2014 | Technical Workshop |
HTML manifest on device
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Esri UC 2014 | Technical Workshop |
File compression and caching headers
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Esri UC 2014 | Technical Workshop |
Dealing with high density resolution
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Esri UC 2014 | Technical Workshop |
iOS network simulation
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Esri UC 2014 | Technical Workshop |
Android network speed emulation
command Option <speed> kilobits/sec
emulator -netspeed <named value> emulator -netspeed <num> (both) emulator -netspeed <up>:<down> emulator -netspeed gsm emulator -netspeed 14.4 80 emulator -netspeed 40.0
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Esri UC 2014 | Technical Workshop |
Other network simulation options
• Fiddler (Windows) • Charles Network Debugging proxy • Network Link Conditioner (Mac OS) • Dummynet
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Esri UC 2014 | Technical Workshop |
• Esri resources • Esri resource proxy
Additional resources
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Esri UC 2014 | Technical Workshop |
Thank you…
• Please fill out the session survey:
First Offering ID (Tuesday): 1255 Second Offering ID (Thursday): 1366
Online – www.esri.com/ucsessionsurveys Paper – pick up and put in drop box
Strategies for Building Mobile Apps Using ArcGIS API for JavaScript
Esri UC 2014 | Technical Workshop | Strategies for Building Mobile Apps Using ArcGIS API for JavaScript