Kullanıcı kayıt ve giriş formu nasıl yapıcam acil website

const form = document.getElementById("form")
const username = document.getElementById("userName")
const email = document.getElementById("eMail")
const password = document.getElementById("password")
const password2 = document.getElementById("password2")

//show errorr

function showError(input , msg ){
    const formControl = input.parentElement
    formControl.className = "form-control error";

    const small = formControl.querySelector("small") //tag name , id , class *// 

small.innerText =  msg
}

//show success

function showSuccess(input){


    const formControl = input.parentElement
    formControl.className = "form-control success"

}
//check required fields


function checkRequired(inputArray) {
    inputArray.forEach(input => {
    if(input.value.trim() === ""){
showError(input, `${input.id} Gereklidir!`)
 }else{


    showSuccess(input)
 }
})
}

//check input lenghts


function checkLenghts(input, min, max){
  if(input.value.length < min){
showError(input, `${input.id} En az karakter ${min} olmalı!`)
  }else if(input.value.length > max){

    showError(input, `${input.id} En fazla ${max} karakter olmalı!`)
  }
}
//check email

function checkEmail(input) {


    const re = /^(([^<>()[\]\\.,;:\[email protected]"]+(\.[^<>()[\]\\.,;:\[email protected]"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;

    if(re.test(input.value.trim())){

showSuccess(input)
}else{



    showError(input,"Email doğru değil!")
}

}
//matching password
function isPasswordMatch(p1 , p2){


    if(p1.value != p2.value){



showError(p2, "Şifreler Eşleşmiyor!")




}
}

//add event listener


form.addEventListener("submit" , function(e){

e.preventDefault()

checkRequired([username , email , password , password2])

checkLenghts(username, 2 , 15)
checkLenghts(password, 6, 20)

checkEmail(email)


isPasswordmatch(password , password2)
})