I am proud to have finished this project and will consider using more variables in the future to make my code cleaner.
What specific areas of your project would you like help with?It's my first time creating a quiz app and I am not really sure if my HTML structure and script are correct. I am hoping anyone can give me a feedback about my solution and point out any potential issues or areas for improvement.
Great Solution, made it simple, made it cool!
All feedbacks are appreciated. Please feel free to share your opinions. I enjoy learning from others.
Wow! nothing i can add! Well done! i love your code structure!
Great Job! here are some advices for make your code more simple without redundancy.
Reduce Repetitive Selections
Instead of selecting each tip button individually, you can use querySelectorAll to grab all tip buttons at once and loop through them when needed.
The same applies to error elements.
Encapsulate Error Clearing
You can Create a clearErrors() function to remove all error messages and input outlines.
Simplify Value Parsing
Used Number(value) || 0 to handle empty inputs gracefully, reducing the need for conditional checks.
Reuse Logic with forEach
When validating inputs, instead of handling them separately, you can loop through the values and their corresponding elements to apply errors dynamically.
great job!
Look like it is a very smart solution, maybe even this was a small project i would do a better folder structure. Good job mate!
I used the scripting media query to serve CSS declarations applying only when JavaScript is enabled.
No specific challenges.
What specific areas of your project would you like help with?No particular help requested.
Semantic HTML Good use of <article>, <section>, <h5>, and <p>. Consider using <figure> for the image and <address> for the journalist's name to improve semantics. Accessibility Improve alt text (e.g., "A beautifully crafted set of wooden drawers"). Add aria-label to the share button (e.g., aria-label="Share this article"). Ensure good color contrast and check for keyboard navigation on all elements. Responsive Design Ensure the layout adapts well on all screen sizes. Test the visibility of share buttons for both mobile and desktop. Check for text and button resizing on small and large screens. Code Structure The structure is clear, but class names could be more concise and reusable. Ensure JavaScript focuses on manipulating classes instead of inline styles for separation of concerns. Design Consistency Make sure spacing, typography, and layout are consistent across devices. Overall, your solution is strong! Focus on improving accessibility and refining responsiveness.
