Geodev
HackerLabs

www.github.com/esri/geodev-hackerlabs
Sign up for a free developer subscription @ developers.arcgis.com
Agenda
- 12:30 - 5:00 PM Hackerlab
- 5:30 - 9:00 PM - Meetup
The format is flexible, but we do have a mission...
...to use tools to help us build powerful mapping apps!
Portland Neighborhood app

Who are you?
What experience do you have with mapping platforms, HTML, CSS, JS, ArcGIS...?
What are you looking for today?
Who has a web server running on their machine?
http://esriurl.com/webserver
Valuable Resources
- ArcGIS for Developers
- ArcGIS.com
- esri.github.io
Let's sign up for a free developer license
voucher code: [code goes here]

http://developers.arcgis.com
voucher code: [code goes here]
http://developers.arcgis.com

ArcGIS Platform

Building Mapping Apps can be hard!
...but it doesn't have to be.
1. Data
2. Design
3. Develop
12:30 - Sign-up, Overview
12:45 - Data Demo
1:00 - Data Hands-on
1:30 - Design Demo
1:45 - Design Hands-on
2:15 - Develop Demo
2:45-5:00 - Develop Hands-on

Data
Lesson #1: Get your data in the cloud!
what are Hosted Services?
- Feature Service
- Tile Service

Import data
- ArcGIS Online
- Use "Add Item"
- View and Query REST endpoint
Create from Scratch
- ArcGIS for Developers
- Create Dataset
- Define schema interactively
- ArcGIS Online Map View to add data
Create data from Data
- Spatial Analyses
- Buffers
- GeoEnrich Data
Sharing Data
- ArcGIS Online "items"
- Levels - Everyone, Groups, Private
- Custom authentication - e.g. traffic layer
Design
Lesson #2: Design the (web) Map First!
What's a Web Map?
- ArcGIS Online Map Viewer
- Choose basemap
- Add layers
- Style layers
- Create, Edit, Share
Styling Map Layers
- Default Renderers
- Polygons
- Lines
- Points
- Your custom symbology
- Smart mapping
Saving Layer Styles
- In the Map
- In the Feature Service
Styling Popups
- Title
- Body
- Fields (override)
- Formatting
- Charts
Develop
Lesson #3: Build your App FOR YOUR Map
web map Apps
- Fastest and easiest way
- Re-use data, design and configuration
- Easy to get title, subtitle, legend, map, popups
3 patterns
- Templates
- Builders
- APIs
App Templates
- Share
- Configure
- Save
- Re-configure
- Download code
- Build/host your own
Web AppBuilder
- Share
- Configure
- Save
- Re-configure
- Download (option)
- Build/host your own
ArcGIS JS API
- ArcGIS for Developers
- Samples and sandbox
- Use your own webmapID!
Apps from Layers
ArcGIS JS API 3.x/4.0
- Get REST endpoints
- Load into map
- Sort/order
- Default symbols or override
Esri-Leaflet
- Get REST endpoints
- Load into map
- Sort/order
- Default symbols or override
- HINT: Use Esri-Leaflet-Renderer!
Geojson
- Access directly
- ArcGIS JS - geojson-layer-js
- Esri-Leaflet - geojson
Fancier map Apps
Bootstrap starter
- Load entire map or layers
- ArcGIS JS/Esri-Leaflet
- See ArcGIS JS 4.0 beta1 (2D/3D)
Custom WAb Apps
Web Appbuilder - Local
- Download and install
- Configure with organization
- Build or seal code (see GitHub)
Summary
- ArcGIS has tools to help build apps
- Store data in the cloud
- Design and style maps
- Use samples/templates/builders
What did you think?
GeoDev HackerLabs
By Jim Barry
GeoDev HackerLabs
- 2,003