Reset Lightning Input Fields in LWC

<template>
		
	<lightning-card title="Reset Input Field Techdicer" icon-name="standard:recipe">
		<div class="slds-p-around_small">
			<lightning-input type="text" label="First Name" data-id="form" value="Techdicer"></lightning-input>
			<lightning-input type="text" label="Last Name" data-id="form" value="Techdicer"></lightning-input>
			<lightning-input type="email" label="Email" data-id="form" value="techdicerkeeplearning@gmail.com"></lightning-input>
			<lightning-input type="number" label="Amount" data-id="form" formatter="currency" value="200"></lightning-input>
			<lightning-input type="date" name="Date" label="Date" value="2020-09-07" data-id="form"></lightning-input><br/>
			<lightning-input type="checkbox" label="Is Agree ?" data-id="active" checked></lightning-input>
		</div>
			
		<div class="slds-text-align_center">
			<lightning-button label="Reset Fields" onclick={handleReset} variant="brand"></lightning-button>
		</div>
			
	</lightning-card>
		
</template>

import { LightningElement } from "lwc";

export default class LWCFieldResetTechdicer extends LightningElement {
		
  handleReset(){
    this.template.querySelectorAll('lightning-input').forEach(element => {
      if(element.type === 'checkbox' || element.type === 'checkbox-button'){
        element.checked = false;
      }else{
        element.value = null;
      }      
    });
		/* you can also reset one by one by id
			this.template.querySelector('lightning-input[data-id="form"]').value = null; 
		 	this.template.querySelector('lightning-input[data-id="form"]').checked = false; 
		* */	
  }
}