Skip to content
Submitted about 3 years ago

Interactive Comments Section Using Vue 3

vue
Aaron Romanick•270
@aaron-romanick
A solution to the Interactive comments section challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

This is another project I used Vue 3 with the Composition API on. I didn't implement too many new tricks, but I did make a conscious effort to utilize grid a lot in my CSS.

  • While there is some animation, there could be a few more ("delete", "updated" actions)
  • If I do a similar project, I think it'd be nice to implement a "View more comment"-type link if the comments get too nested (similar to Reddit).

If you have any feedback/comments on areas I could improve, that would be great too!

Code

Please log in to post a comment

Log in

Community feedback

  • Wendy•2,130
    @wendyhamel

    Nice one!

    I like the transitions. smooth, not jarring and helpful for the user to see what's going on. Maybe you can add some subtile transitions on the appearing and disappearing of the modal too.

    I only found small issues. On screens above 770px -> if you edit a comment, the textarea only spans half the width of the card. (it only occupies one grid column)

    And you can hide the resize handle in the bottom right corner of the textarea with resize: none;

    Have fun coding!

    Marked as helpful

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