惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

雷峰网
雷峰网
博客园 - 聂微东
酷 壳 – CoolShell
酷 壳 – CoolShell
宝玉的分享
宝玉的分享
奇客Solidot–传递最新科技情报
奇客Solidot–传递最新科技情报
罗磊的独立博客
Hugging Face - Blog
Hugging Face - Blog
T
Tailwind CSS Blog
OSCHINA 社区最新新闻
OSCHINA 社区最新新闻
IT之家
IT之家
博客园_首页
博客园 - 三生石上(FineUI控件)
博客园 - 叶小钗
Apple Machine Learning Research
Apple Machine Learning Research
freeCodeCamp Programming Tutorials: Python, JavaScript, Git & More
量子位
钛媒体:引领未来商业与生活新知
钛媒体:引领未来商业与生活新知
人人都是产品经理
人人都是产品经理
美团技术团队
小众软件
小众软件
Jina AI
Jina AI
S
SegmentFault 最新的问题
博客园 - Franky
让小产品的独立变现更简单 - ezindie.com
让小产品的独立变现更简单 - ezindie.com

DEV Community

Authentication Security Deep Dive: From Brute Force to Salted Hashing (With Java Examples) Why AI Systems Don’t Fail — They Drift Spilling beans for how i learn for exam😁"Reinforcement Learning Cheat Sheet" I Replaced Chrome with Safari for AI Browser Automation. Here's What Broke (and What Finally Worked) How Python Borrows Other People's Work The $40 Architecture: Processing 1 Billion API Requests with 99.99% Uptime Vibe Coding: A Workflow Guide (From Zero to SaaS) Most webhook security guides protect the wrong side. The scary part is delivery. Headless CMS for TanStack Start: Build a Blog with Cosmic EU Age Verification App "Hacked in 2 Minutes" — What Actually Happened Comfy Cloud’s delete function does not actually remove files Running AI Models on GPU Cloud Servers: A Beginner Guide Event-driven media intelligence with AWS Step Functions and Bedrock I scored 500 AI prompts across 8 quality dimensions — here's what broke How to Call Google Gemini API from Next.js (Free Tier, No Backend Needed) The Portal Protocol: Reclaiming Human Connection in the Age of AI How to Fix Your Team's Scattered Knowledge Problem With a Self-Hosted Forum Intro to tc Cloud Functors: A Graph-First Mental Model for the Modern Cloud Designing Multi-Tenant Backends With Both Ownership and Team Access I Built a Neumorphic CSS Library with 77+ Components — Here's What I Learned PostgreSQL Performance Optimization: Why Connection Pooling Is Critical at Scale Cómo construí un SaaS multi-rubro para gestionar expensas en Argentina con FastAPI + Vue 3 🚀 I Built an Ethical Hacking Scanner Tool – Open Source Project I Replaced /usage and /context in Claude Code With a Single Statusline A Pythonic Way to Handle Emails (IMAP/SMTP) with Auto-Discovery and AI-Ready Design I Collected 8.9 Million Polymarket Price Points — Here's What I Found About How Markets Really Move EcoTrack AI — Carbon Footprint Tracker & Dashboard Everyone's Using AI. No One Agrees How. 5 self-hosted ebook managers worth trying in 2026 Building Your First AI Agent with LangChain: From Chatbot to Autonomous Assistant
Inside AMPER B2C: how we built an e-commerce platform on ...
Adrian Synow · 2026-05-15 · via DEV Community

Repository: github.com/AMPLIFIER-sp-z-o-o/amper-b2c
Product page: ampliapps.com/amper-b2c

What is interesting about AMPER B2C is not a single storefront screen. It is the way the storefront, admin panel, catalog, inventory, checkout, orders, and media are tied together by one data model.

This is a practical walk through the project: what customers see, what administrators can change, and which parts of the code matter when the store is running on data that keeps changing. The article is based on the public repository and the QA environment.

1. The homepage is not hardcoded into a template

The homepage is built from database records: hero banners, product sections, banner groups, HTML blocks, storefront categories, and sliders. That means a campaign or section order can be changed from the admin panel without touching templates.

The repository also includes draft preview logic. Admin forms can save draft changes into the session, and the storefront can render those changes before they are published. It is a small detail, but it makes day-to-day content work much less fragile.

The same idea appears in dynamic pages. The DynamicPage model stores the slug, CKEditor content, basic SEO settings, visibility, noindex, and sitemap exclusion. In practice, informational pages can be linked from the navigation or footer without adding a separate view for each page.

AMPER B2C desktop homepage

Screen: homepage with navigation, categories, campaign banners, and product sections.

AMPER B2C admin homepage sections

Screen: homepage sections in the admin panel, with ordering and active status.

AMPER B2C admin banners

Screen: banner configuration, images, and campaign settings.

2. The catalog is data-driven

A product in AMPER B2C is not just a name, price, and image. It has a category, status, images, price, stock, warehouses, and attributes. Attributes are modeled as separate definitions and options, so they can be reused in filters, product cards, and category pages.

AMPER B2C desktop catalog

Screen: catalog view with product cards, prices, attributes, cart actions, and shopping lists.

AMPER B2C desktop category page

Screen: category page narrowed to a specific catalog context.

AMPER B2C desktop search results

Screen: search with filtering, sorting, and pagination.

AMPER B2C admin product list

Screen: product list in the admin panel, with statuses, prices, images, stock, sales, and revenue.

One useful implementation detail is prefetching product images and tile attributes. It is not a flashy screenshot feature, but with a larger catalog it keeps product listing views away from the classic N+1 query problem.

3. The product page uses the same model

The product page renders catalog data: image, description, price, availability, category breadcrumb, and attributes. Product status distinguishes values such as active, hidden, and disabled, so a product can be hidden or left visible without allowing purchase.

AMPER B2C desktop product page

Screen: product page with image, description, price, quantity, cart action, shopping list, and attributes.

4. Cart and checkout refresh data before purchase

The cart stores order lines, quantities, prices, discounts, coupons, delivery method, payment method, and totals. Before checkout, the data is synchronized with the current database state again. If someone changes a price or coupon rule in the admin panel, the customer sees the updated order before submitting it.

AMPER B2C desktop cart

Screen: cart with quantity control, promo code, shopping lists, and recalculated total.

AMPER B2C desktop checkout

Screen: checkout with server-side data storage and expiry time.

AMPER B2C admin coupons

Screen: coupon configuration with discount type, active state, date range, usage limits, and minimum cart value.

AMPER B2C admin delivery methods

Screen: delivery methods configured from the admin panel.

AMPER B2C admin product stock

Screen: product stock maintained separately per warehouse.

The most important part happens during order placement. Products and stock records are locked with select_for_update(), stock is checked again, quantities are decreased in the warehouse, the coupon is verified one more time, and only then is the order created.

5. Orders keep their own history

An order stores a copy of the customer details, delivery address, delivery method, payment details, product value, discount, delivery cost, currency, and final total. Order lines keep their own unit price and line total, so history does not change when the catalog is edited later.

AMPER B2C admin orders

Screen: orders panel with durable business records.

Stock allocation between warehouses is modeled separately as well. An order line can store which warehouse supplied the product. That is a good starting point for later ERP or WMS integrations.

6. Favorites are closer to shopping lists

In this project, favorites do not stop at a simple heart icon on a product card. A user can have multiple lists, anonymous users are tracked by session key, items remember the price from the moment they were added, and a list can be shared through a non-guessable identifier.

AMPER B2C desktop favorites

Screen: shopping list view in the storefront.

The login moment is interesting. Default anonymous lists can merge into the account without duplicates, while custom anonymous lists are moved to the user with automatic conflict handling for names.

7. Media can run locally or through S3

Product images, category images, banners, and media library records use DynamicMediaStorage. The same storage model can run locally or through S3 with an optional CDN, so different environments can use different media setups.

AMPER B2C admin media library

Screen: media library in the admin panel, with file metadata and source references.

What stands out in the code

The parts of the repository worth looking at are the ones that usually matter only when a real store is being used: stock locking during order placement, coupon revalidation, cart total refreshes, server-side checkout data, order data copies, merging anonymous shopping lists into user accounts, and media storage that can run locally or through S3/CDN.

These are not the most visually impressive parts of the interface, but they decide whether the store behaves predictably when data changes in the admin panel while a customer is already in the middle of a purchase.

Explore the project

Code: https://github.com/AMPLIFIER-sp-z-o-o/amper-b2c

Product page: https://ampliapps.com/amper-b2c/

QA environment: https://amper-b2c.ampliapps.com/

QA login: admin@example.com / admin