ArcGIS Maps SDK for JavaScript: App Development with Components, Part 4: Extending and Styling

Presented at the 2026 Esri Developer Summit by Kitty Hurley and Rene Rubalcava in Palm Springs, California.

• Slides, opens in a new window
• Recording, opens in a new window

This session was the final presentation as part of a 4 part series. To explore the other 3 presentations in the series, visit:

• Part 1: Programming Patterns
• Part 2: Using Frameworks
• Part 3: User Experience

Branches

• main: Base application
• rr/modes: Switching Calcite modes
• rr/modes-basemaps: Switching basemaps when switching Calcite modes
• rr/app-customize: Finished application. Custom design tokens, logo, and custom attribution

Getting started

• npm run dev - Runs the app in development mode.
• npm run build - Builds the app for production to the build folder.
• npm run preview - Builds the app and serves it locally for testing.

This template uses the following packages:

• @arcgis/core
• @arcgis/map-components
• @arcgis/charts-components
• @esri/calcite-components

Resources

• Calcite design token usage
• Building your UI with Map components
• Subscribe to the Calcite Community
• Subscribe to the ArcGIS Maps SDK for JavaScript Community

Tutorials and samples

• Calcite: Build a dark mode switch
• JavaScript Maps SDK: Color theming
• JavaScript Maps SDK: Layer list theming