Skip to content
Submitted over 3 years ago

react-hook-form, styled components

Michal•665
@mbart13
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Intro component with sign-up form
  • HTML
  • CSS
  • JS
1newbie

Design comparison

SolutionDesign

Solution retrospective

I feel like it would take a lot less time to validate the form in plain vanilla js, but getting to know react-hook-form definitely will be useful in future larger projects

Question: what's the best way to announce validation errors to screen readers? My implementation doesn't work.

Community feedback

  • Grace•31,250
    @grace-snowPosted over 3 years ago

    Very nice work! Works well with my screenreader since you've made those tweaks, good job

    2
  • Michal•665
    @mbart13Posted over 3 years ago

    thanks!

    if someone would like to know how to fix it:

    1. for paragraph with message error we have to add aria-live="polite" and 'id' that will link to input element, in my case 'id' is added dynamicly
    2. for input we need to add aria-describedby=[same id as above]
    0

Please log in to post a comment

Log in with GitHub

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord