JavaScript Hesap makinesi uygulaması nasıl daha kolay yazılır?

<div class="container">
 <div class="row">
 <input type="text" id="textbox" class="p-3 fs-4 ">
 </div>
 <div class="row">
 <button class="col num">1</button>
 <button class="col num">2</button>
 <button class="col num">3</button>
 <button class="col fs-2 num">+</button>
 </div>
 <div class="row">
 <button class="col num">4</button>
 <button class="col num">5</button>
 <button class="col num">6</button>
 <button class="col fs-2 num">-</button>
 </div>
 <div class="row">
 <button class="col num">7</button>
 <button class="col num">8</button>
 <button class="col num">9</button>
 <button class="col fs-2 num">*</button>
 </div>
 <div class="row">
 <button class="col fs-2" id="sonuc"> =</button>
 <button class="col num">0</button>
 <button class="col" id="del">C</button>
 <button class="col num">/</button>
 </div>

</div>

 body{
 background-color:#FFC26F;
 color: black;
 margin: 50px 100px 0 100px;
 }button{
 margin: 0;
 background-color: white;
 padding: 20px 20px 20px 20px;
 }button:hover{
 background-color: whitesmoke;
 }.container{
 width: 350px;
 }

let sonuc = document.getElementById("sonuc")
let textbox = document.getElementById("textbox")
let del = document.getElementById("del")
sonuc.addEventListener("click" , () =>{
 try{

 equal = eval(textbox.value)
 textbox.value = parseFloat(equal.toFixed(2))
 }catch(error){
 textbox.value = ""
 document.getElementById("textbox").placeholder = "ERROR"
 setTimeout(()=>{
 document.getElementById("textbox").placeholder = ""
 },2000)
 }
})

del.addEventListener("click" , () =>{
 textbox.value = ""
})

let nums = document.querySelectorAll(".num")
console.log(nums)

nums.forEach(button => {
 button.addEventListener("click" , ()=>{
 textbox.value += button.innerHTML
 })

});