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

Testimonials grid section

#react#tailwind-css
P
stephmunez 435

@stephmunez

Desktop design screenshot for the Testimonials grid section coding challenge

This is a solution for...

  • HTML
  • CSS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


Hey everyone!

I just completed another challenge. 🤘🏽

Super proud on this one because it is my first solution using React, it's a bit of an over kill but for practice purposes I added a Testimonials component instead of just putting everything to the App component.

I also realized how frontend libraries like React make life easier from development to production, I can't wait to learn and grasp more about React and its magic!

One more thing, I already added an <h1> tag and hid it out of view but the report still says there's an error, if someone can tell me why it will be much appreciated.

Feedback is always welcome. Please let me know of any issues you may find and/or how I can improve my code :)

Happy coding!

Community feedback

Abhik 4,840

@abhik-b

Posted

👋 Hello Stephen , Your solution looks perfect to me 🙌🙌 and Yes react definitely makes life easier !!

Just some of my opinions which can help you :

  • You can create components for each article(testimonial) & rendered all of them inside testimonials component & this way your code would have been more easy to read.
  • For the heading accessibility issue you can read this nice article

Very well done 🥳🥳🥳 & please keep contributing such amazing solutions 🤩

Marked as helpful

1

P
stephmunez 435

@stephmunez

Posted

Hey @abhik-b, appreciate the compliment and its complementary feedback 🙂

  • You're right, that would be better, never thought of it. Btw, it came up to my mind, would you think it's also good to create 1 article and use props instead of hard coding each content but then would need to make a data file for it right? or it would be more complicated with the different layout of the cards?
  • Thank you so much for the nice article, it helped a lot.

Will keep them coming for sure! Have a nice day

1
Abhik 4,840

@abhik-b

Posted

@stephjoseph I think for this challenge you can create different components for each testimonial because each testimonial looks different so hard coding is justified here. I am glad my feedback was helpful to you & you have a nice day too 😃

1
P
stephmunez 435

@stephmunez

Posted

Got it @abhik-b, that makes sense. So basically, let's not make our lives harder here haha

Btw I already created the different components 👍🏽

Thanks again, cheers 🙂

1
Abhik 4,840

@abhik-b

Posted

@stephjoseph Haha 😅 Yes It looks perfect now , cheers 🥳

1

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