JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://cdn.sencha.com/ext/gpl/4.2.1/ext-all.js"></script>
<link rel="stylesheet" href="http://cdn.sencha.com/ext/gpl/4.2.1/resources/css/ext-all.css">
<script src="http://openlayers.org/api/2.13.1/OpenLayers.js"></script>
<link rel="stylesheet" href="http://openlayers.org/api/2.13/theme/default/style.css">
<div id="map"></div>

JavaScript

Ext.Loader.setConfig({
    enabled: true,
    disableCaching: false,
    paths: {
        GeoExt: "http://geoext.github.com/geoext2/src/GeoExt"
    }
});

Ext.require([
    'GeoExt.panel.Map',
    'GeoExt.panel.Legend',
    'GeoExt.container.WmsLegend',
    'GeoExt.container.UrlLegend'
]);

Ext.onReady(function() {
    var map = new OpenLayers.Map('map');
    var wms1 = new OpenLayers.Layer.WMS('beam','http://demo.boundlessgeo.com/geoserver/wms', {
        layers: 'topp:tasmania_roads',
        format: 'image/png',
        transparent: true
    }, {
        isBaseLayer: false,
        maxExtent: new OpenLayers.Bounds(16163316.214986019, -5376658.475781524, 16505672.629703628, -4990654.175976949)
    });
        
    var wms2 = new OpenLayers.Layer.WMS('cities','http://demo.boundlessgeo.com/geoserver/wms', {
        layers: 'topp:tasmania_cities',
        format: 'image/png',
        transparent: true
    }, {
        isBaseLayer: false,
        maxExtent: new OpenLayers.Bounds(16163316.214986019, -5376658.475781524, 16505672.629703628, -4990654.175976949)
    });

    map.addLayer(new OpenLayers.Layer.OSM('osm'));
    map.addLayers([wms1, wms2]);
    
    var mapPanel = Ext.create('GeoExt.panel.Map', {
        region: 'center',
        map: map
    });
    
    var legendPanel = Ext.create('GeoExt.panel.Legend', {
        title: 'Legend',
        region: 'west',
        width: 200,
        filter: function(record) {
            return record.getLayer().name.indexOf('') == -1;
        }
    });
    
    Ext.create('Ext.container.Viewport', {
        layout: 'border',
        items: [legendPanel, mapPanel]
    });
    
    map.setCenter([16334494, -5183656], 7);
});