React, Parcel, and CSS were used to build and design the user form.
In an effort to adhere to the single responsibility principle and ensure maintainability of the application, components and hooks have been placed into separate components.
One security feature I was able to implement was setting a minimum number of characters but other optimizations could include setting a max length as well as pattern restictions.
The "checkFormFields" function should ensure that the values of the input object have all been entered before allowing for the post request to the endpoint. There is currently a bug in this function but essentially, this is the idea.
Aria labels would be an excellent accessibility optimization for the application as well, further assisting with assistive technology.
In an attempt to increase the accessibility of the application, lable elements were used to aid screen readers and user with memory loss. Text was set at a minimum of 16px, and providing color contrast between foreground and background colors.