JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://cdn.leafletjs.com/leaflet-0.7/leaflet.js"></script>
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7/leaflet.css">
<script src="https://rawgithub.com/Leaflet/Leaflet.markercluster/master/dist/leaflet.markercluster.js"></script>
<link rel="stylesheet" href="https://rawgithub.com/Leaflet/Leaflet.markercluster/master/dist/MarkerCluster.css">
<link rel="stylesheet" href="https://rawgithub.com/Leaflet/Leaflet.markercluster/master/dist/MarkerCluster.Default.css">
<div id="map"></div>

CSS

#map { height: 380px; }

JavaScript

var map;
var markers;
var currentLat = 50.55445247756283;
var currentLng = 2.5872802734374996;
var currentZoom = 10;
var studentLat = 50.63106;
var studentLng = 3.04682;
var markerList = [{
    nom : "toto", latitude :50.7005965, longitude : 3.1572908
}, {
    nom : "toto", latitude :50.7005965, longitude : 3.1572908
},{
    nom : "toto", latitude :50.7005965, longitude : 3.1572908
},{
    nom : "toto", latitude :50.7005965, longitude : 3.1572908
},{
    nom : "toto", latitude :50.7005965, longitude : 3.1572908
},{
    nom : "toto", latitude :50.7005965, longitude : 3.1572908
},{
    nom : "toto", latitude :50.7005965, longitude : 3.1572908
}]

var markerOnTheMap = [];

var resizeMap = function () {
    $('.map').removeClass('restrict');
};



var initMap = function () {
    var mapProvider = 'http://{s}.tile.cloudmade.com/{key}/22677/256/{z}/{x}/{y}.png';
    var key = 'BC9A493B41014CAABB98F0471D759707';
    var maxZoom = 15;
    var minZoom = 5;

    if (currentLat) {
        var viewLocation = {
            latitude: currentLat,
            longitude: currentLng,
            zoom: currentZoom
        };
        var session = true;
    } else {
        var viewLocation = {
            latitude: lat,
            longitude: lng,
            zoom: 10
        };
    }

    var latlng = new L.LatLng(viewLocation.latitude, viewLocation.longitude);

    map = new L.Map('map', {
        center: latlng,
        zoom: viewLocation.zoom,
        maxZoom: maxZoom,
        minZoom: minZoom,
        attributionControl: false,
        scrollWheelZoom: false,
    });

    var osm = L.tileLayer(mapProvider, {
        attribution: 'Map data &copy; 2011 OpenStreetMap contributors, Imagery &copy; 2011 CloudMade',
        key: key
    });

    map.addLayer(osm);

    markers = new L.MarkerClusterGroup();
    map.addLayer(markers);

    
    addMarkerToMap(markerList);
};

var addMarkerToMap = function (markerList) {

    var LeafIcon = L.Icon.extend({
        options: {
           ...