Web Application

[Signature Project]

1. Introduction

I designed and developed brawding.co.kr, a fully responsive, real-time multimedia bulletin board web application that combines a CMS (Content Management System) with real-time communication features. The platform is built to scale for high-volume multimedia posts and interactive user sessions.

I built using Next.js, PHP, and MySQL, designed to support large-scale user interactions across a variety of media types.

This project showcases my ability to integrate frontend UX/UI with backend scalability and real-time communication — delivering a full-stack solution with real-world impact.

Key Features (Highlights)
  • Dynamic Posting System (Rich Media Article System)

    Users can publish rich-text articles with:

    • title
    • full content using a rich-text editor
    • thumbnail
    • media attachments (images, videos, etc.)
    • tags (up to 4 simultaneously searchable)
    • optional metadata (save count, report count, view count)
  • Dynamic Post Browsing (Advanced Browsing Experience)
    • Real-time filtering customizable columns (toggle visibility for media, date, author, etc.)
    • Multi-tag search (up to 4 simultaneously searchable)
    • Adjustable pagination (posts per page)
    • Search the most recent post results
  • Interaction & Analytics (Interactive & Analytics Features)
    • View count
    • Save to favorites (favorite/save count)
    • Report flagging (report count)
  • OAuth Authentication (Secure OAuth Login)
    • Supports login via KakaoTalk and Naver accounts (integrated with KakaoTalk and Naver for seamless and trusted authentication).
  • WebRTC-Powered Video Chat Rooms
    • Mic and camera controls
    • TURN server support for reliable peer connections
    • Works smoothly across desktop and mobile browsers
  • File Upload System
    • Multi-file selection with real-time validation
Tech Stack
  • Frontend: Next.js
  • Backend: PHP
  • Database: MySQL
  • WebRTC Infrastructure: TURN server for media relay and NAT traversal.

2. Techs

  • Language / Script

  • Framework

  • Library

  • API

  • Database

  • IDE

  • VCS

  • Compiler / Transpiler / Bundler / Build Tool

  • Linter / Formatter

  • Package Manager / Dependency Manager

  • Test

  • Deployment / Process Management / Containerization

  • Etc.

3. Screenshots

© 2025 hansf14. All Rights Reserved.