BUILDSENIOR

Build a Social Feed with Reactions

90 minutes

0 completed

nextjsfullstacksocial-mediainfinite-scroll

Description

Build a social media-style feed with posts, reactions, comments, and infinite scroll.

Requirements

Create posts with text and optional image

Infinite scroll feed (newest first, load more on scroll)

Reaction system: like, love, laugh, wow, sad (emoji reactions)

Reaction count display with breakdown on hover

Comment system: add comments on posts, see comment count

User avatars and display names

Relative timestamps ("2 hours ago", "yesterday")

Optimistic UI updates for reactions

Use Next.js API routes with database. Infinite scroll using IntersectionObserver. Optimistic updates: show reaction immediately, revert on error.

Image upload to cloud storage

Real-time updates (new posts appear without refresh)

Share/repost functionality

You will be guided through MCP setup before the timer starts