DEV Community

Leigh Halliday
Leigh Halliday

Posted on

17 8

Mapbox - Interactive Maps in React (Video)

In this video we'll see how to use Mapbox to display markers for all the skateparks from Ottawa, our great capital of Canada.

Source code can be found here: https://github.com/leighhalliday/mapbox-react-demo

Data can be found here: http://data.ottawa.ca/dataset/skateboard-parks/resource/8c26bbf7-51d9-4b54-997a-c472c5b6d355

Seriously, props to Ottawa for making so much open data available in an easily digestible format.

Top comments (9)

Collapse
 
mattfigler profile image
Matt Figler

When DEV & skateboarding coalesce!

Collapse
 
leighhalliday profile image
Leigh Halliday

Ohhh yea! :D Thanks for watching!

Collapse
 
dance2die profile image
Sung M. Kim

Thank you, Leigh.
Just finished watching it and you made it so easy to show data on the map.

Collapse
 
leighhalliday profile image
Leigh Halliday

:) Glad you enjoyed it, Sung! I have quite a few more videos on YouTube if you're interested in checking them out.

Collapse
 
dance2die profile image
Sung M. Kim

Say no more~ Already subscribed 😉

Collapse
 
kristibyrnes profile image
Kristi Byrnes

Great tutorial!

Collapse
 
leighhalliday profile image
Leigh Halliday

Thank you, Kristi! I appreciate it!

Collapse
 
jaimindesai76 profile image
Jaimin Desai

Nice tutorial !!

Collapse
 
leighhalliday profile image
Leigh Halliday

Thanks Jaimin! Glad you enjoyed it!

Qodo Takeover

Introducing Qodo Gen 1.0: Transform Your Workflow with Agentic AI

Rather than just generating snippets, our agents understand your entire project context, can make decisions, use tools, and carry out tasks autonomously.

Read full post

AWS GenAI LIVE!

GenAI LIVE! is a dynamic live-streamed show exploring how AWS and our partners are helping organizations unlock real value with generative AI.

Tune in to the full event

DEV is partnering to bring live events to the community. Join us or dismiss this billboard if you're not interested. ❤️