Skip to content
Submitted 11 months ago

Meet landing page - Tailwind CSS, Next.js

react, tailwind-css, typescript
P
Darrick Fauvel•490
@DarrickFauvel
A solution to the Meet landing page 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?

I'm most proud of the responsive positioning and scaling of the hero image. If I were to do this project differently next time, I would probably try another JS framework.

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

The hero image positioning is tricky. I think I've come up with an okay solution, but there might be a better way.

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

I am open any helpful constructive feedback that will make me a better developer.

Code

Please log in to post a comment

Log in

Community feedback

  • Rastislav Hepner•180
    @raswonders

    Hi @DarrickFauvel,

    Nicely done I like the result overall. Going over your codebase I found it very interesting that you divided components into different responsive views. I never thought about that. Also, I liked how you've extended tailwind config with fluid typography, I will probably steal that.

    I don't have many tips, only that you can prevent button's content from wrapping by using whitespace-nowrap. And that at width 980px, your layout is breaking as it is not edge-to-edge anymore and then again is. This doesn't look all that pleasant. In my opinion thing to remember is not to strain the design too much with fixed widths. Let it breath even if it means going beyond its original proportions.

    Hope my note will help you in some way.

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