Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

QR Code Component

@rivers07-maker

Desktop design screenshot for the QR code component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


What are you most proud of, and what would you do differently next time?

This is the second time I do the QR Code Component Challenge and I've notice I done it quicker and better at this attempt.

What challenges did you encounter, and how did you overcome them?

Never used Figma as design files and I'm wondering how we can take advantages from the measurements and translate that into code. Because for me I just used the hexadecimal number for colors, nothing else. My code was based purely from a visual approach.

What specific areas of your project would you like help with?

The challenge suggested us to use Pre-Processors as Sass, Less, etc... My question would be if is better to use Tailwind CSS and what opinions do people have about that ??

Community feedback

@Brian-Pob

Posted

Hi there Andre! Great job on your solution!

To answer your question about pre-processors vs Tailwind and which is better, the only correct answer is "it depends."

First, if you are learning CSS, I would personally recommend starting out with plain CSS and familiarizing yourself with the properties and features that you will regularly use.

Once you feel comfortable with plain CSS, you can look into pre-processors and what they offer. The biggest advantages of pre-processors (IMO) include being able to write CSS faster and programmatically by making use of things like loops and lists.

For Tailwind, it's more like an alternative way to writing CSS. It's slightly more detached from regular CSS compared to using pre-processors, but using it will still give you a better understanding of CSS properties compared to using a component library or framework like Bootstrap or Material UI.

Either way, pre-processors and Tailwind (and even component libraries) are useful tools when used in the right situation. There is nothing wrong with either decision and you will end up learning useful skills and gaining more knowledge no matter what you choose.

I hope this helps!

Marked as helpful

1

@rivers07-maker

Posted

Hi there Brian!

Thank you for taking the time to write and clarify my doubts.

Following your suggestions I'll continue practicing plain CSS and then look into pre-processors.

My only request would be if you can hand me some step by step resources, approach or tecniques to have a learning process and improve my skills in both plain CSS / pre-processors. Because you know that when tackling the Frontend Mentor Challenges one need to have previous knowledge in order to successfully go through them.

Thanks again and hoping for some help in this regard!

0

Please log in to post a comment

Log in with GitHub
Discord logo

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