Frontend Mentor | FAQ accordion card coding challenge solution

Solution retrospective

Hi dear community 👋

Image position and smooth toggling was the tricky part of this challenge. Finally, I've solved this challenge by using useRef, useState, and useEffect to achieve smooth animation on the toggling description section. I planned to not use any animation library for this simple toggling

Any tips will be appreciated

🙏 💝

Community feedback

Suleman• 750

@legion40216

Posted over 1 year ago

Bro excellent your coding is simple and elegant. Your Frontend skills are awesome, I love to look at your Html and Css coding... But wasnt React an overkill for this project XD

Marked as helpful

Mehdi• 990

@siavhnz

Posted over 1 year ago

@legion40216

Thanks for the motivating comment, I appreciate that

I agree with you, there are a lot of solutions out there like bootstrap for accordion that we can just grab their links and do our challenges in less than an hour or even vanilla javascript does the job in this challenge better than React, but It's all about practicing and familiarizing with all aspect of React. I don't like even using pre-created React components because I want to practice, I want to see how I can do a task with React. For me every component; or even every line of code is important I must do it in the not best but acceptable way :)

Your comment made me happy, Thanks 🙏 💝

FAQ accordion card

Design comparison

Solution retrospective

Community feedback

Please log in to post a comment

Join our Discord community