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

Responsive Landing page, Vite + React + Tailwind CSS

Raza Abbasโ€ข 790

@RazaAbbas62

Desktop design screenshot for the Manage landing page coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
3intermediate
View challenge

Design comparison


SolutionDesign

Solution retrospective


Any feedback or criticism is welcome. :)

Community feedback

Petrit Nurediniโ€ข 2,860

@petritnuredini

Posted

Congratulations on completing your React project! It's impressive to see your dedication and progress. Here are a few suggestions to enhance your project further:

  1. Responsive Design:

    • Ensure that your application is fully responsive. While your use of TailwindCSS is commendable, make sure to test your application on various screen sizes. You might want to use media queries more effectively to handle different screen sizes. For best practices on responsive design, check out Responsive Web Design Basics.
  2. Code Consistency and Organization:

    • Consistent naming conventions and organizing your code can significantly improve readability and maintainability. Ensure that your class names and component structures follow a consistent pattern. Hereโ€™s a useful guide: Airbnb JavaScript Style Guide.
  3. Accessibility:

    • Accessibility is an essential aspect of modern web development. Ensure that all interactive elements are keyboard accessible and that images have descriptive alt text. For more on this topic, explore Web Accessibility Guidelines.
  4. State Management and Prop Drilling:

    • As your application grows, consider using Context API or Redux for state management to avoid prop drilling. This makes your app more scalable and components more reusable. Learn more about state management in React: State and Lifecycle.

Keep up the fantastic work! Every project you build adds to your skillset and brings new learning opportunities. Stay curious and keep coding! ๐Ÿ’ป๐ŸŒŸ

Marked as helpful

1
Souhailโ€ข 510

@SouhailM07

Posted

Hello developer, It's not a good idea to add styles to the scrollbar because doing so may compromise accessibility and performance on your website.

Marked as helpful

1
Theunisโ€ข 210

@theYuun

Posted

Very cool! I especially like that you pushed the reviewer boxes to fit properly into the screen, as opposed to the reference image cutting them off.

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