JSFiddle - React, Tailwind, and code Playground
HTML
<div class="novaLinha">
<div>
<label for="txtVoce">Faleme sobre você:</label>
</div>
<div>
<textarea id="txtVoce" name="txtVoce" cols="40" rows="10"></textarea>
<p><span id="carResTxtVoce" style="font-weight: bold;">400</span> caracteres restantes</p>
<p class="aviso" id="avisoTxtVoce" style="display:none;">Este campo não pode ficar vazio!</p>
</div>
</div>
JavaScript
var textarea = document.querySelector('textarea');
var info = document.getElementById('carResTxtVoce');
var limite = 400;
textarea.addEventListener('keyup', verificar);
function verificar(e) {
var qtdcaracteres = this.value.length;
var restantes = limite - qtdcaracteres;
if (restantes < 1) {
this.value = this.value.slice(0, limite);
return info.innerHTML = 0;
}
info.innerHTML = restantes;
}