Responsive ecommerce product page Next.js / TypeScript / SASS/SCSS
Design comparison
Solution retrospective
What did you find difficult while building the project? Figuring out how TypeScript worked with React props was challenging at first. But after a few times it started making sense.
Which areas of your code are you unsure of? I'm unsure about the way I used SASS/SCSS. It feels as if there would be a more efficient way of using it. I might have nested way too much beyond need.
Do you have any questions about best practices? Regarding what I said above, I would like to know if there's a better way to use SASS/SCSS without over nesting code.
Community feedback
- @visualdennissPosted over 1 year ago
Hey there,
cool work! I have some small suggestion regarding your code. It looks like you are repeating a bit when rendering Thumbnail components, you can alternatively render them like so in only one number:
-
[1,2,3,4].map((number)=> <Thumbnail num={number} handleThumbnailClick={handleThumbnailClick} isSelected={isSelected} currentImg={currentImg} setIsSelected={setIsSelected} />)
-
[1,2,3,4] could be some data stored in a variable, and this way, not only your code gets shorter, but you don't have to hardcode a new component if the data changes, as it will automatically and dynamically rendered this way.
Hope you find this feedback helpful!
Marked as helpful1 -
Please log in to post a comment
Log in with GitHub
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