Keep content manageable without code changes
Products, categories, reviews, delivery areas, sales channels, and site settings are managed through the admin workspace.
← Back to projects
Case Study · Real Business / E-commerce
FR Flower E-commerce Platform
A production-ready e-commerce platform built for a real flower business, covering the customer storefront and a protected back-office for day-to-day operations.
My role
Full-stack product development & e-commerce platform
Stack
Next.js · React · TypeScript · Prisma · PostgreSQL · Cloudinary · LINE · GSAP
The problem
The business needed more than a product showcase. Store content, product images, categories, reviews, delivery areas, sales channels, and localized content all needed to be managed without editing code. The admin side also needed controlled access and a release process that would not put production data or media at risk.
What I built
I built a full-stack storefront with a searchable product catalog, collection shortcuts, localized Thai/English content, product galleries, pricing and discount presentation, and LINE ordering. Behind it is a protected admin workspace for catalog and content management, backed by Prisma/PostgreSQL and Cloudinary for media storage.
My contributions
- Built the customer-facing storefront and responsive product browsing experience.
- Implemented product search, category filters, budget filtering, pagination, and product image galleries.
- Built collection shortcuts for common shopping occasions such as anniversaries, graduation, and apology gifts.
- Implemented localized Thai/English product and storefront content.
- Built the protected admin workflow for products, categories, reviews, delivery areas, sales channels, and site settings.
- Implemented role-aware admin access with ADMIN and STAFF roles and signed HttpOnly sessions.
- Integrated Cloudinary for controlled product/review image uploads and gallery management.
- Added validation, automated tests, health checks, backups, migration controls, and deployment safeguards.
Architecture
The storefront and admin workspace run on Next.js. Business data is modeled with Prisma and persisted in PostgreSQL, while product and review media are stored in Cloudinary. Customers browse products and can continue ordering through LINE; administrators manage the content through the protected back-office.
01
Customer / Admin
02
Next.js Application
03
Prisma ORM
04
PostgreSQL
Media → Cloudinary · Ordering → LINE · Admin auth → signed HttpOnly session
Key technical decisions
Separate database state from media storage
PostgreSQL stores application records and Cloudinary handles uploaded media, keeping image delivery independent from database rows.
Use protected admin sessions
Admin access uses signed HttpOnly cookies, server-side session-age checks, and a database-backed session version for invalidation.
Treat releases as an operational workflow
Production releases include CI checks, migration approval, backups, health checks, smoke tests, and rollback/recovery guidance.
Challenges & solutions
A real storefront needs a real back-office
Instead of hard-coding the catalog, I built management workflows so business content can change without a developer editing source files.
Product media is part of the product
Products can have cover and gallery images, so upload limits, Cloudinary metadata, ordering, and cleanup behavior are handled as part of the application flow.
Different staff need different access
The admin model separates ADMIN and STAFF roles and blocks restricted areas based on the authenticated role.
Production data needs recovery paths
The release workflow includes logical backups, Neon recovery coverage, Cloudinary awareness, migration gates, health checks, and tested restore tooling.
Engineering evidence
- Next.js storefront with search, category filtering, budget filtering, pagination, and product galleries.
- Prisma schema covering admin users, roles, products, images, categories, and site settings.
- Cloudinary integration for product and review media with controlled uploads.
- Automated component and library tests across catalog, forms, authentication, media, backups, and settings.
- ADMIN/STAFF authorization with signed HttpOnly sessions and session-version invalidation.
- Production runbook covering CI gates, Prisma migration approval, backups, smoke tests, rollback, and recovery.
Result
The result is a real business platform rather than a static storefront: customers can browse and order, while the business can manage its catalog and content through a protected back-office. The application also has the testing, media controls, backup strategy, health checks, and deployment safeguards expected from a production system.