Group 2 - Managing Map Data
We've finished adding a map to our custom basemap style and adding markers. Now, the second lesson group is going to be about what makes maps impactful, the data, managing and creating it.
The following lessons are going to be about managing Leaflet State in a React app with hooks, creating your first GeoJSON document and adding your favorite restaurant locations, and lastly adding restaurant info to your GeoJSON document and display it in a tooltip on the map. Let's dig into some data!
Colby Fayock: [0:00] Hey, mappers. Welcome to Lesson Group Two. In our first lesson group, we added a map to our app with a custom-based map style. We even added a marker. The second lesson group is going to be about getting serious about what makes maps impactful, the data. We're going to walk through both managing that data and how to actually create it.
[0:16] Our first lesson will be about managing Leaflet state. Leaflet is a window-based API. While we have React components, managing the state between the two can get a little complex. We're going to learn how we can use React hooks to solve that challenge.
[0:27] In our second lesson, we're going to learn about the geospatial data format, GeoJSON. It's just a simple JSON document. We're going to walk through what makes it special. We'll also figure out how you can create your own.
[0:37] With that data, we'll add it to our map with markers. When dealing with restaurants, the location isn't the only thing that matters. Customers want to know what they serve and how to contact them.
[0:45] In our third lesson, we're going to learn how to add info to each of those restaurant locations. We'll use popups and we'll learn how to add them programmatically. This is one of the more impactful group of lessons. We'll build a foundation for how we can dynamically add data to our map.
[0:58] Ready to dig in some data? Let's get started with the first lesson of our group.