Design a photo gallery with upload

medium

Complete guide with examples and interview questions · 40 min

Definition

Say it out loud in an interview — clear, simple, no textbook wording.

If someone asks me to design a photo gallery with upload, I would say it is a fast grid over small thumbnails plus an upload pipeline that survives real networks. The grid is the visible part. The pipeline is the hard part.

Interviewers care because upload is where frontend optimism meets reality. Files are large, connections drop, and users watch progress bars. A design that uploads in one request, reports bytes sent as progress, and drops failed files silently fails all three tests at once.

The senior nuance is state honesty. Every file is always in exactly one visible state, progress counts only server-acknowledged work, and the gallery never shows a photo the server has not confirmed. That discipline is what makes the feature feel reliable.

Quick Stats
40
Minutes
medium
Difficulty
5
Interview Q's

Key takeaways

  • A gallery is two problems: a grid that renders fast, and an upload pipeline that survives real networks
  • Large uploads must be chunked and resumable, or one dropped connection restarts the whole file
  • Progress must count server-acknowledged bytes, not bytes sent: bytes sent is a promise, not a result
  • Thumbnails are separate small images, never the full file squeezed by CSS
  • Upload state is per file and explicit: queued, uploading, processing, ready, failed

Track your mastery

Sign in to save Q&A scores, coding challenge progress, points, and streaks across devices.

Sign in to save progress