Design comparison
Solution retrospective
I am really happy with how I DRY'ed up some code by making the number input more modular by adding render options. I also tried my hardest to ensure the page was as a11y friendly as possible. Additionally I also added a language select option! This page is available in English, Dutch, French, Spanish and German!
I am also happy with the way I organized my code using a feature based component structure.
What challenges did you encounter, and how did you overcome them?This was my first React project, and as time went on I found that I had to re-organize things, specifically lifting states and variables up so they could be accessed elsewhere. I also could have organsied myself a little better. I started by trying to tackle html, styles and logic together but in hindsight should have planned more then tacked them Logic -> Structure(and a11y) -> styles.
What specific areas of your project would you like help with?I would like to know how I could be utilizing React more efficiently! Also It has been a while since I worked front-end and feel my a11y practices might be a little rusty and could possibly be improved.
Also I have been using jQuery for sometime now and am working on improving my vanilla JS where possible.
Community feedback
- @Anubliss-0Posted 3 months ago
NEW NOTE Check the date on your medium articles folks, CRA is way out of date. Use Vite instead
0 - @Anubliss-0Posted 3 months ago
So I see that I am getting a warning about ...
<html lang="en">
I'm a little confused because I actually have this as a heading already in my index.html so this warning seems a bit off. However this does actually raise another question! Since I am using i18next-react in my project my current language is accessed via
i18n.language
From within my JSX components this requires importing and accessing the necessary JS, but in index.html an import isn't possible as far as I know...
What could be the solution here? I don't imagine changing index.html into JSX is correct or advisable and I feel things like head and meta should remain in here rather than moving down into app.js for example.
Would love to hear what the community thinks!
Thanks in advance!
0
Please log in to post a comment
Log in with GitHubJoin 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