Architecture
One platform.
Distinct backend responsibilities.
songjaehyun.com is built as a single frontend experience backed by two separate API tracks. The frontend stays consistent, while each backend is designed around a different kind of engineering problem: Java for stateful systems and algorithm execution, and Node.js for product-style APIs, validation, and contract-driven workflows.
Frontend
React + TypeScript interface
The frontend is the unified surface of the platform. It handles navigation, demo views, controls, technical explanations, and data visualization while routing requests to the appropriate backend service behind the scenes.
Java backend
Systems demo engine
The Java service runs real backend logic for interactive systems demos. It is built for stateful execution, per-session isolation, in-memory behavior, and educational transparency through structured method logging.
Node backend
Product API service
The Node.js service supports demos centered on API design. It focuses on request validation, response contracts, filtering, pagination, and OpenAPI-style patterns that reflect practical product engineering.
Visual overview
How the platform is organized
The platform is built as a unified frontend that communicates with two independent backend services. Each service focuses on a different category of engineering problems while remaining accessible through a single user interface.
The React frontend routes demo interactions to two backend services deployed independently on AWS.
Request lifecycle
1. Explore
A visitor opens a demo, reads the context, and interacts with the UI through forms, controls, or preset scenarios.
2. Route
The frontend sends the request to the correct backend based on the type of demo being exercised.
3. Execute
The backend runs the demo logic, applies validation or state changes, and returns structured output for the UI.
4. Explain
The frontend renders the result as data, logs, state snapshots, or technical commentary so the system behavior is visible.
Separation of concerns
Each service is scoped intentionally. The frontend provides one coherent product surface, while the backends stay specialized. That separation keeps the platform easier to reason about, extend, and deploy without blending unrelated responsibilities together.
Why two backend tracks
Not every backend problem wants the same tools. Java is a better fit for demos centered on state, execution flow, and systems behavior. Node.js is a natural fit for product-facing APIs, schema validation, and fast iteration around contracts and endpoints.
Project structure
songjaehyun.com │ ├─ Frontend (Next.js + React + TypeScript) │ ├─ Home │ ├─ About │ ├─ Architecture │ └─ Demos │ ├─ Java demos │ │ ├─ Expiring Key Value Store │ │ └─ Rate Limiter │ └─ Node demos │ ├─ Product Catalog API │ └─ OpenAPI Playground │ ├─ api.songjaehyun.com │ └─ Java backend for systems-oriented demos │ └─ node-api.songjaehyun.com └─ Node backend for product-style API demos
Infrastructure
AWS deployment architecture
The platform is deployed using AWS infrastructure that separates the frontend from the backend services while keeping the system simple and modular. Each API runs in its own containerized service while the frontend is delivered globally through a CDN.
Frontend delivery
S3 + CloudFront
The React frontend is built as a static site and hosted in Amazon S3. CloudFront distributes the site globally through a CDN, providing low latency and clean separation between the user interface and backend services.
Java service
ECS + Fargate
The Java backend runs in Docker containers deployed on Amazon ECS using Fargate. This service powers the systems-oriented demos that require stateful execution and backend processing.
Node API
ECS + Fargate
The Node.js API runs as a separate containerized service on ECS Fargate. It powers the product-style API demos focused on validation, request handling, and OpenAPI-driven workflows.
Networking
Both backend services run behind an AWS Application Load Balancer and are exposed through separate subdomains. This keeps the services isolated while allowing the frontend to route requests to the appropriate API.
songjaehyun.com → React frontend (S3 + CloudFront) api.songjaehyun.com → Java backend (ECS / Fargate) node-api.songjaehyun.com → Node API backend (ECS / Fargate)
