Responsive age calculator app with input validation

Hello fellow Frontend devs!

It's been a while since my last challenge. So here is my latest work. Built with vanilla CSS, JavaScript and Vite.

For this particular project, the main obstacle I did encountered is creating the input validation. I didn't really had the idea on how to validate both the input along with checking whether the date entered by user is valid to be calculated. So what did I wrote for the validations?

Well firstly the application will check whether the user has entered all the required fields. If they failed to do so, it will show a required field error message.

if (inputValue.length === 0) { errorText.innerHTML = "This field is required"; }

Next is the date validation. On the date validation, I wrote a function that return the error status of each of the date input as an object.

function dateIsValid(..params){
let isError = {
dayHasError: false,
monthHasError: false,
yearHasError: false,
};

// validating...

return { isError }
}

So on the main application file, I can just called the returned value like this: const { isError } = dateIsValid(..params);

To access the value of each date input: isError.dayHasError | isError.monthHasError | isError.yearHasError

Check out the project repository here for the full code.

Feedbacks are welcome :D