Products › Mask Shopping

MASK.SHOPPING

마스크쇼핑

Real-time mask inventory search built in response to the COVID-19 crisis.

Service period: Feb 2020 – Present

Visit mask.shopping

Overview

Mask Shopping was built and launched in February 2020, at the height of South Korea's mask shortage crisis during the early days of the COVID-19 pandemic. As confirmed cases surged and masks became nearly impossible to find, consumers were left scrambling across pharmacies, convenience stores, and online shopping malls with no reliable way to check availability.

Mask Shopping solved this problem by aggregating real-time mask stock information from online retailers and presenting it in a single, easy-to-scan interface. The platform prioritized masks with available inventory at the top of the list, displayed pricing and last-updated timestamps down to the second, and linked directly to purchase pages. A built-in live chat allowed thousands of users to share real-time tips on where masks had just been restocked.

At its peak, the platform attracted over 2,700 concurrent users sharing information in the community chat, and became one of several developer-driven civic tech responses that helped Korean citizens navigate the crisis before the government's public mask distribution system was fully operational.

마스크쇼핑은 코로나19 초기(2020년 2월), 전국적인 마스크 품귀로 “지금 어디서 살 수 있는지”를 확인하기 어려웠던 상황에서 빠르게 만들어진 실시간 재고 탐색 서비스입니다.

여러 온라인 판매처의 재고 정보를 한 화면에 모아 보여주고, 재고가 있는 상품을 우선 노출하며, 가격과 갱신 시점을 초 단위로 표시했습니다. 각 항목은 판매 페이지로 바로 연결되어 탐색 시간을 줄였습니다.

또한 커뮤니티 채팅을 통해 수천 명의 사용자가 재입고 정보를 실시간으로 공유할 수 있었고, 서비스가 가장 활발하던 시기에는 동시 접속자가 2,700명 이상에 달했습니다.

Mask Shopping UI — real-time inventory list and community chat

Real-time inventory list (left) and community chat (right) — second-level updates, direct links, and live restock tips.

What made it work

  • In-stock-first UI (재고 우선 정렬)
    In-stock items were surfaced at the top and updated every second, so you could instantly tell what you could actually buy right now.
  • Direct link-out (바로 구매)
    Each listing linked directly to the retailer's purchase page, cutting out the steps between “found it” and “bought it.”
  • High-concurrency chat (대규모 실시간 채팅)
    Supported thousands of simultaneous users while keeping message history, live user counts, and link previews all working — tuned for information sharing under load.
  • Moderation & anti-abuse (관리/스팸 방어)
    Rate limiting, URL allow/block policies, and moderation tools (mute/kick/ban) kept the chat usable even at peak concurrency.

Features

  • Real-time Inventory Aggregation (실시간 재고 수집)
    Continuously monitored online shopping malls for mask availability and surfaced in-stock items at the top of the list with second-level update timestamps.
  • Price Comparison (가격 비교)
    Displayed mask prices across retailers so users could quickly identify the most affordable options during a period of rampant price gouging.
  • Direct Purchase Links (바로 구매)
    Each listing linked directly to the retailer's product page, minimizing the time between finding a mask and completing a purchase.
  • Live Community Chat (실시간 채팅)
    A real-time chat where thousands of users shared restock alerts, links, and purchase tips. Includes message history, user count updates, and moderation tooling (mute / kick / ban).
  • Link Previews & Safe Sharing (링크 미리보기/안전 공유)
    When a single URL is posted, the system can fetch OpenGraph metadata and broadcast a preview update, while enforcing domain policy to reduce abuse.

Tech Stack

Mask Shopping was built for rapid deployment and operational resilience under sudden traffic spikes. The codebase evolved over time (Socket.IO era → API Gateway WebSocket + Serverless), but the core goals stayed the same: low-latency updates, safe community chat, and fast link-outs.

Next.js React Tailwind CSS Auth.js / NextAuth Kakao OAuth Prisma MySQL (RDS) AWS API Gateway WebSocket AWS Lambda (Serverless) OpenGraph Crawler Rate Limiting

Architecture (at a glance)

  • Web (Next.js)
    Inventory UI + chat client. Authentication is handled via OAuth (Kakao) and a session/JWT flow for upgrading chat permissions.
  • Real-time (WebSocket)
    WebSocket routes handle connect / disconnect / default messages, broadcast user count updates, store message history, and apply moderation (mute/kick/ban) plus user block lists.
  • Link intelligence (OpenGraph + 정책)
    When a message contains a single URL, it’s evaluated against a domain policy (allow/block/skip), optionally normalized, crawled for OpenGraph, and then broadcast as a preview update.

Press