JSFiddle - React, Tailwind, and code Playground

HTML

<link href="http://code.jquery.com/ui/jquery-ui-git.css" rel="stylesheet" />
<script src="http://code.jquery.com/jquery-git.js"></script>
<script src="http://code.jquery.com/ui/jquery-ui-git.js"></script>

<ul>
    <li class="foo">One</li>
    <li class="foo">Two</li>
    <li class="foo">Three</li>
    <li class="foo">Four</li>
</ul>

CSS

li {
    border: 1px solid black;
}

.foo {
    height: 50px;
}

.placeholder {
    border: 1px solid red;
}

JavaScript

$( "ul" ).sortable({
    placeholder: "placeholder",
    forcePlaceholderSize: true
});

$( "li" ).resizable();