Responsive QR Code Component using Flexbox and rem units

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

I'm proud that I completed my first Frontend Mentor challenge and got more comfortable working with HTML and CSS. Even though the challenge provided some starting assets, I was able to build the layout on my own, apply styling using Flexbox, and make the design look clean and centered.

It also helped me understand how using rem units and responsive sizing like min() can make layouts more adaptable.

What I'd do differently next time

Next time, I would:

• Focus more on responsiveness, especially on very small or large screens.
• Separate my CSS into an external file to keep the HTML cleaner.
• Try using media queries for better scaling.
• Explore different layout techniques like CSS Grid.

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

One of the main challenges I faced was aligning the text properly inside the QR card. It took me some time to understand how to center the text and space everything out nicely.

I didn’t encounter any major technical bugs, but getting the layout to look right still required some patience. I used trial and error to tweak the CSS until things looked balanced and aligned.

I also learned how to use Google Fonts and how to create a basic Markdown file (README.md) for the first time, which are both important skills when working on real-world web projects.