JSFiddle - React, Tailwind, and code Playground

HTML

<div id="box"></div>

<pre id="info">Info</pre>

CSS

#info {
    position: absolute;
    top: 0;
    right: 0;
    width: 50%;
}

#box {
    width: 80px;
    height: 80px;
    background: red;
    position: absolute;
    top: 0;
    left: 0;
}

JavaScript

window.addEventListener("deviceorientation", function(evt){
 var msg = "Drehung: " + evt.alpha + "\n" +
 "Vorwärts-Rückwärts: " + evt.beta + "\n" +
 "Links-Rechts: " + evt.gamma + "\n" +
 "Absolute Daten? " + evt.absolute
 info.innerHTML = msg;
}, false);