JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet/v0.7.7/leaflet.css">
<script src="http://cdn.leafletjs.com/leaflet/v0.7.7/leaflet.js"></script>
<div id="map"></div>

CSS

#map {
    height: 500px;
}


.leaflet-overlay-pane { z-index: 5; }
.leaflet-shadow-pane  { z-index: 4; }

JavaScript

var map = L.map("map").fitBounds([[50.5, 5], [52.5, 6]]);

L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
    attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);

var marker = L.marker([51.441767, 5.470247],{
    icon: L.icon({
        iconUrl: 'http://cdn.leafletjs.com/leaflet/v0.7.7/images/marker-shadow.png',
		shadowUrl: 'http://cdn.leafletjs.com/leaflet/v0.7.7/images/marker-icon.png'
	})
}).addTo(map);

L.circle([51.441767, 5.470247], 100000, {
	fillOpacity: 0.7,
    fillColor: 'red'
}).addTo(map);