How to integrate open street maps in react using leaflet and maptiler | React Leaflet | Part 1

This video explains how to integrate open street map (OSM) using leaflet in reactjs.

For this demo, I'm going to use maptiler as my OSM provider.

Demo + Source :

OSM Provider:

Subscribe to the channel for more videos.

[amatir-tutor]

what is the difference between 'Map' and 'MapContainer' components in react-leaflet...?

[ammnvx]

it didnt work with me it says there is Attempted import error: 'Map' is not exported from 'react-leaflet'. i tired MapContainer


Module parse failed: Unexpected token (10:41)
File was processed with these loaders:
*
You may need an additional loader to handle the result of these loaders.
| useEffect(function updatePathOptions() {
| if (props.pathOptions !== optionsRef.current) {
> const options = props.pathOptions ?? {};
|
| optionsRef.current = options;

[remrkabledev]

Great video, just what I've been looking for !

[durgabharathi]

I'm getting Uncaught TypeError cannot read properties of null(reading usestate)

[mehdioukach]

news : Map is remlaced by MapContainer

[sakthiganesh.c]

I was unable to import leaflet css that means if I import leaflet css the map does not shown...how can i solve it??

[rkboy]

map is not showing properly react. do you have any solution?

[mdfaiyazulhussain]

Hey thanks for sharing the info keep moving

[KunalJaiswal-ognf]

how can i integrate maptiler geoencoding in it????

[MohammadAyan-jzbi]

Hi, how to do the same thing in react -native app ?

[ahalyajadda]

From where u get the attribution value

[halouadev]

how can we add the point to our location (I mean: showing our location with a pin for example) ?

[amirhaghdoost]

hi, thanks for the video, that was great, but in my case it gives me the "window is not defined" error... what should I do?

[kamoliddinjamoliddinov]

Hello how are you?
Can you give me project source code, because I need to frontend side, Iʼm a backed developer so can you share me your github or gitlab ?

[RoadSafety]

I not found an email or phone number in your profile, can you give me one?