Simon
@Simplify4Me2All comments
- @1of1bawSubmitted about 1 month ago@Simplify4Me2Posted about 1 month ago
Hi @1of1baw,
First off, congrats on completing the challenge! 🎉 A lot of great things going on here, using clean and well-organized code.
I noticed a tiny typo in your HTML file. On line 8, the
ype
attribute should betype
. That's likely why it's duplicated.Instead of using
input type="text"
, you could switch them totype="number"
. It gives a more intuitive experience for users by showing the numeric keypad on mobile.Good that you're using
new Date(year, month, 0).getDate()
to validate days! But a small remark: you're checking validity of the day even before confirming if the month and year are valid.I hope this wasn't too nittpicky 😅 Happy coding ⚡⚡
Marked as helpful1 - @dev-paulLSubmitted about 2 months agoWhat specific areas of your project would you like help with?
Any feedback is welcome 👍
@Simplify4Me2Posted about 2 months agoHi @dev-paulL,
Great solution! A smooth setup using Tailwind, Vite and React ⚡
Just a tiny detail, but I noticed you're using
after:content-['»']
and its equivalent for quotes. Maybe try using“
and”
. Those polished touches can really make a difference!Loving the Tailwind variables, but a little remark —Tailwind’s docs recommend defining them in your
main.css
orindex.css
file (you can check it out here: Tailwind Customizing Colors). Also, instead of using dark, consider naming with shades (e.g., gray-700), as it might offer more flexibility for future changes.And while I'm being nitpicky, I noticed an empty
alt
attribute on an image - giving it a meaningful value will help with accessibility, plus it's good for SEO!Overall, great job! Keep up the awesome work and happy coding 🍵🍵
1 - @jjdavenportSubmitted 3 months agoWhat are you most proud of, and what would you do differently next time?
First form validation using react.
What challenges did you encounter, and how did you overcome them?The difference between vanilla js and react for validation.
What specific areas of your project would you like help with?Any feedback is appreciated.
@Simplify4Me2Posted 3 months agoHello @jjdavenport,
Congratz on completing the challenge! It looks good 👍
I noticed that the current workflow isn't mobile-first, which might be why the mobile design lacks margins and has larger font sizes. Shifting to a mobile-first approach could help optimize the layout for smaller screens. You could also consider the PerfectPixel browser extension to ensure your design matches the mockups more precisely.
You've definitely paid good attention to semantic HTML. The
header
tag is currently in themain
tag, though. Typically, theheader
should be a sibling ofmain
rather than a child to maintain proper semantic structure. Also, theul
element used for social media icons could be more appropriate as anav
element, indicating these icons are a form of navigation.In React, your approach of having components depend directly on
assets/data.json
might reduce flexibility. Passing this data through as props could enhance the reusability of your components. The validation logic you've implemented looks like a great candidate for a custom hook. This could keep your components clean and focused.Keep up the great work and happy coding ⚡⚡
Marked as helpful1