JSFiddle - React, Tailwind, and code Playground

HTML

<div class="dropzone">Drop!</div>

CSS

.dropzone {
  text-align: center;
  background: #EEE;
  border: 0.2em solid #000;
  padding: 3em;
}

JavaScript

$('.dropzone').on('dragover', function(evt){
  $('.dropzone').css("background", "red");
  evt.preventDefault();
});

$('.dropzone').on('dragenter', function(evt){
  evt.preventDefault();
});

$('.dropzone').on('drop', function(evt){
$('.dropzone').css("background", "#EEE");
  evt.preventDefault();
  window.alert('Drop!');
});