Age Calculator App using BEM methodology

Amazing job on the animation and in vanilla JS too! I did mines in Vue.js and used Moment.JS library to handle the date logic.

For handling errors, I recommend having a global object to hold your error states and update it accordingly:

const errors = {
	'errorsPresent' : 'false',
	'dayError': "",
	'monthError': "",
	'yearError': ""
}

I use an errorsPresent key so I don't have to check the entire object. A sample validation logic can look like this:

// Year
let currentYear =  new  Date().getFullYear();
if (yearInput === "") {
	errors.yearError = "This field is required";
	errors.errorsPresent = true;
} else if (isNaN(Number(yearInput))) {
	errors.yearError = "Must be a valid year";
	errors.errorsPresent = true;
} else if (Number(yearInput) > currentYear) {
	errors.yearError = "Must be in the past";
	errors.errorsPresent = true;
}

So if errors.errorsPresent === true you can update the DOM by inserting css style classes and the error messages from your errors object.

.is-danger--border {
	border: 1px solid hsl(0, 100%, 67%);
}

.is-danger--text {
	color: hsl(0, 100%, 67%);
}

Don't forget to clear your error states and messages if the user updates the date again. Hope this helps :)