Summary
- A display-only digital retail platform for the footwear brand PZP, consisting of a WeChat Mini Program and an official website.
- Navigated strict Chinese internet regulations by setting up self-hosted MinIO storage, securing ICP filings, and using a CDN to meet WeChat’s mandatory HTTPS requirements.
- Developed mini-program, a native mobile storefront powered by serverless Tencent CloudBase, featuring a custom pricing and promotional engine for complex product variants.
- Developed official website, initially deployed to pass public security checks, this modern, SEO-friendly site (Next.js 16/React 19) serves as the brand’s primary showcase.
- Developed an admin tool, an Electron-based desktop app (PZP MiniApp Manager) built for staff to easily manage cloud inventory, handle image uploads, and process bulk Excel imports.
The PZP Ecosystem is a unified digital retail and brand platform for PZP Hubei, a Chinese footwear brand. The project consists of two distinct but complementary interfaces: a comprehensive WeChat Mini Program serving as the storefront, and a highly optimized Next.js official website acting as the brand’s digital face. Currently, both platforms serve as immersive, display-only catalogs without active transaction processing.
The most complex hurdle of this project wasn’t just the codeโit was establishing a legal, cloud-connected data pipeline in China using a self-hosted local server with a public IP.
WeChat Mini Programs strictly require HTTPS and domain-based routing, outright rejecting direct HTTP/IP connections. To bridge the local storage to the WeChat ecosystem, I had to architect a compliance-driven infrastructure pipeline:
- Object Storage Service: Since they already have a Windows Server 2008 with static public IPv4 address, I configured a dedicated MinIO server (a 2023 version to make it run on that machine) to act as the S3-compatible object storage for all product media. This would save the cost for saving hundreds of gigabytes of products images in cloud OSS.
- Domain & ICP Filing: Purchased a domain via Tencent Cloud, which required navigating the Chinese ICP (Internet Content Provider) filing process.
- Server Acquisition: To qualify for the ICP filing, I rented a Tencent Cloud server to act as the legal anchor for the domain.
- Traffic Routing & IP Masking: Implemented a CDN layer to route traffic securely back to the original local server, effectively masking its public IP while fulfilling WeChat’s HTTPS requirements.
- Public Security Network Filing & “Cover” Site: The local authorities required a content inspection to finalize the network filing. To pass this compliance check and legitimize the domain, I rapidly developed and deployed the PZP Official Website as a premium “cover” platform to display the brand’s content safely and legally.
The WeChat Mini Program (Mobile Storefront)
The WeChat Mini Program serves as the mobile storefront, delivering a native consumer shopping experience directly within WeChat’s ecosystem.
The application utilizes a serverless architecture where Tencent CloudBase exclusively handles the database and cloud functions for operations like WeChat OpenID authentication, secure phone binding, and paginated product searches.
Product images are efficiently served via a CDN IP that caches them directly from the original local server. To handle complex product states, I engineered a custom promotional and pricing engine supporting SPU/SKU variants, multi-tier discounts, and cart grouping.
PZP Official Website
The PZP Official Website acts as the brand showcase and was initially deployed as a compliance-driven “cover” site to pass the Public Security check before evolving into a fast, SEO-friendly digital storefront.
Built on a modern stack using Next.js 16 and React 19, the platform leverages async server components to fetch data directly from CloudBase. The interface features an accessible, responsive component library crafted with Tailwind CSS and Radix UI following the shadcn pattern, which powers interactive elements like an offset auto-scroll carousel and gender-split routing.
For media delivery, I implemented a custom, transparent URL normalization layer that converts standard cloud paths into HTTPS URLs to stream product imagery seamlessly from a MinIO/S3-compatible CDN, complete with robust fallback handling for CJK characters in file paths.
PZP MiniApp Manager (Internal Administration Tool)
To support the storefronts, I designed and built the PZP MiniApp Manager as a solo developer, which is a custom Electron desktop application powered by React 19 and Vite.
Serving as the central administrative hub, this internal business tool allows shop staff to manage product listings, categories, and promotional carousels, with all changes syncing in real time to the Tencent CloudBase backend.
I also developed image management, which directly calls MinIO APIs, to allow staff to upload/remove images for products and carousels. The app streamlines daily operations through features like a bulk Excel import tool that auto-maps headers and converts currency values, as well as a color-size stock matrix for granular inventory control without requiring direct database manipulation.