How to debug HTML file in Lightning Web Components?

I am new to Lightning Web Components. I created a LWC that will search for accounts and display the account name. Initially, I was not able to display data in html file because I was using {acc.name} instead of {acc.Name}. I was not able to debug and check value of this variable as it was in HTML file. In such cases, how can I debug HTML file and check value of variables? Is it even possible?

I tried to use <script> console.log(acc.name) </script> inside HTML file but it gives me the error Forbidden tag found in template: '<script>' tag is not allowed. I cannot use <script> outside of <template> tag as it gives me error Multiple roots found lwc.

HTML

<template>
    <lightning-card title="Account-list" icon-name="standard:account">
        <div class="slds-m-around_medium">
            <lightning-input  label="Find Account" value={searchKeyAcc} onchange={handleChangeAcc} class="slds-m-bottom_small">
            </lightning-input>
            <template for:each={accounts} for:item="acc">                   
                <lightning-layout-item key={acc.id}>
                    <p>{acc.Name}</p></br><!--Error Here-->
                </lightning-layout-item>
            </template>
            <lightning-button label="Find Account" variant="Brand" onclick={findAccounts}></lightning-button>
        </div>
    </lightning-card>
</template>

JavaScript

import { LightningElement, track } from 'lwc';
import getAccList from '@salesforce/apex/AccountController1.getAccountList';


export default class AccountSearch extends LightningElement {
    @track searchKeyAcc;
    @track accounts;
    @track errorAccount;

    handleChangeAcc(event){
        
        this.searchKeyAcc = event.target.value;
    }
    findAccounts(){
        getAccList({
            name:this.searchKeyAcc
        }).then(result=>{
            this.accounts=result;
        })
        .catch(error=>{
            this.errorAccount=error;
        })
    }
}