Frontend Mentor - QR code component solution

This is a solution to the QR code component challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.

Table of contents

• Overview
  • Screenshot
  • Links
• My process
  • Built with
  • What I learned
  • Useful resources

Overview

Screenshot

Links

• Solution URL: Frontend Mentor
• Live Site URL: GitHub Pages

My process

Built with

• Semantic HTML5 markup
• CSS custom properties
• CSS Grid
• Vanilla JavaScript
• Web Components

What I learned

In this challenge, I get the chance to learn how to leverage Web Components, enabling the creation of reusable custom HTML elements for enhanced modularity. This experience has enriched my understanding of front-end development and its potential for efficient, maintainable code.

<qr-code
  data-img="images/image-qr-code.png"
  data-title="Improve your front-end skills by building projects"
  data-description="Scan the QR code to visit Frontend Mentor and take your coding skills
  to the next level"
/>

Useful resources

• Using custom elements - Tutorial about Using custom elements.