NFT Card Component

Community feedback

• 

  Loris PUECH•180

  @ShiironPosted 11 months ago

  Hi !

  First of all, congratulations on completing this challenge ! i hope it was fun and will make you do even more challenges in the futur !

  Classes vs Ids vs Selectors I don't think there is a definitive answer to that but as far as i'm concerned, i tend to avoid ids as much as i can because we use Frontend framework to make reusable component. If you keep that idea in mind, we won't have a lot of elements with ids, since we don't want any duplicate

  I think the way you handled it is pretty clean with the use of classes and selector. This avoid having nightmare nesting (especially in scss) and allow you to target multiple elements easily. My general rule is to add a class when i need to specifically target an element, otherwise i use selector as much as possible. It's also important to keep in mind that in frontend framework, with the use of components, using selector can cause conflict because css loaded with 1 component can cause effect on another component if you only target selectors

  Good practice I would give just 2 advices from what i saw, since you used native HTML / CSS :

  • You have an assets folder but you still have svg markup in your html => I think it's better to keep assets separated from the code, therefore i would make .svg file with all the svg you have in the html (for example, the eye icon you have on hover => make an eye.svg file and paste code there). It makes a cleaner and easier code to read
  • Create multiple files => The reset part in your css is good but i would separate it from the style.css file and create a reset.css file. This will be useful if you want to try futur framework where you want as little code as possible so everything has 1 single purpose. But you use comments to separate your css files which is already very good ! (don't be afraid to use even bigger comment block)

  I hope my feedback will be useful to you ! i'm not the best devs around but if i can help, i try my best !

  Have a great day and keep up the good work !

  Marked as helpful

  1

  ---

  

  legaldrummer•30

  @fullspeccoderPosted 11 months ago

  Hello @Shiiron!

  Thank you so much for the response! I'll keep in mind separating my reset.css in a different file. I had some trouble getting the code to run on Github Pages without taking the actual code for the files out of the src folder, but I will keep in mind the critique on the svg files!

  I agree with you on the frontend frameworks with keeping ids out seeing as component-based markup is increasingly becoming more popular. I actually work in React, the only reason I used vanilla everything here was to make sure I had understanding of vanilla javascript along with the fact that it's a simple component :D

  Thank you so much again for the feedback, and I will be sure to continue this journey!

  0