Resources.md

Resources from Strategies for Building Mobile Apps Using ArcGIS API for JavaScript

Smartphones and tablets are now outselling PCs, so it's the perfect time to think about designing applications for mobile devices. In this workshop, you will learn design techniques, best practices, and tips and tricks for building a mobile site that is optimized for usability and performance using ArcGIS API for JavaScript.

Mobile resources in the API

• Get the ArcGIS API for JavaScript
• ArcGIS API for JavaScript compact build
• ArcGIS API for JavaScript Web Optimizer
• JavaScript frameworks
  • The Dojo Toolkit - Demos Index
  • jQuery Mobile Demos
• Viewport Settings
• Feature detection and browser sniffing
• HTML5 and Mobile
• Device Orientation
• Mobile References
• Tutorial: getting started with mobile
• Mobile Samples

Designing for mobile

• Making forms fabulous with HTML5

• Geocoder

  • Samples

• HomeButton

  • Sample
  • View it Live

• PopupMobile

  • Sample
  • View it Live

• BasemapGallery

  • Sample
  • View it Live

• BasemapToggle

  • Sample
  • View it Live

Productivity for your workflows

• Node.js

  • How to Use npm as a Build Tool

• JavaScript Task Runners

  • Gulp
  • Grunt, Grunt project scaffolding
    • grunt
    • grunt-contrib-clean
    • grunt-contrib-compass
    • grunt-contrib-concat
    • grunt-contrib-copy
    • grunt-contrib-cssmin
    • grunt-contrib-htmlmin
    • grunt-contrib-uglify
    • grunt-contrib-watch
    • grunt-targethtml
    • load-grunt-tasks
    • time-grunt
    • grunt-esrijso-modulelist
    • grunt-manifest
    • Automate all things

• CSS Preproccessors

  • Sass
    • Compass
  • Stylus
  • Less
  • CSS Preprocessors Sass, Less and Stylus - presented by Patrick Arlt
  • Write Responsive, Cross-Browser CSS Faster with SASS and Compass and Slides - presented by Patrick Arlt

• JSHint (Esri jsapi resources)

• Static Site Generators

• Acetate

• Acetate Sample

• Static Site Generators - Smashing Magazine

Debugging and Testing

• Open Device Lab
• LabUp
• Safari Web Inspector Remote
• Google Chrome remote debugging
• Google Chrome, Mobile Emulation
• Adobe Edge Inspect

Optimizing for mobile

• A Beginner's Guide to Using the Application Cache

• IcoMoon, Icon Fonts

• CSS Tricks, Icon Fonts are Awesome

• File compressions and caching headers

  <IfModule mod_deflate.c>
      AddOutputFilterByType DEFLATE text/plain
      AddOutputFilterByType DEFLATE text/html
      AddOutputFilterByType DEFLATE text/xml
      AddOutputFilterByType DEFLATE text/css
      AddOutputFilterByType DEFLATE application/xml
      AddOutputFilterByType DEFLATE application/xhtml+xml
      AddOutputFilterByType DEFLATE application/rss+xml
      AddOutputFilterByType DEFLATE application/javascript
      AddOutputFilterByType DEFLATE application/x-javascript
      AddOutputFilterByType DEFLATE application/json
      AddOutputFilterByType DEFLATE image/svg+xml
  </IfModule>

   <IfModule mod_expires.c>
   	ExpiresActive on
   	ExpiresByType text/html "access plus 5 minutes" 
   	ExpiresByType image/jpg "access plus 6 months" 
   	ExpiresByType image/jpeg "access plus 6 months" 
   	ExpiresByType image/gif "access plus 6 months" 
   	ExpiresByType image/png "access plus 6 months"
   	ExpiresByType text/css "access plus 6 months" 
   	ExpiresByType text/javascript "access plus 6 months" 
   	ExpiresByType application/javascript "access plus 6 months"
   	ExpiresByType application/x-javascript "access plus 6 months"
   	ExpiresByType application/x-icon "access plus 1 year" 
   </IfModule>

• Android: Using the Emulator, Network Delay Emulation

Other resources

• SmashingMagazine: The Mobile Book
• Esri jsapi resources
  • Bower
  • JSHint
  • OAuth
  • TypeScript
• Esri resource proxy
• Hello Compass Sass Grunt scss (Shows features of the compass framework with Sass)
• Hello Sass Grunt scss (Shows some of the powerful features of Sass using scss)
• Hello Grunt watch Sass
• Grunt task to generate a EsriJS dojo module list for the ArcGIS API for JavaScript Optimizer
• Android Device Art Generator
• JetBrains WebStorm Blog
• Emmet