Как можно загручить JS, HTML и CSS чтобы можно было запустить онлайн

function getClear(){
    document.getElementById("current-value").innerText = 0
    document.getElementById("previous-value").innerText = ''
    postEqual = 1
}
function getDelete(){
    let output = document.getElementById("current-value").innerText
    output = output.substring( 0, output.length-1)
    if (output.length === 0){output = 0}
    if(output === 0){postEqual = 1}
    document.getElementById("current-value").innerText = output
}

function getPreviousOperand(){
    return document.getElementById("previous-value").innerText
}
function printPreviousOperand(chislo){
    document.getElementById("previous-value").innerText += chislo
}
function getCurrentOperand(){
    return document.getElementById("current-value").innerText 
}
function printCurrentOperand(number){
    if (number === '.' && document.getElementById("current-value").innerText.includes('.')){return}
    else if(number === '.' && !document.getElementById("current-value").innerText.includes('.')) {
        document.getElementById("current-value").innerText += number 
        postEqual=0
        return}
    if (number === '0' && document.getElementById("current-value").innerText === '0'){return}
    if (number === '^' && document.getElementById("current-value").innerText === '' | document.getElementById("current-value").innerText === '0' | document.getElementById("current-value").innerText === '0' | document.getElementById("current-value").innerText.includes('^')){return}
    if (postEqual=== 1){ 
    document.getElementById("current-value").innerText = ''
    document.getElementById("previous-value").innerText = ''
    postEqual = 0}
    document.getElementById("current-value").innerText += number
}
document.getElementById("current-value").innerText = 0
function updateCurrentOperand(operation){
    if (postEqual=== 1){document.getElementById("previous-value").innerText = ''; postEqual=0}
    if(operation=== '(' && getCurrentOperand()=== '0' ){  document.getElementById("current-value").innerText = ''}
    printPreviousOperand (getCurrentOperand()+operation)
    document.getElementById("current-value").innerText =''
}

var postEqual = 1
function equal(){
    printPreviousOperand(getCurrentOperand())
    let virajeniye = getPreviousOperand()
    document.getElementById("current-value").innerText = ''
    let splitVirajeniye = splitString(virajeniye)
    let otvet = Calculator(splitVirajeniye)
    printCurrentOperand(otvet)
    postEqual=1
} 
function splitString(term) {
    let splitStringList = []
    let counterNum = -1
    for (let i = 0; i < term.length; i++)
    {
        let temp = true
        temp = TryParseInt(term[i],false)
        if (temp !== false)
        {
            if (counterNum === -1) { counterNum = 0; }
            counterNum *= 10
            counterNum += parseInt(term[i])
            if (i === term.length - 1)
            {
                splitStringList[splitStringList.length] = counterNum
            }
        }
        else
        {  
            if (counterNum !== -1) { splitStringList[splitStringList.length] = counterNum}
            if (counterNum !== -1 && term[i].toString() ==='(' ){ splitStringList[splitStringList.length]='×' }
            if (term[i].toString() ==='.'){ splitStringList[splitStringList.length]=term[i]; counterNum = 1; continue}
            counterNum = -1
            splitStringList[splitStringList.length]= term[i]
        }
    }
    return splitStringList
}


function TryParseInt(str,defaultValue) {
    var retValue = defaultValue;
    if(str !== null) {
        if(str.length > 0) {
            if (!isNaN(str)) {
                retValue = parseInt(str);
            }
        }
    }
    return retValue;
}


var numsStack = []
var symbolPriorityStack = []
var symbolStack = []
var priority=0 , chekPriority = 0

function SetStucks(simbol)
 {
    chekPriority = priority
    symbolPriorityStack.push(priority)
    symbolStack.push(simbol)
}
function doCalculation(stope)
{
    let result = 0
    let d = 0
    let c = numsStack.pop();
    if (numsStack.length !== 0 && numsStack.length !== stope) { d = numsStack.pop(); }
    switch (symbolStack.pop())
    {
         case '+':
             result = d + c
             break;
         case '-':
             result = d - c
             break;
         case '.':
             while (c >= 1){ c /=10  }
             c=c*10-1
             result = d + c
             break;
         case '×':
             result = d * c
             break;
         case '÷':
             result = d / c
             break;
         case '^':
             result = Math.pow(d,c)
             break;
    }
    symbolPriorityStack.pop()
     numsStack.push(result)
     if (symbolPriorityStack.length !== 0) { chekPriority = symbolPriorityStack[symbolPriorityStack.length -1] }
     else { chekPriority = 0 }
     return result
     
 }
function Calculator(splitVirajeniye)
{
    let stop = -1
    let temp = true
    for (let i = 0; i < splitVirajeniye.length; i++)
    {
            temp = TryParseInt(splitVirajeniye[i].toString(),false)
        if (temp !== false)
        {
            numsStack.push(splitVirajeniye[i])
            if (i === splitVirajeniye.length - 1 && symbolPriorityStack.length !== 0)
            {
                do
                {
                    doCalculation(stop)
                } while (symbolStack.length !== 0)
                break;
            }
        }
        else
        {
            switch (splitVirajeniye[i].toString())
            {
                case '+':
                case '-':
                    priority = 1;
                    break;
                case '×':
                case '÷':
                    priority = 2;
                    break;
                case '^':
                    priority = 3;
                    break;
                case '.':
                    priority = 4;
                    break;
                case '(':
                    stop = numsStack.length;
                    symbolPriorityStack.push(0)
                    chekPriority = 0
                    symbolStack.push(splitVirajeniye[i]);
                    break;
                case ')':
                    while (symbolStack[symbolStack.length - 1] !== '(')
                    {
                         doCalculation(stop);
                    }
                    if (symbolStack[symbolStack.length - 1] === '(') { 
                        symbolStack.pop(); 
                        symbolPriorityStack.pop();
                        stop = -1;
                        chekPriority = 0;
                        if (symbolPriorityStack.length !== 0) { chekPriority = symbolPriorityStack[symbolPriorityStack.length - 1 ] }
                    }
                    if (i === splitVirajeniye.length - 1 && symbolPriorityStack.length !==0)
                    {
                        do
                        {
                            doCalculation(stop);
                        }
                        while (symbolStack.length !== 0);
                        break;
                    }
                    break;
            }
            if (splitVirajeniye[i].toString() !== '(' && splitVirajeniye[i].toString() !== ')') {
                while (true)
                {
                    if (priority > chekPriority)
                    {
                        SetStucks(splitVirajeniye[i].toString());
                        break;
                    }
                    else if (priority <= chekPriority)
                    {
                            doCalculation(stop);
                        
                    }
                }
            }
        }
    }
    return numsStack.pop();
}
 var buttonSound = new Audio();
 buttonSound.src = "TinyButtonPush.mpeg"
        



 

*, *::befor, *::after{
   box-sizing: border-box;
   font-family:  'Arial Narrow', sans-serif;
   font-weight : normal;
}


body {
    padding:0;
    margin:0;
    background: linear-gradient( to right, rgb(99, 12, 12),rgb(241, 187, 7))
}


.calculator-grid{
    display: grid;
    justify-content:center;
    align-content:center;
    min-height: 100vh;
    grid-template-columns: repeat(4,80px);
    grid-template-rows: minmax(120px, auto) ;
    font-family:  'Arial Narrow', sans-serif;
}

.calculator-grid> button{
    user-select:none;
    cursor: pointer;
    font-size: 3rem;
    border: 1px solid white;
    outline : none;
    background-color: rgba(255,255,255,.75);
}
.calculator-grid> button:hover{
    background-color: rgba(255,255,255,.99)
}
.span-two{
    grid-column: span 2;
    color: rgba(41, 134, 241, 0.99);

}

.output{
    grid-column: 1/-1;
    background-color: rgba(0,0,0,.75);
    display: flex;
    align-items: flex-end;
    justify-content: space-around ;
    flex-direction: column;
    padding: 10px;
    word-wrap: break-word;
    word-break: break-all;
}

.output .previous-operand {
    color: rgba(255,255,255,.65);
    font-size: 1rem;
}

.output .current-operand {
    color: white;
    font-size: 2.5rem;
}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Calculator</title>
    <link href="style.css" rel="stylesheet"> 
</head>
<body>
    <div class="calculator-grid">
        <div class="output">
            <div data-previous-operand class="previous-operand"><p id="previous-value"></p></div>
            <div data-current-operand class="current-operand"><p id="current-value"></p></div>
        </div>
        <button class="span-two" onclick="getClear(),buttonSound.play()">C</button>
        <button delete class="span-two" onclick="getDelete(),buttonSound.play()">&larr;</button>
        <button class="operation" onclick="updateCurrentOperand('('),buttonSound.play()">(</button>
        <button class="operation" onclick="updateCurrentOperand(')'),buttonSound.play()">)</button>
        <button class="number" onclick="printCurrentOperand('^'),buttonSound.play()">^</button>
        <button class="operation" onclick="updateCurrentOperand('&divide;'),buttonSound.play()">&divide;</button>
        <button class="number" onclick="printCurrentOperand('7'),buttonSound.play()">7</button>
        <button class="number" onclick="printCurrentOperand('8'),buttonSound.play()">8</button>
        <button class="number" onclick="printCurrentOperand('9'),buttonSound.play()">9</button>
        <button class="operation" onclick="updateCurrentOperand('&times;'),buttonSound.play()">&times;</button>
        <button class="number" onclick="printCurrentOperand('4'),buttonSound.play()">4</button>
        <button class="number" onclick="printCurrentOperand('5'),buttonSound.play()">5</button>
        <button class="number" onclick="printCurrentOperand('6'),buttonSound.play()">6</button>
        <button class="operation" onclick="updateCurrentOperand('+'),buttonSound.play()">+</button>
        <button class="number" onclick="printCurrentOperand('1'),buttonSound.play()">1</button>
        <button class="number" onclick="printCurrentOperand('2'),buttonSound.play()">2</button>
        <button class="number" onclick="printCurrentOperand('3'),buttonSound.play()">3</button>
        <button class="operation" onclick="updateCurrentOperand('-'),buttonSound.play()">-</button>
        <button class="number" onclick="printCurrentOperand('.'),buttonSound.play()">.</button>
        <button class="number" onclick="printCurrentOperand('0'),buttonSound.play()">0</button>
        <button class="span-two" onclick="equal(),buttonSound.play()">=</button>

    </div>
    <script src="skript.js" defer></script>
</body>
</html>