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

Meet landing page using Next.js

Nafsukiβ€’ 245

@Nafsuki

Desktop design screenshot for the Meet landing page coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


This is my first Next.js project on Frontend Mentor. I used CSS modules and created a custom 404 page as a practice.

My Questions:

-My Screenshot somehow doesn't show #2 svg, although my vercel preview site has no problem showing it. How can I optimise that?

-I've got accessibility issues & html issues regarding <img />. I'm using <Image /> component, so it automatically generates loading='lazy' attribute. Do I have to avoid this attribute to be generated?

Any feedback & suggestion for improvement would be very much appreciated β˜ΊοΈπŸ™!!

Community feedback

Mark Catesβ€’ 110

@mscates

Posted

Hi Nafsuki, I liked your solution. I did see a scroll bar on mobile though. you could add overflow-x: hidden to solve this issue.

0
Fernando FeNβ€’ 425

@Fernando0654

Posted

I usually have lots of issued with attributes and html when I use React, so I don't think it's to different with Next.js. Maybe there's someway to fix this, but honestly I haven't achieved that using React

Good luck, though. I know this isn't helpful haha :c

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