React + Styled Components + Debounce search

Solution retrospective
This project is currently the best I made and the most proud of. I really loved coding this dictionary.
What challenges did you encounter, and how did you overcome them?Astonishment, a challenges I encountered was to set an error on the input when this one is empty. I used an realtime api call with a debounce and you don't need to press enter or click to submit your word. So I can't use the onSubmit function to prevent an empty input. Instead, I choose to made a verification into the handleChange function.
What specific areas of your project would you like help with?I used the handleChange function to check if the input is empty or not, this is the function :
function handleChange() {
if (!event.target.value) {
setInputError('Whoops, can’t be empty…');
} else {
setInputError('');
}
setWord(event.target.value);
}
I think there is a better way to do this. Actually, the network request will be made, even if the input is empty.
Please log in to post a comment
Log in with GitHubCommunity feedback
- @haquanq
Hello @AurelienWebnation,
Nice work on the solution!
I think it is unnecessary to show input error (empty error) when the request will eventually be sent. Maybe considers adding an empty component with descriptive text to encourage users to use the search when the input is empty is more appropriate.
Have a nice day and happy coding!!!
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