JSFiddle - React, Tailwind, and code Playground

HTML

<h2> Javascript Capture Keyboard Input Example </h2> 
<h3>onkeydown - onkeyup</h3>
    Key Pressed: <span id="kp"></span> <br/> 
    Key Code: <span id="kc"> </span> 

<p id="status">Keyboard Event Status</p>

JavaScript

document.onkeydown = function(event) {
	var key_press = String.fromCharCode(event.keyCode);
	var key_code = event.keyCode;
	document.getElementById('kp').innerHTML = key_press;
    document.getElementById('kc').innerHTML = key_code;
	var status = document.getElementById('status');
	status.innerHTML = "DOWN Event Fired For : "+key_press;
}
document.onkeyup = function(event){
    var key_press = String.fromCharCode(event.keyCode);
	var status = document.getElementById('status');
	status.innerHTML = "UP Event Fired For : "+key_press;
        if (key_press == "38") {
        &&
    } if (key_press == "39") {
        &&
    } else if (key_press == "40") {
        &&
    } else if (key_press == "37") {
        alert ("First born beauty");
    }
});
}