Hey guys!
I'm back with another front-end project. This time, I decided to finally implement Redux in my project and I found it to be an incredibly fun and insightful experience. It was a bit more difficult in the beginning since I was learning on the go, but after I grasped the concepts, it became clear what I had to do.
What would've you done differently in this project?
Let me know your thoughts - much appreciated! :)
this is also one of the greatest applications for this challenge. your design is very good and you could cover most of both the design and functionality needed. using react and redux in such a design is also a good practice. the only typo I could find is actually in displaying the lightbox and as It doesn't cover the whole page with a dark bg. I think you need to check about it. also, the buttons for changing the slide backward and forward are missing. but other than that I think the website is working fine.
I would be a liar if I didn't say that this is one of the best designs I have seen so far for this challenge. actually, all the functions are working at their best what makes me feel like you have the taste of a backend dev more than a frontend one. although you could make the style similar to the original to great extent, I find that you didn't give much attention to the animation and transitions and ideas like that which may make the design more alive from being just a good shape. I am talking about that point because a dev in your level is pretty sure able to draw any animation he likes if he wants. that's why I recommend u that the only thing you need here is more interactivity. even if it is not asked for but consider it a skill of making a piece of art. if you saw my design u will find that I give great interest to such things but am not as good as you in functionality but I hope to be ...thanks for such a great design.
I am sure you learned a lot from this design as I did too. Your design is good according to practicing the skills of CSS grid and flexbox. You have also used sass and that is skillful. The problems in styling that you have are simple to handle. Just like u need to use the font family that you are given in the style guide. and change all the body font-family to that font. you also need to hide the orange badge on the cart icon when there are no orders. the badge can be easily made actually by using bootstrap. only a few customizations to the border-radius will be needed. also, the border radius of some elements like pics and buttons should be more like 10 or 14px I guess but not sure. it should be more than that anyway. other than that, that's a powerful launch for a great dev.
I need some tips on how I can improve my code, and on making my design responsive.
as a frontend, and as I tried your GitHub launch but it didn't open. I will say that mostly I can catch that: 1- some elements tend to rely on the bootstrap's original sizes rather than being customized to fit the real size of the taken screenshot of the original design. like for the above container, I think it must take 1050px max-width. Then you might even find everything else inside it getting closer to the design. I also found that you are not interested in the hover effects and some of the extra-like styling. like the box-shadows made around the card or the "add to cart button". However, reading your code on GitHub, I know you are a true dev. I don't even think that currently I am on your level. I hope to reach your's one day :)
Hi everyone.
This is my second attempt at this challenge.
When I did this project for the first time I was struggling positioning the main image, so I decided to build this page mobile-first. It was not too complicated than the first time.
I would love to hear any feedback about my second attempt.
Happy Coding :D.
I think you did a great job doing this challenge. It's not an easy one, especially since the first part of the mockup with the background is the trickiest. However, I think you have done everything identical except that you need the desktop hero section background to get down to cover the whole section or resize the height of the section a little. The font of the nav links on the desktop version is apparently bigger than the design. I actually had the same problem but right now I am solving it. The last thing I would mention is that your classes names are expressive but long which I find painful for you to edit them in CSS or the styling sheet. Other than that you made a great work on my point of view.
