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

Fullstack (NextJS + ExpressJS + SocketIO + MongoDB + Cloudinary)

#express#mongodb#react#styled-components#next
Eray• 1,410

@ErayBarslan

Desktop design screenshot for the Interactive comments section coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
3intermediate
View challenge

Design comparison


SolutionDesign

Solution retrospective


Greetings FEM community 🤘 This is my Fullstack solution to the comments section challenge.

Features

  • Authentication: Register, login, logout (passwords encrypted)
  • Send, edit, delete comments.
  • Upvote and downvote comments.
  • Infinite nested replies. (Reddit like)
  • Hide & show replies.
  • Live update comments with SocketIO
  • Edit username, password, bio, avatar.
  • Display profile cards by clicking on usernames.
  • Users who's not logged in can only view comments & user infos.

Built With

  • NextJS (Frontend)
  • ExpressJS (Backend API)
  • SocketIO (listen to comments live)
  • MongoDB (user & comment documents)
  • Cloudinary (store images)
  • StyledComponents (CSS in JS)

Deployment

It took me longer than I initially planned but I'm happy with the result :) If you find any bugs or have suggestions & questions feel free to shoot.

Community feedback

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