Single Price Grid Component solution

Community feedback

• 

  Damjan•220

  @iDamjanPosted about 1 year ago

  Hi Oryan,

  You will find out in a short time that actually hardest coding challenges are related not to actually coding but coming up with names :D Starting from naming function to CSS classes.

  The thing that helped me the most was following a standard or lets say architecture, and thats the BEM standard, which stands for Block-element-modifier. With this standard you will not have to think much as the standard it self will think for you.

  You can read the docs here : https://getbem.com/introduction/ BUT basicly how it goes its you have a block in the HTML lets say <form> and some children inside <button> or <input>, the main class of the block will dictate the main name and the children or elements will be the name after the block ex. Form---button, Form--input or Form--contactButton and then the M in the BEM standard which stands for modifier will be for example if you have some modified state ex. Form--contactButton-disabled, Form--input-error.

  There you go, CSS naming solved :P I hope this helped.

  I will also suggest for you to try SCSS, which is just another way to write CSS. It changed my life and i would never come back to write normal CSS. :))

  Marked as helpful

  1

  ---

  

  Oryan Hachamoff•120

  @oryanhachPosted about 1 year ago

  @iDamjan Thanks a lot! I have used SCSS a little bit in the past, I need a refresher on that for sure! Also I have added BEM tutorials to my list now. Thanks again, appreciate that!

  0
• 

  Guli•70

  @GulshanoyIbragimovaPosted about 1 year ago

  Hello Oryan!

  I also had hard time naming classes then this article from freeCodeCamp came very handy.

  You can have a look 👍🏻

  1

  ---

  

  Oryan Hachamoff•120

  @oryanhachPosted about 1 year ago

  @guli10 Thanks for the response, could you please provide me with a link to the article?

  0

  

  Oryan Hachamoff•120

  @oryanhachPosted about 1 year ago

  @guli10 did a little searching, I think you maybe was referring to this link:

  https://www.freecodecamp.org/news/css-naming-conventions-that-will-save-you-hours-of-debugging-35cea737d849/

  seems pretty good and will for sure help me a lot! Thanks!

  0

  

  Guli•70

  @GulshanoyIbragimovaPosted about 1 year ago

  @oryanhach

  You are welcome!

  0