REJUAGE — Korean Skincare Brand Platform
A production brand platform for REJUAGE, a Seoul-based premium skincare company: a tri-lingual (EN/KO/RU) React storefront where every landing-page section is editable by the owner through a custom admin CMS, backed by an Express 5 + MongoDB API and deployed on a self-managed DigitalOcean droplet behind Caddy and Docker Compose. Live at rejuageglobal.com.
The problem
REJUAGE needed a distributor-facing brand site — not an e-commerce checkout — ready in time for the owner to pitch international partners. The requirements were awkward for an off-the-shelf builder: two products with distinct branding, a patented liposome technology to explain visually, clinical-trial reports and press coverage to present as credibility signals, and content in English, Korean and Russian that a non-technical owner had to be able to change herself without a developer in the loop.
The solution
I built a pnpm/TypeScript monorepo with a Vite + React frontend, an Express 5 API, and shared packages for the Mongoose schemas, the Zod contracts and a generated API client (OpenAPI via orval). Every landing section — hero, patented technology, ingredients, clinical trials, press, social proof, contact, footer — is a document in a `SiteContent` collection with per-section Zod validation, driven by 11 dedicated editors in the admin panel, so the owner edits live copy and media in the browser. The API handles JWT admin auth (signup locked after the first admin), product CRUD, a partner-inquiry inbox that records IP and user agent, and a media pipeline that re-encodes uploads with sharp. SEO is generated at runtime: meta, Open Graph and JSON-LD injected per page, plus a sitemap.xml and robots.txt served dynamically from live product and brand data with explicit AI-crawler directives. Production runs as two Docker containers — nginx serving the static bundle and proxying /api and /uploads, and the API container with uploads on a named volume — behind Caddy for automatic Let's Encrypt TLS on a 1 GB DigitalOcean droplet, with MongoDB Atlas as the datastore. The API layer carries 54 vitest cases across auth, products and site-content services and validation. A SECURITY.md documents the secret-provisioning and rotation procedure after credentials were found committed in early history.
Overview
**REJUAGE — Premium Korean Science Beauty** is a client project for a Seoul skincare brand: a distributor-facing brand site where the owner controls the entire page from an admin panel. It is live at https://rejuageglobal.com — a HEAD request returns HTTP/2 200 through Caddy → nginx, `GET /api/healthz` returns `{"status":"ok"}`, and `GET /api/products` serves two real products (Wrinkle Repair Eye Cream, Silk Peptide Intensive Lifting Cream) with three optimized images each, straight out of MongoDB.
The codebase is a pnpm/TypeScript monorepo: `apps/web` (Vite + React + Tailwind + Radix, framer-motion, i18next) and `apps/api` (Express 5, Mongoose, Zod, JWT, multer, sharp, pino), plus shared `packages/` for the DB schemas, the Zod contracts, an OpenAPI-generated React Query client, and the API spec. 243 TypeScript files, 29,136 lines. The API follows a strict controller → service → validation → model split documented in `docs/architecture.md`, and carries 54 vitest cases across auth, products and site-content.
The interesting part is the CMS. Rather than hard-coding the landing page, every section — hero, silk-peptide highlight, press, about, ingredients, patented technology, clinical trials, social proof, contact, footer, brand — is a versioned document in a `SiteContent` collection, validated per-section with Zod at the API boundary and edited through 11 purpose-built React editors in the admin panel. The clinical-trials section renders peer-review-style cards with lab, sample size, metric grid and a linked full report; the press section pulls `og:image` previews from real article URLs. SEO for this client-rendered SPA is generated at runtime (meta, Open Graph, JSON-LD, hreflang) and backed by a `sitemap.xml` and `robots.txt` the API generates from live product and brand data, including explicit GPTBot/OAI-SearchBot directives. The storefront ships in English, Korean and Russian.
Deployment is self-managed rather than PaaS: two Docker containers (nginx serving the static bundle and proxying `/api` and `/uploads`; the API with uploads on a named volume) behind Caddy for automatic Let's Encrypt TLS on a 1 GB Ubuntu 24.04 DigitalOcean droplet, with MongoDB Atlas as the datastore. The repo's nginx config carries production security headers, gzip, and `^~` location precedence so long-lived asset caching never intercepts admin-uploaded media. `SECURITY.md` documents secret provisioning and rotation — written after real database credentials were found in early git history, with the rotation procedure spelled out in full.
Key features
- Custom CMS: 11 section editors let the brand owner rewrite every landing-page section, swap hero slides and upload media without a developer
- Tri-lingual frontend (EN / KO / RU) with parallel i18n locale bundles
- Clinical-trials section rendering peer-review-style cards with lab, sample size, metrics and linked PDF reports
- Press section that scrapes og:image previews from real article URLs and links out to the original outlets
- Partner/distributor inquiry form with an admin inbox that captures IP and user agent
- JWT admin auth with signup disabled after the first admin account
- Media pipeline: multer upload + sharp re-encode to optimized webp, served from a Docker volume
- Runtime SEO — per-page meta, Open Graph, JSON-LD, hreflang plus API-generated sitemap.xml and robots.txt
- Animated SVG diagram explaining the HUPURA-MAC liposome technology
- Light/dark theming across the whole storefront