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

FAQ Accordion using ReactJS & TailwindCSS

@IamArshadAli

Desktop design screenshot for the FAQ accordion coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


πŸ™‹β€β™‚οΈ Hello, Everyone,

Here is my solution for the FAQ Accordion.

  • Scored 89% on Google Pagespeed Insights! 🀩
  • Built with ReactJS | Designed with TailwindCSS πŸ› οΈ | Mobile-First approach πŸ“±
  • Implemented <details> & <summary> to create accordion without using JS #️⃣
  • Utilized prettier-plugin-tailwindcss to auto-sort TailwindCSS classes 🎨
  • Utilized BEM principles to create a consistent structure of TailwindCSS classes
  • Minified the CSS files to improve site performance πŸš€

Do you have any insights to share❔

I'll be happy to hear them. πŸ€“

Code Together | Learn Together | Grow Together

Community feedback

takinabradleyβ€’ 100

@takinabradley

Posted

Looks good!

I might challenge you to extract this into a separate component, and to feed it question/answer data to render in React!

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