Age calculator app

Great job on completing the Frontend Mentor challenge! Your Age Calculator App shows off your coding skills nicely. Here are a few suggestions to further refine your project:

1. Use Semantic HTML:

   • Replace <div> elements with more semantic tags where applicable. For example, use <section> for distinct sections of content, <header> for the header area, and <footer> for your attribution section. This improves accessibility and SEO.
   • Example: <div class="container"> could be <section class="container">.

2. JavaScript Validation:

   • Implement more robust form validation in JavaScript. Currently, you're checking if the input dates are valid based on whether they are empty or not. Consider adding logic to validate the actual date values entered. For instance, check if the day is within 1-31, the month is within 1-12, and the year is a reasonable number.
   • You might also want to add more user feedback for invalid inputs, such as highlighting the input fields in red or showing a specific error message.

3. CSS Refinements:

   • For improved readability, consider organizing your CSS properties alphabetically or by type (display, positioning, box model, typography, etc.). This makes it easier to find and edit specific properties as your CSS grows.
   • Utilize CSS variables for commonly used values like colors and font sizes. You've started this in the :root selector, which is great. Consistently using these variables throughout your CSS will make theme adjustments much easier in the future.

Helpful Resources:

• Semantic HTML: MDN Web Docs - HTML elements reference
• Form Validation: MDN Web Docs - Client-side form validation
• Organizing CSS: CSS-Tricks - Strategies for Keeping CSS Specificity Low

Keep up the fantastic work, and continue challenging yourself. Each project you build strengthens your skills and portfolio. Happy coding! 🌟👨‍💻

Hello there 👋 @ilkerkarahan.

Good job on completing the challenge !

Your project looks really good!

I have a suggestion about your code that might interest you.

There is an very useful browser extension called Perfect Pixel that allow you compare with the design image and thus see the exact dimensions. I recommend it to you.

I hope this suggestion is useful for future projects.

Other than that, great job!

Happy coding.