Design comparison
Solution retrospective
The thing that I'm most proud of in this project is the customization that I added to the project. I believe that customizing each and every one of these projects with your own ideas is a true challenge in itself, that really helps push the project to the next level. These challenges take time and skill as it is, but to be able to really make it your own, implement your ideas, and see the finished product come to life, is where the fun is at for me!
What challenges did you encounter, and how did you overcome them?The biggest challenge I had in the project was getting the JS feature to work. I'm fairly new to JS at this stage still so doing a lot of googling, youtubing, and trial and error to get the cart function working was a big obstacle at first for me, but also very fun learning experience and overly satisfying to see completed and working.
What specific areas of your project would you like help with?Full on code review. Let me know what can be cleaned up, better organized, and just all around any detailed suggestions you can possibly leave me with to help make me a better programmer. As always, thanks for looking and taking the time, it's truly appreciated :)
Community feedback
- @Manisha3196Posted 23 days ago
I think your code looks clean and readable.kudos to you for customizing your own ideas. Suggestions that i can give as iam still new to this are
- picture tag for product-image in HTML. <picture> <source srcset="./images/image-product-desktop.jpg" media="(min-width: 800px)" /> <img src="./images/image-product-mobile.jpg" alt="perfume-image" /> </picture>
So that it selects image according to width.
-maybe try to use grid maybe.I think it is more efficient.
I would also like to know how did you get to know the that precise image/margin width and height in rem like .212rem.Is that all trial and error or else is there any other way you did it.
Marked as helpful1@bmeinert8Posted 23 days ago@Manisha3196 thanks for the suggestion and feedback , I appreciate it. For the measurements, I have a paid figma subscription so I’m able to get px measurements on figma design files. Not all things have measurements, but figma does have a tool where you can go and get custom measurements of spacings, gaps, ect. For example in this design file there was no padding, gap, margin, measurements in the design so I had to take those measurements myself. From there I throw those measurements into a px to rem converter and then implement them where I believe they should be properly added such as a gap, margin, or padding in my css.
0@Manisha3196Posted 23 days agoThank you for the reply.It was really helpful to me.@bmeinert8
0
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