JSFiddle - React, Tailwind, and code Playground

HTML

<textarea placeholder='Enter comment'></textarea>

CSS

textarea:focus {
    height: 300px;
    margin: 20px;
    width: 585px;
    resize: none;
    overflow: hidden;
    vertical-align: top;
    transition: all 0.3s cubic-bezier(0.42, 0, 0.58, 1) 0;
}
textarea {
    height: 200px;
    margin: 20px;
    width: 585px;
}

JavaScript

$(document).ready(function () {

     $("textarea").focus(function (event) {
         if ($(this).val().length === 0) {
             $(this).height(100);
             $(this).css('resize', 'vertical');
             $(this).attr('placeholder', null);
         }
     });


     $("textarea").blur(function (event) {
         if ($(this).val().length === 0) {
             $(this).height(20);
             $(this).attr('placeholder', "Enter comment");
             $(this).css('resize', 'none');
         }
     });

 });