构建渐进式网购商城应从最小可运行模块起步：先实现商品展示、加购、结算，再逐步增强；采用纯HTML+原生JS，模块化组织代码，封装数据层与路由，渐进增强交互。
构建渐进式网购商城应用，核心不是一步到位做完整系统，而是从最小可运行模块出发，按需叠加能力：先让商品能展示、能加购、能结算，再逐步增强体验与健壮性。
从静态商品列表起步，用模块化方式组织代码
不要一上来就搭框架或引入状态管理。用纯 HTML + 原生 JavaScript 启动：一个 index.html，加载 products.js（负责渲染商品卡片）和 cart.js（维护本地购物车数组）。每个模块只做一件事，导出清晰的函数，比如 renderProductList(items) 和 addToCart(item)。这样后续替换为 Vue 组件或 React Hook 时，接口不变，迁移成本低。
用 localStorage 模拟持久化，但封装成可替换的数据层
初期购物车数据存在 localStorage 即可，但别直接在业务逻辑里写 localStorage.setItem。建一个 storage.js，提供 saveCart() 和 loadCart()，内部用 localStorage；将来对接后端时，只需重写这个文件，返回 Promise 并调用 API，上层代码完全不用改。
在 Java 中初始化和管理阿里云 SDK客户端。包括单例模式、线程安全、endpoint 与 region 配置、VPC 终端节点、同步与异步等。
路由与视图分离，支持 URL 驱动页面切换
用原生 history.pushState + popstate 实现简易路由。定义路径如 /（首页）、/product/:id（详情页）、/cart（购物车），每个路径对应一个渲染函数。把路由逻辑抽成 router.js，后续换成 React Router 或 Vue Router，也只是替换这一层，页面组件仍可复用。
立即学习“Java免费学习笔记（深入）”；
渐进增强交互：从表单提交到局部更新，再到状态同步
第一步：加购用传统表单提交，页面刷新；第二步：用 fetch 提交，成功后只更新购物车徽标和数量；第三步：引入轻量状态对象（如 store = { cart: [], products: [] }），所有 UI 绑定到 store 变更，用 Object.assign 或 Proxy 触发重绘。不强求 Redux，但保留未来接入的扩展点。
