Courtney Yatteau
@cyatteau.bsky.social
Developer Advocate at Esri | International Conference Speaker | Former Math/CS Educator | opinions = my own | http://youtube.com/@c_yatteau
Day 20: 30 Day Map Challenge - Water
I built a fully simulated prototype that shows a fake flood or spill event. The ripple effect is a visual idea for how an impact radius could look in a real app.
See the code: codepen.io/cyatteau/pen...
#ArcGIS #maps #30DayMapChallenge #GIS
I built a fully simulated prototype that shows a fake flood or spill event. The ripple effect is a visual idea for how an impact radius could look in a real app.
See the code: codepen.io/cyatteau/pen...
#ArcGIS #maps #30DayMapChallenge #GIS
November 21, 2025 at 1:23 AM
Day 20: 30 Day Map Challenge - Water
I built a fully simulated prototype that shows a fake flood or spill event. The ripple effect is a visual idea for how an impact radius could look in a real app.
See the code: codepen.io/cyatteau/pen...
#ArcGIS #maps #30DayMapChallenge #GIS
I built a fully simulated prototype that shows a fake flood or spill event. The ripple effect is a visual idea for how an impact radius could look in a real app.
See the code: codepen.io/cyatteau/pen...
#ArcGIS #maps #30DayMapChallenge #GIS
November 21, 2025 at 12:39 AM
Day 4 of Coding Maps for Beginners is up!
Today you'll add a full search experience with a single line of code. Drop arcgis-search inside your arcgis-map and you get address lookup, suggestions, and instant zoom to any result.
Watch the tutorial: www.youtube.com/watch?v=ndUe...
#ArcGIS #maps #GIS
Today you'll add a full search experience with a single line of code. Drop arcgis-search inside your arcgis-map and you get address lookup, suggestions, and instant zoom to any result.
Watch the tutorial: www.youtube.com/watch?v=ndUe...
#ArcGIS #maps #GIS
November 20, 2025 at 11:32 PM
Day 4 of Coding Maps for Beginners is up!
Today you'll add a full search experience with a single line of code. Drop arcgis-search inside your arcgis-map and you get address lookup, suggestions, and instant zoom to any result.
Watch the tutorial: www.youtube.com/watch?v=ndUe...
#ArcGIS #maps #GIS
Today you'll add a full search experience with a single line of code. Drop arcgis-search inside your arcgis-map and you get address lookup, suggestions, and instant zoom to any result.
Watch the tutorial: www.youtube.com/watch?v=ndUe...
#ArcGIS #maps #GIS
November 20, 2025 at 9:51 PM
Day 19: 30 Day Map Challenge - Projections
I took the World Countries layer from the ArcGIS Living Atlas and ran it through a loop of different map projections using D3. Same data, many different ways of seeing the world.
Code: codepen.io/cyatteau/pen...
#ArcGIS #D3 #JavaScript #projections #GIS
I took the World Countries layer from the ArcGIS Living Atlas and ran it through a loop of different map projections using D3. Same data, many different ways of seeing the world.
Code: codepen.io/cyatteau/pen...
#ArcGIS #D3 #JavaScript #projections #GIS
November 20, 2025 at 8:08 PM
Day 19: 30 Day Map Challenge - Projections
I took the World Countries layer from the ArcGIS Living Atlas and ran it through a loop of different map projections using D3. Same data, many different ways of seeing the world.
Code: codepen.io/cyatteau/pen...
#ArcGIS #D3 #JavaScript #projections #GIS
I took the World Countries layer from the ArcGIS Living Atlas and ran it through a loop of different map projections using D3. Same data, many different ways of seeing the world.
Code: codepen.io/cyatteau/pen...
#ArcGIS #D3 #JavaScript #projections #GIS
Day 18: 30 Day Map Challenge - Out of this world
I built a meteor shower effect by layering an HTML5 canvas animation on top of a Leaflet map with a dark basemap. The meteors are random, but this pattern could power real-time visualizations, as well.
codepen.io/cyatteau/pen...
#ArcGIS #Leaflet
I built a meteor shower effect by layering an HTML5 canvas animation on top of a Leaflet map with a dark basemap. The meteors are random, but this pattern could power real-time visualizations, as well.
codepen.io/cyatteau/pen...
#ArcGIS #Leaflet
November 20, 2025 at 7:51 PM
Day 18: 30 Day Map Challenge - Out of this world
I built a meteor shower effect by layering an HTML5 canvas animation on top of a Leaflet map with a dark basemap. The meteors are random, but this pattern could power real-time visualizations, as well.
codepen.io/cyatteau/pen...
#ArcGIS #Leaflet
I built a meteor shower effect by layering an HTML5 canvas animation on top of a Leaflet map with a dark basemap. The meteors are random, but this pattern could power real-time visualizations, as well.
codepen.io/cyatteau/pen...
#ArcGIS #Leaflet
Day 17: 30 Day Map Challenge - A new tool
I tried the just out of beta ArcGIS chart components with the ArcGIS map components. Selecting bars in the chart highlights features on the map, and clicking the map selects the matching bar.
codepen.io/cyatteau/pen...
#ArcGIS #GIS #map #30DayMapChallenge
I tried the just out of beta ArcGIS chart components with the ArcGIS map components. Selecting bars in the chart highlights features on the map, and clicking the map selects the matching bar.
codepen.io/cyatteau/pen...
#ArcGIS #GIS #map #30DayMapChallenge
November 20, 2025 at 6:52 PM
Day 17: 30 Day Map Challenge - A new tool
I tried the just out of beta ArcGIS chart components with the ArcGIS map components. Selecting bars in the chart highlights features on the map, and clicking the map selects the matching bar.
codepen.io/cyatteau/pen...
#ArcGIS #GIS #map #30DayMapChallenge
I tried the just out of beta ArcGIS chart components with the ArcGIS map components. Selecting bars in the chart highlights features on the map, and clicking the map selects the matching bar.
codepen.io/cyatteau/pen...
#ArcGIS #GIS #map #30DayMapChallenge
ArcGIS Maps SDK for JavaScript + a bit of AI = a fun playful combo 😊
Check out my full tutorial: youtu.be/9lS6Z-WuRRI
#ArcGIS #AI #JavaScript #maps #OpenAI
Check out my full tutorial: youtu.be/9lS6Z-WuRRI
#ArcGIS #AI #JavaScript #maps #OpenAI
November 20, 2025 at 3:16 AM
ArcGIS Maps SDK for JavaScript + a bit of AI = a fun playful combo 😊
Check out my full tutorial: youtu.be/9lS6Z-WuRRI
#ArcGIS #AI #JavaScript #maps #OpenAI
Check out my full tutorial: youtu.be/9lS6Z-WuRRI
#ArcGIS #AI #JavaScript #maps #OpenAI
Day 3 of my Coding Maps for beginners mini series has been posted!
In this one, I show how to turn any map click into an AI generated fun fact using the ArcGIS Maps SDK for JavaScript and OpenAI. It's quick to code with a fun result.
www.youtube.com/watch?v=9lS6...
#ArcGIS #GIS #Esri #JavaScript
In this one, I show how to turn any map click into an AI generated fun fact using the ArcGIS Maps SDK for JavaScript and OpenAI. It's quick to code with a fun result.
www.youtube.com/watch?v=9lS6...
#ArcGIS #GIS #Esri #JavaScript
November 20, 2025 at 1:49 AM
Day 3 of my Coding Maps for beginners mini series has been posted!
In this one, I show how to turn any map click into an AI generated fun fact using the ArcGIS Maps SDK for JavaScript and OpenAI. It's quick to code with a fun result.
www.youtube.com/watch?v=9lS6...
#ArcGIS #GIS #Esri #JavaScript
In this one, I show how to turn any map click into an AI generated fun fact using the ArcGIS Maps SDK for JavaScript and OpenAI. It's quick to code with a fun result.
www.youtube.com/watch?v=9lS6...
#ArcGIS #GIS #Esri #JavaScript
Happy GIS Day! 🗺️ It is the perfect time to learn how to build a map for the web with JavaScript. No coding experience required.
Check out my beginner series on my channel to follow along:
www.youtube.com/playlist?lis...
#GISDay #GIS #ArcGIS #coding #JavaScript #maps
Check out my beginner series on my channel to follow along:
www.youtube.com/playlist?lis...
#GISDay #GIS #ArcGIS #coding #JavaScript #maps
November 19, 2025 at 9:48 PM
Happy GIS Day! 🗺️ It is the perfect time to learn how to build a map for the web with JavaScript. No coding experience required.
Check out my beginner series on my channel to follow along:
www.youtube.com/playlist?lis...
#GISDay #GIS #ArcGIS #coding #JavaScript #maps
Check out my beginner series on my channel to follow along:
www.youtube.com/playlist?lis...
#GISDay #GIS #ArcGIS #coding #JavaScript #maps
𝗛𝗮𝗽𝗽𝘆 𝗚𝗜𝗦 𝗗𝗮𝘆 from your web mapping girlie! 🗺️
I'm spending the day in my Esri hoodie surrounded by maps, code, and my Coding Maps beginner series. 👩💻
Celebrate by building your first JavaScript map through my video playlist: www.youtube.com/playlist?lis...
#ArcGIS #GIS #maps #GISDay #Esri
I'm spending the day in my Esri hoodie surrounded by maps, code, and my Coding Maps beginner series. 👩💻
Celebrate by building your first JavaScript map through my video playlist: www.youtube.com/playlist?lis...
#ArcGIS #GIS #maps #GISDay #Esri
November 19, 2025 at 8:05 PM
Day 16: 30 Day Map Challenge - Cell
I mapped 2020 census block groups as tiny population cells across the US, shading each one by people per square mile to show how density shifts from coast to coast.
See the code: codepen.io/cyatteau/pen...
#ArcGIS #GIS #maps #Esri #30DayMapChallenge
I mapped 2020 census block groups as tiny population cells across the US, shading each one by people per square mile to show how density shifts from coast to coast.
See the code: codepen.io/cyatteau/pen...
#ArcGIS #GIS #maps #Esri #30DayMapChallenge
November 19, 2025 at 3:49 PM
Day 16: 30 Day Map Challenge - Cell
I mapped 2020 census block groups as tiny population cells across the US, shading each one by people per square mile to show how density shifts from coast to coast.
See the code: codepen.io/cyatteau/pen...
#ArcGIS #GIS #maps #Esri #30DayMapChallenge
I mapped 2020 census block groups as tiny population cells across the US, shading each one by people per square mile to show how density shifts from coast to coast.
See the code: codepen.io/cyatteau/pen...
#ArcGIS #GIS #maps #Esri #30DayMapChallenge
Day 15: 30 Day Map Challenge - Fire 🔥
Built a wildfire hotspot visualizer with Esri Leaflet. The pulsing markers show relative intensity using made-up sample locations to keep the focus on the visualization itself.
See the code: codepen.io/cyatteau/pen...
#ArcGIS #Maps #GIS #Leaflet
Built a wildfire hotspot visualizer with Esri Leaflet. The pulsing markers show relative intensity using made-up sample locations to keep the focus on the visualization itself.
See the code: codepen.io/cyatteau/pen...
#ArcGIS #Maps #GIS #Leaflet
November 19, 2025 at 2:06 AM
Day 15: 30 Day Map Challenge - Fire 🔥
Built a wildfire hotspot visualizer with Esri Leaflet. The pulsing markers show relative intensity using made-up sample locations to keep the focus on the visualization itself.
See the code: codepen.io/cyatteau/pen...
#ArcGIS #Maps #GIS #Leaflet
Built a wildfire hotspot visualizer with Esri Leaflet. The pulsing markers show relative intensity using made-up sample locations to keep the focus on the visualization itself.
See the code: codepen.io/cyatteau/pen...
#ArcGIS #Maps #GIS #Leaflet
Day 2 of my 5-day mini series for Geography Awareness Week is up. 🎨
Today I walk through how to use the ArcGIS Vector Tile Style Editor quick edit options to create your own custom basemap and apply it right in your ArcGIS JS SDK map.
www.youtube.com/watch?v=4gV3...
#ArcGIS #GIS #Esri #JavaScript
Today I walk through how to use the ArcGIS Vector Tile Style Editor quick edit options to create your own custom basemap and apply it right in your ArcGIS JS SDK map.
www.youtube.com/watch?v=4gV3...
#ArcGIS #GIS #Esri #JavaScript
November 19, 2025 at 1:24 AM
Day 2 of my 5-day mini series for Geography Awareness Week is up. 🎨
Today I walk through how to use the ArcGIS Vector Tile Style Editor quick edit options to create your own custom basemap and apply it right in your ArcGIS JS SDK map.
www.youtube.com/watch?v=4gV3...
#ArcGIS #GIS #Esri #JavaScript
Today I walk through how to use the ArcGIS Vector Tile Style Editor quick edit options to create your own custom basemap and apply it right in your ArcGIS JS SDK map.
www.youtube.com/watch?v=4gV3...
#ArcGIS #GIS #Esri #JavaScript
Happy Geography Awareness Week!
Join me all week to learn how to use the ArcGIS Maps SDK for JavaScript web components. No coding experience required 😉
Day 1 video is already up!
Get started on YouTube: youtube.com/shorts/4digx...
#ArcGIS #maps #coding #GIS #JavaScript
Join me all week to learn how to use the ArcGIS Maps SDK for JavaScript web components. No coding experience required 😉
Day 1 video is already up!
Get started on YouTube: youtube.com/shorts/4digx...
#ArcGIS #maps #coding #GIS #JavaScript
November 18, 2025 at 4:46 AM
Happy Geography Awareness Week!
Join me all week to learn how to use the ArcGIS Maps SDK for JavaScript web components. No coding experience required 😉
Day 1 video is already up!
Get started on YouTube: youtube.com/shorts/4digx...
#ArcGIS #maps #coding #GIS #JavaScript
Join me all week to learn how to use the ArcGIS Maps SDK for JavaScript web components. No coding experience required 😉
Day 1 video is already up!
Get started on YouTube: youtube.com/shorts/4digx...
#ArcGIS #maps #coding #GIS #JavaScript
Day 1 of my 5-day mini series for Geography Awareness Week is live. 📽️
Starting the series with a simple setup: build a fully interactive map using the ArcGIS Maps SDK for JavaScript with a single HTML element.
Watch: www.youtube.com/watch?v=cyN8...
#ArcGIS #GIS #JavaScript #webdevelopment #maps
Starting the series with a simple setup: build a fully interactive map using the ArcGIS Maps SDK for JavaScript with a single HTML element.
Watch: www.youtube.com/watch?v=cyN8...
#ArcGIS #GIS #JavaScript #webdevelopment #maps
November 18, 2025 at 4:01 AM
Day 1 of my 5-day mini series for Geography Awareness Week is live. 📽️
Starting the series with a simple setup: build a fully interactive map using the ArcGIS Maps SDK for JavaScript with a single HTML element.
Watch: www.youtube.com/watch?v=cyN8...
#ArcGIS #GIS #JavaScript #webdevelopment #maps
Starting the series with a simple setup: build a fully interactive map using the ArcGIS Maps SDK for JavaScript with a single HTML element.
Watch: www.youtube.com/watch?v=cyN8...
#ArcGIS #GIS #JavaScript #webdevelopment #maps
It's the start of 𝗚𝗲𝗼𝗴𝗿𝗮𝗽𝗵𝘆 𝗔𝘄𝗮𝗿𝗲𝗻𝗲𝘀𝘀 𝗪𝗲𝗲𝗸 (Nov 17-21)! To celebrate, I'm launching a 5-day mini video series on building maps for the web using ArcGIS JS SDK web components in CodePen. Beginner friendly!
See the intro: www.youtube.com/watch?v=T7VZ...
#ArcGIS #maps #geography #coding #JavaScript
See the intro: www.youtube.com/watch?v=T7VZ...
#ArcGIS #maps #geography #coding #JavaScript
November 18, 2025 at 2:27 AM
It's the start of 𝗚𝗲𝗼𝗴𝗿𝗮𝗽𝗵𝘆 𝗔𝘄𝗮𝗿𝗲𝗻𝗲𝘀𝘀 𝗪𝗲𝗲𝗸 (Nov 17-21)! To celebrate, I'm launching a 5-day mini video series on building maps for the web using ArcGIS JS SDK web components in CodePen. Beginner friendly!
See the intro: www.youtube.com/watch?v=T7VZ...
#ArcGIS #maps #geography #coding #JavaScript
See the intro: www.youtube.com/watch?v=T7VZ...
#ArcGIS #maps #geography #coding #JavaScript
Day 14: 30 Day Map Challenge - Data: OpenStreetMap
Zoomed-in walkable cores for DC, Amsterdam, Tokyo, and London. I used Overpass to pull OSM footways, pedestrian streets, and steps, styled on top of an ArcGIS dark basemap.
codepen.io/cyatteau/pen...
#30DayMapChallenge #Esri #Leaflet #ArcGIS #OSM
Zoomed-in walkable cores for DC, Amsterdam, Tokyo, and London. I used Overpass to pull OSM footways, pedestrian streets, and steps, styled on top of an ArcGIS dark basemap.
codepen.io/cyatteau/pen...
#30DayMapChallenge #Esri #Leaflet #ArcGIS #OSM
November 17, 2025 at 6:03 PM
Day 14: 30 Day Map Challenge - Data: OpenStreetMap
Zoomed-in walkable cores for DC, Amsterdam, Tokyo, and London. I used Overpass to pull OSM footways, pedestrian streets, and steps, styled on top of an ArcGIS dark basemap.
codepen.io/cyatteau/pen...
#30DayMapChallenge #Esri #Leaflet #ArcGIS #OSM
Zoomed-in walkable cores for DC, Amsterdam, Tokyo, and London. I used Overpass to pull OSM footways, pedestrian streets, and steps, styled on top of an ArcGIS dark basemap.
codepen.io/cyatteau/pen...
#30DayMapChallenge #Esri #Leaflet #ArcGIS #OSM
Day 13: 30 Day Map Challenge - 10 minute map
A quick app that maps what you can reach within a 10 minute walk from any point on Earth. Search or click the map and the walk shed is generated using the ArcGIS Routing service.
codepen.io/cyatteau/pen...
#30DayMapChallenge #Leaflet #ArcGIS #maps
A quick app that maps what you can reach within a 10 minute walk from any point on Earth. Search or click the map and the walk shed is generated using the ArcGIS Routing service.
codepen.io/cyatteau/pen...
#30DayMapChallenge #Leaflet #ArcGIS #maps
November 16, 2025 at 7:08 PM
Day 13: 30 Day Map Challenge - 10 minute map
A quick app that maps what you can reach within a 10 minute walk from any point on Earth. Search or click the map and the walk shed is generated using the ArcGIS Routing service.
codepen.io/cyatteau/pen...
#30DayMapChallenge #Leaflet #ArcGIS #maps
A quick app that maps what you can reach within a 10 minute walk from any point on Earth. Search or click the map and the walk shed is generated using the ArcGIS Routing service.
codepen.io/cyatteau/pen...
#30DayMapChallenge #Leaflet #ArcGIS #maps
Day 12: 30 Day Map Challenge 2025 - Map from 2025
A field guide from a future time travel agency: this app maps "time tourist hotspots" around the world, where each city is tied to a favorite era to visit and a short note about the vibes.
codepen.io/cyatteau/pen...
#30DayMapChallenge #GIS #maps
A field guide from a future time travel agency: this app maps "time tourist hotspots" around the world, where each city is tied to a favorite era to visit and a short note about the vibes.
codepen.io/cyatteau/pen...
#30DayMapChallenge #GIS #maps
November 16, 2025 at 6:52 PM
Day 12: 30 Day Map Challenge 2025 - Map from 2025
A field guide from a future time travel agency: this app maps "time tourist hotspots" around the world, where each city is tied to a favorite era to visit and a short note about the vibes.
codepen.io/cyatteau/pen...
#30DayMapChallenge #GIS #maps
A field guide from a future time travel agency: this app maps "time tourist hotspots" around the world, where each city is tied to a favorite era to visit and a short note about the vibes.
codepen.io/cyatteau/pen...
#30DayMapChallenge #GIS #maps
Day 11: 30 Day Map Challenge – Minimal map
A minimal map that displays a single country outline. Boundaries come from an ArcGIS feature layer, the dropdown loads automatically, and the light vector basemap keeps the focus on the shape.
codepen.io/cyatteau/pen...
#30DayMapChallenge #GIS #Leaflet
A minimal map that displays a single country outline. Boundaries come from an ArcGIS feature layer, the dropdown loads automatically, and the light vector basemap keeps the focus on the shape.
codepen.io/cyatteau/pen...
#30DayMapChallenge #GIS #Leaflet
November 14, 2025 at 1:23 AM
Day 11: 30 Day Map Challenge – Minimal map
A minimal map that displays a single country outline. Boundaries come from an ArcGIS feature layer, the dropdown loads automatically, and the light vector basemap keeps the focus on the shape.
codepen.io/cyatteau/pen...
#30DayMapChallenge #GIS #Leaflet
A minimal map that displays a single country outline. Boundaries come from an ArcGIS feature layer, the dropdown loads automatically, and the light vector basemap keeps the focus on the shape.
codepen.io/cyatteau/pen...
#30DayMapChallenge #GIS #Leaflet
Day 10: 30 Day Map Challenge - Air
I explored the new FlowRenderer-in-3D in ArcGIS JS SDK 4.34 by customizing the official wind sample with mood presets, a perspective toggle, and a purple glow ramp.
Sample: lnkd.in/eUVz4HHK
My app code: lnkd.in/ewzcAphE
#ArcGIS #JS #Esri #3D #30DayMapChallenge
I explored the new FlowRenderer-in-3D in ArcGIS JS SDK 4.34 by customizing the official wind sample with mood presets, a perspective toggle, and a purple glow ramp.
Sample: lnkd.in/eUVz4HHK
My app code: lnkd.in/ewzcAphE
#ArcGIS #JS #Esri #3D #30DayMapChallenge
November 13, 2025 at 8:49 PM
Day 10: 30 Day Map Challenge - Air
I explored the new FlowRenderer-in-3D in ArcGIS JS SDK 4.34 by customizing the official wind sample with mood presets, a perspective toggle, and a purple glow ramp.
Sample: lnkd.in/eUVz4HHK
My app code: lnkd.in/ewzcAphE
#ArcGIS #JS #Esri #3D #30DayMapChallenge
I explored the new FlowRenderer-in-3D in ArcGIS JS SDK 4.34 by customizing the official wind sample with mood presets, a perspective toggle, and a purple glow ramp.
Sample: lnkd.in/eUVz4HHK
My app code: lnkd.in/ewzcAphE
#ArcGIS #JS #Esri #3D #30DayMapChallenge
Day 9: 30 Day Map Challenge - Analog
A movable lens contrasts the ArcGIS Topographic basemap styled like ink on paper with the Imagery basemap of real satellite pixels. Toggle texture or swap layers to feel analog-style cartography beside a digital view.
codepen.io/cyatteau/pen...
#GIS #Maps
A movable lens contrasts the ArcGIS Topographic basemap styled like ink on paper with the Imagery basemap of real satellite pixels. Toggle texture or swap layers to feel analog-style cartography beside a digital view.
codepen.io/cyatteau/pen...
#GIS #Maps
November 12, 2025 at 4:13 PM
Day 9: 30 Day Map Challenge - Analog
A movable lens contrasts the ArcGIS Topographic basemap styled like ink on paper with the Imagery basemap of real satellite pixels. Toggle texture or swap layers to feel analog-style cartography beside a digital view.
codepen.io/cyatteau/pen...
#GIS #Maps
A movable lens contrasts the ArcGIS Topographic basemap styled like ink on paper with the Imagery basemap of real satellite pixels. Toggle texture or swap layers to feel analog-style cartography beside a digital view.
codepen.io/cyatteau/pen...
#GIS #Maps