Geodev
HackerLabs
Andy Gup, Gavin Rehkemper

Welcome to the
Geodev hackerlabs
What's a geodev hackerlab?
-
Build geo apps with ArcGIS
-
Go beyond the documentation
-
Under the hood - Maps to apps
-
Informal
-
Interactive
-
Tips & tricks
-
Follow along or try yourself
Format
Demos & Short labs
What are we building?
Portland Neighborhoods App

1) ArcGIS Online (maps, data, services, analyses)?
2) ArcGIS JavaScript development?
Scale of 1-10...
Questions
How familiar are you with:
Getting Started
ArcGIS Development
ArcGIS Platform


ArcGIS Dev Process
Data
Design
Develop
Desktop
Server
ArcGIS Pro
Map Viewer
Templates
App Builders
APIs
REST Services
Web Maps
Apps
Let's get set up!
-
Sign up and explore ArcGIS for Developers
-
Explore projects on esri.github.io
-
Explore ArcGIS.com and login
-
Go to jsbin.com
Voucher Code - 1000 credits
Code: LOUIEHACK
- Sign in between now and 8/17/2016 5pm CT
- Valid until 2/17/2017
Part 1 - Data
ArcGIS Online
Store data in the cloud
Hosted Services
-
Feature Service
-
Tile Service
-
RESTful
1. Import Data
-
ArcGIS Online
-
Use "Add Item"
-
View and Query REST endpoint
2. Create New Data
-
ArcGIS for Developers
-
Create Dataset
-
Define schema interactively
-
ArcGIS Online Map View to add data
3. Make Data from Data
-
GeoEnrich Data
-
Buffers
-
Drive/walk time
-
Spatial Analyses
CODE
-
Use feature service URLs
-
Add as a layer to the map
-
Uses default styling
Your turn!
Part 2 - Design
ArcGIS Online
Create and style
web maps
Create a new web map
-
ArcGIS Online Map Viewer
-
Add layers and basemaps
-
Create, Edit, Share data
-
Use in apps
-
Stored and accessible as JSON
Style Layers
-
Default Renderers
-
Points
-
Lines
-
Polygons
-
-
Use custom symbology
Style Popups
- Override default popup settings
- Format - title, body, fields, values
- Charts
Smart Mapping
- "Smart" styling of layers based on data
- Apply symbols and colors
- Based on fields, data, formulas
- Color ramps with breaks
- Override
Save Layer Styles
- Copy and save layers with custom symbology
- Save as new items
- Inspect JSON
- Use JSON in apps
Style Vector Tiles
- New basemaps in ArcGIS Online (Beta)
- Easy to edit and style root.json
- Re-upload to update your layer
Style 3d layers
- Use Scene viewer or JS API 4.0
- Access layers
- Apply 3D symbols
Code
- Add a styled layer to an app
- Style a layer with JSON
- Style a layer popup
- Add vector tile basemap
Your turn!
Part 3 - Develop
Templates, Builders & APIs
Build apps from
maps and layers
Web Map Apps
- Reference web map and it's configurations
- e.g. title, subtitle, legend, map, popups
- Re-use styles and configuration
- Can be updated independently of app code
Apps from Web Maps
1. Configurable Apps
- Specific apps that bring your maps to life
- Many to choose from
- Configure, save, share, reconfigure
- Source code on GitHub
- Download, customize and host
2. Web AppBuilder
- Powerful app builder
- Mobile friendly apps
- Many themes and layouts
- Easy to configure, save, share
- Builder - custom widgets and themes
3. ArcGIS JS API 3.x/4.x
- Powerful APIs for accessing ArcGIS
- Documentation and samples
- Access web maps by ID
- Widgets
Apps from Layers
Esri-Leaflet
- Plugin for accessing ArcGIS services
- Basemaps, feature services, geo services
- Access REST endpoints
- Pure JS API
Apps in
Frameworks
Calcite Maps - Bootstrap
- Modern framework for map apps
- CSS for different layouts
- Optional custom Sass build
- Support for ArcGIS JS 3.x, 4.x & Esri-Leaflet
Native Apps
from Maps
App Studio
- Tool for building native apps - no code!
- Create from web maps and templates
- Build for iOS, Android, Windows, Mac
- Player for testing and distribution
- Builder for local development
Your turn!
-
ArcGIS Dev Process: Data - Design - Develop
-
ArcGIS services, spatial analyses and mapping tools
-
ArcGIS Templates, Builders and APIs
Use web maps to build apps quickly!
Wrap-up
What did you think?
GeoDev Hackerlabs
By Andy G
GeoDev Hackerlabs
- 2,083