Js Vanilla, FlexBox, Semantic Tag

Community feedback

• 

  Shahjahan Sarfraz•270

  @Jahan-ShahPosted over 1 year ago

  Hi 👋. Well done on completing this challenge. To improve your code I've got some feedback

  HTML:

  • Use Semantic elements like <section>, article> instead of using <div>. Use the <main> tag to wrap all the main content in your HTML file to improve the accessibility of your page.

  • You must include one heading 1 (h1). Even though there is no use of the h1 you should create an <h1> element in your HTML file that is inclusively hidden but readable to screen readers. You can copy this style to do that. e.g: <h1 class="sr-only">Age Calculator App</h1>.

  • Use <label> tag above <input> instead if using <div> and <span> for more accessablity. e.g:

  <label for="day">Day</label>
  <input placeholder="DD" type="number" id="day"  />
  

  Feedback on functionality

  • The user is able to enter future dates, which can be solved with a check, by getting the current year from the Date function.
  • The user is able to enter an invalid date like 30th Feb which is invalid. You can look into that too.

  Answer to your question We use external js file just like an external CSS file, so that we can easily manage our code. If only a little bit of javascript is used that you can do that in an HTML file. But it is preferable to use external js file as the code gets bigger and bigger, it get difficult to manage the code.

  I hope this helps you 😄

  Marked as helpful

  0

  ---

  

  Ruan Mesquita•70

  @RuHdPosted over 1 year ago

  @Jahan-Shah Thank You Jahan for the feedback! It's been awhile since I began to code but I never had this kind of experience having my projects receiving feedback. I really appreciate it! :)

  1

  

  Shahjahan Sarfraz•270

  @Jahan-ShahPosted over 1 year ago

  @RuHd I'm glad to help you. Also, the last thing you should do is upload your code properly to the GitHub repository so that it can be reviewed in detail. :)

  0