JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://openlayers.org/en/v3.1.1/css/ol.css">
<script src="http://openlayers.org/en/v3.1.1/build/ol.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/console.js/0.0.2/console.min.js"></script>
<!DOCTYPE html>
<html>
<head>

<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css" integrity="sha512-puBpdR0798OZvTTbP4A8Ix/l+A4dHDD0DGqYW6RQ+9jxkRFclaxxQb/SJAWZfWAkuyeQUytO7+7N4QKrDh+drA==" crossorigin=""/>
<script src="https://unpkg.com/[email protected]/dist/leaflet.js"
integrity="sha512-nMMmRyTVoLYqjP9hrbed9S+FzjZHW5gY1TWCHA5ckwXZBadntCNs8kEqAWdrb9O7rxbCaA4lKTIWjDXZxflOcA==" crossorigin=""></script>


<link rel="stylesheet" href="https://unpkg.com/leaflet-control-geocoder/dist/Control.Geocoder.css" />
<script src="https://unpkg.com/leaflet-control-geocoder/dist/Control.Geocoder.js"></script>

</head>
<body>

<div id="mapid" style="width: 600px; height: 400px;"></div>
<script>
    	var map = L.map('mapid').setView([20, 0], 1);

      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 geocoder = L.Control.geocoder({
              defaultMarkGeocode: false
          })
          .on('markgeocode', function(e) {
              var mark = e.geocode.center;
              console.log(e.geocode);
              marker.setLatLng(mark);
              circle.setLatLng(mark);
              map.setView(mark, 2);
          })
          .addTo(map);

	map.on('click', onMapClick);
  
</script>

<script>
    function updateSlider(slideAmount) {
        var sliderDiv = document.getElementById("sliderAmount");
        sliderDiv.innerHTML = slideAmount;
        circle.setRadius(slideAmount * 60);
        console.log(test);
    }
    
    
</script>
<input id="slide" type="range" min="1" max="70000" step="70" value="10" onchange="updateSlider(this.value)">

<div...

JavaScript

$.getJSON('https://nominatim.openstreetmap.org/search&limit=1&polygon_geojson=1&polygon_threshold=0.05&format=json', function(data) {
	var FoundExtent = data[0].geojson;
	console.log(data[0]);          			        L.geoJSON(FoundExtent).addTo(map);
         
 });