Full Stack2025

Green Fragrance Handmade Soap Brand Site

A comprehensive brand platform built with Nuxt.js 3, migrated from PM2 to k3s/ArgoCD GitOps architecture, featuring Drizzle ORM, PostgreSQL, and MinIO storage.

Green Fragrance Handmade Soap Brand Site

Project Overview

Originally a simple image website, Green Fragrance has evolved into a production-grade cloud-native platform. It consists of a Nuxt 3 SSG frontend, a Vue 3 admin panel, and a Node.js Express backend. The entire infrastructure was modernized from a single-node PM2 setup to a k3s cluster managed by ArgoCD (GitOps). Data persistence was migrated from MySQL to PostgreSQL using Drizzle ORM for type-safety, and all media assets are now stored in S3-compatible MinIO. The system also includes comprehensive Prometheus/Grafana monitoring for HTTP metrics and database performance.

Technical Challenges & Solutions

Zero-Downtime Infrastructure Migration

Transitioning from a traditional PM2 process manager on a single VM to a containerized k3s cluster without disrupting the production site.

Solution:
Implemented a GitOps workflow using ArgoCD and specialized K8s Jobs for database migrations. Automated the CI/CD pipeline to build Docker images and update deployment manifests in a separate 'Side Project Ops' repository, enabling predictable, rollable updates.

Storage & Database Modernization

The original MySQL + local disk storage was not scalable and difficult to backup across nodes.

Solution:
Migrated to PostgreSQL for better performance and ACID compliance, utilizing Drizzle ORM for type-safe schema management. Replaced local file uploads with a centralized MinIO S3-compatible service, abstracting storage access behind a service layer.

Observability Implementation

Lack of visibility into backend performance, specifically S3 latency and database query bottlenecks.

Solution:
Integrated 'prom-client' into the Express backend to expose a /metrics endpoint for Prometheus. Created custom dashboards in Grafana to monitor HTTP request volume, error rates, and the duration of S3/DB operations.

Architecture

系統架構圖

Frontend: Nuxt 3 (SSG) + Tailwind CSS. Backend: Node.js (ESM) + Express + Drizzle ORM + PostgreSQL. Storage: MinIO (S3-compatible) via aws-sdk client-s3. Infrastructure: k3s (Kubernetes) + ArgoCD (GitOps) + GitHub Actions CI/CD. Observability: Prometheus (prom-client) + Grafana, custom metrics for request duration and S3 operations. Security: Helmet, Express Rate Limit, and CSRF protection.

Learnings

This project was a masterclass in infrastructure modernization. Migrating a live system from PM2 to Kubernetes taught me how to handle containerization, secret management, and zero-downtime database migrations using ArgoCD Hooks. I also gained deep experience in S3-compatible storage and type-safe database access with Drizzle ORM, moving away from legacy MySQL patterns.

Tech Stack

Client Side

Nuxt 3Tailwind CSSTypeScript

Backend

Node.js (ESM)ExpressDrizzle ORMPostgreSQLMinIO (S3)

Deployment Management

Kubernetes (k3s)ArgoCD (GitOps)GitHub Actions

Monitoring & Observability

PrometheusGrafana