JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.3/leaflet.js"></script>
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.3/leaflet.css">
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<div id='map'></div>

CSS

body { margin:0; padding:0; }
#map { position:absolute; top:0; bottom:0; width:100%; }

JavaScript

L_PREFER_CANVAS = true;
//Init a map, and attempt a locate.
var map = L.map('map', {
    center: [39.84, -96.591],
    zoom: 4
}).locate();

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 vanillaLayer = new L.LayerGroup();
map.addLayer(vanillaLayer);

map.on('moveend',function(e) {
    console.log('moveend fired.')
})

L.circleMarker(map.getCenter()).addTo(vanillaLayer);