Modern web development is different with Dojo
The one-stop shop for all your front-end needs
A few challenges to modern web development
1) Some parts of Dojo are less modern than others
In particular, Dijit, the UI framework
2) Can't cherry pick just the bits you need
1) Use alongside an opinionated framework
Other framework is in control of the app
Ignore Dojo, pretend like it's not there
Access Esri modules through a compatibility layer
Dojo is in control of the app
Works for full-screen, map centric apps
Once you start adding UI elements...
May want to include some of your favorite JS libs
Even lightweight frameworks
Modern apps are organized as a tree of components
Designed for challenges of a different era
Complicated semantic mark up
For rest of app, use a modern UI framework
Maybe just markup and CSS
DON'T use built-in UI components
-
dijit/form/...
-
dijit/layout/...
Instead, pair with a more modern UI library
Working with Other Libraries
Dojo uses Asynchronous Module Definition (AMD)
Dojo implements AMD differently than others
Module loading in Dojo is a one way street
Can't load Esri/Dojo modules from other AMD loaders
You can load other libraries with Dojo's AMD loader
You can do this, but...
... redundant & heavy page weight
Everything is a trade-off
Page wieght vs. functionality
Page wieght vs. developer productivity
Specify main
other than 'index.js'
Use Dojo's AMD loader to load:
- Your own AMD modules
- 3rd Party UMD and AMD modules
- Esri/Dojo modules
Be selective about the libraries you add
- Check if Dojo already did that (it's already on the page)
- Use for functional gaps (like mobile-first UI components)
- Decide if it's worth any gains in developer productivity
- Don't add libraries just because they're trendy
Babel: ES2015 modules => AMD (livereload & build)
> bower install arcgis-js-api
Do NOT build Dojo as part of livereload
If you need to fine tune the knobs: Karma
Use Babel to transpile ES2015 to ES5 AMD
Optimize (build) apps with large code bases
Modern Tools for the Modern Web Developer Thu @ 1:00PM
Joshua Peterson, Gavin Rehkemper
Automating Builds for Enterprise JavaScript Applications Thu @ 2:30PM
George Bochenek, Randy Jones
Optimizing Your JavaScript App for Performance Thu @ 2:30PM
Lloyd Heberlie, Rene Rubalcava
Using Modern ES6 and TypeScript Features on Top of Dojo 1.x Wed @ 4:00PM
Dylan Schiemann
Using TypeScript with ArcGIS JS API Development Thu @ 5:30PM
Rene Rubalcava, Dasa Paddock
Full Stack End to End JavaScript Testing with Intern Thu 4:00PM
Dylan Schiemann
Javascript Applications for the Enterprise: Test More, Work Less Fri @ 1:00PM
George Bochenek, Randy Jones
Some (Free) Opinions on Structuring Dojo Applications
JavaScript is a loosey goosey language
Apps and teams benefit from some direction
Boilerplates are a starting point
Makes Dojo build configuration easier
Style guides add consistency, help productivity
Modern style guides should be about best practices
Generators scaffold out boilerplate code for us
There is a generator for Dojo boilerplate, but...
Modern Development with the Web AppBuilder
Opinionated frameowrk on top of Esri JS API
Unique WSIWG builder experience
Provides app infrastructure
Heavy use of convetion - influenced by Rails
Easy for configurators = harder for developers
WSIWG builder adds complexity
Demo: yo esri-appbuilder-js
Web AppBuilder for ArcGIS: Customizing and Extending Wed @ 9:00AM
Moxie Zhang, Julie Powell, Esri
Web AppBuilder for ArcGIS: Development Tools and Techniques Fri @ 9:00AM & 1:00PM
Gavin Rehkemper, Tom Wayson
Web AppBuilder for ArcGIS: Customizing Themes Wed @ 10:30AM
Alison Sizer, Yiwei Ma
Build Your Web App Widgets Using TypeScript Wed @ 1:35PM
Mark Cederholm
Modern Web Development with the ArcGIS API for JavaScript and Web AppBuilder
https://github.com/tomwayson/mwd-jsapi/
@tomwayson
|