Skip to content
Submitted about 1 year ago

QR Code Component - Next.js

next, react, tailwind-css
David Ochoa•270
@davidochoadev
A solution to the QR code component challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

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

my primary goal is to gain more experience with Next.js. So far, I'm proud to say that everything has been going smoothly without any major obstacles. I could definitely have paid more attention to best practices and syntax.

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

I haven't encountered any technical difficulties.

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

I would love some advice on structure, SEO, and especially accessibility. I know I rushed through the task. It's basically all new to me and I don't really know what the right thing to do is. I'm relying on you for any technical advice 🙏🏻

Code
Couldn’t fetch repository

Please log in to post a comment

Log in

Community feedback

  • Florian Frosch•120
    @ffrosch

    Great job! Here are a few small things I noticed that might also be interesting for you.

    design:

    • layout breaks on viewports widths below 362px; although probalby nobody uses a screen this small, it might indicate some general problems with your layout settings and it could be a problem in cases where user with a small screen have a huge standard font size.
    • font used is "Inter" although "Outfit" is loaded in layout.tsx

    accessibility:

    • footer uses "div" instead of "footer"
    • footer should be the last element in your html structure, but it comes before the qr-code component -> bad for keyboard navigation, screenreaders, etc.

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