Devlog #2: Edit, Delete and Likes

This week I kept working on the social network I'm building as my final project for The Odin Project. In the first devlog I showed the base: sign up, feed, profiles, posts and user search.

This time I added three things: editing posts, deleting them, and a proper like system, so you can like and unlike both your own posts and other people's.

Note

If the player doesn't load, you can watch it directly on YouTube.

What's new

  • Editing a post: every one of your posts has an edit option.
  • Deleting a post: right next to edit, with a confirmation before anything is deleted.
  • Likes: on your own posts and on anyone else's, from their profile.
  • Unliking: click again to take the like back.
  • One like per user: the count updates instantly and there are no duplicate likes.
  • Comments. That's next.

Editing a post

Each of your posts now has an edit option. It opens a form that's already filled in with the post's current content, so you don't have to type it again: change what you need, hit save, and the post updates instantly.

Deleting a post

Right next to edit there's delete. It asks for confirmation first, because deleting a post is final: once you confirm, the post is gone for good.

Likes

Likes now work properly. You can like your own posts or anyone else's from their profile, and clicking again unlikes. The count updates instantly, and each user can like a post only once: no duplicate likes.

Stack

Same as in the first devlog:

LayerTechnologies
FrontendReact, React Router, React Query, CSS Modules
BackendExpress, PostgreSQL (hosted on Neon)

What's next

In the next devlog I'll be working on comments: letting users comment on posts, and edit or delete their comments if they need to.


Follow the project

This project was made with React and Tailwind.

© 2023 Pablo Pérez. All rights reserved.