JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet/v1.0.0-rc.1/leaflet.css">
<script src="http://cdn.leafletjs.com/leaflet/v1.0.0-rc.1/leaflet.js"></script>
<div id="map"></div>

CSS

#map {
    height: 500px;
}

JavaScript

var map = L.map("map");
L.tileLayer("http://{s}.tile.osm.org/{z}/{x}/{y}.png").addTo(map);

map.setView([48.85, 2.35], 10);

var fg = L.featureGroup().addTo(map);

for (var i = 0; i < 50; i += 1) {
	L.marker(getRandomLatLng()).addTo(fg);
}

// Fit all markers after 1 second.
setTimeout(function () {
	map.fitBounds(fg.getBounds());
}, 1000);

function getRandomLatLng() {
	return [
  	48.8 + 0.1 * Math.random(),
    2.25 + 0.2 * Math.random()
  ];
}