Back to projects

yip yap - Next.js Social Platform
HongYip Cheng / July 20, 2025
Demo: Link
📌 Overview
A nostalgic social platform built with cutting-edge Next.js features, designed to showcase:
✔ Hybrid rendering strategies (SSR, ISR, SSG)
✔ Full-stack TypeScript with end-to-end type safety
✔ Modern auth via NextAuth.js
✔ Edge-ready PostgreSQL with Prisma
Developed as a technical showcase (July 2025) to demonstrate Next.js 15 capabilities.
✨ Key Features
-
Dynamic Friend Connections
- Real-time friend requests using WebSockets
- ISR-revalidated profiles (5-minute cache)
-
Nostalgic UI Patterns
- Customizable profiles (MySpace-style)
- Top 8 friends list with drag ranking
-
Optimized Data Flow
- React Server Components for 80% of UI
- Client-side interactions via Actions
🛠️ Technologies
- Frontend: Next.js 15 (App Router), TypeScript
- Styling: Tailwind CSS + CSS Modules
- Authentication: NextAuth.js (GitHub + Credentials)
- Database: PostgreSQL (Neon) + Prisma
- Rendering: Hybrid SSR/ISR/SSG
- Deployment: Vercel (Edge Network)
⚡ Performance Insights
User Profiles
- Strategy: ISR (5-minute revalidation)
- TTFB: 120ms
- Cache Hit Rate: 92%
Friend Feed
- Strategy: SSR with Streaming
- TTFB: 180ms
- Cache: Not applicable (dynamic)
Static Content
- Strategy: SSG
- TTFB: 40ms
- Cache Hit Rate: 100%