JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.7/leaflet.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.7/leaflet.js"></script>
<script src="https://code.jquery.com/jquery-1.12.1.min.js"></script>
<script src="https://code.jquery.com/ui/1.11.3/jquery-ui.min.js"></script>
<script src="https://rawgit.com/dwilhelm89/LeafletSlider/master/SliderControl.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.11.3/themes/smoothness/jquery-ui.css">
<div id='map'></div>

CSS

body {
    padding: 0;
    margin: 0;
}

html,
body,
#map {
    height: 100%;
    width: 100%;
}

JavaScript

var slider = {
    "type": "FeatureCollection",
    "features": [{
        "type": "Feature",
        "geometry": {
            "type": "Point",
            "coordinates": [35.1966, 31.7825]
        },
        "properties": {
            "GPSId": "2",
            "DateStart": "2015-06-23",
            "DateClosed": "2016-01-23",
            "GPSUserName": "fake2",
            "GPSUserColor": "#FF5500",
            "Gender": "Male",
            "Active": 1
        }
    }, {
        "type": "Feature",
        "geometry": {
            "type": "Point",
            "coordinates": [35.2, 31.780117]
        },
        "properties": {
            "GPSId": "6",
            "DateStart": "2015-06-23",
            "DateClosed": "2016-01-23",
            "GPSUserName": "fake1",
            "GPSUserColor": "#00FF57",
            "Gender": "Female",
            "Active": 0
        }
    }, {
        "type": "Feature",
        "geometry": {
            "type": "Point",
            "coordinates": [35.201715, 31.779548]
        },
        "properties": {
            "GPSId": "15",
            "DateStart": "2015-02-21",
            "DateClosed": "2016-02-28",
            "GPSUserName": "fake10",
            "GPSUserColor": "#00FF57",
            "Gender": "Male",
            "Active": 1
        }
    }, {
        "type": "Feature",
        "geometry": {
            "type": "Point",
            "coordinates": [35.200987, 31.779606]
        },
        "properties": {
            "GPSId": "16",
            "DateStart": "2015-01-01",
            "DateClosed": "2016-01-01",
            "GPSUserName": "fake11",
            "GPSUserColor": "#00FF57",
            "Gender": "Female",
            "Active": 0
        }
    }, {
        "type": "Feature",
        "geometry": {
            "type": "Point",
            "coordinates": [35.200987, 31.780522]
        },
        "properties": {
            "GPSId": "17",
            "DateStart": "2015-02-04",
            "DateClosed":...