1、立项背景和目标
搭建一套功能完善的全栈电商购物车演示系统，完整实现前端商品浏览到后端数据持久存储的全技术流程。项目一方面为有电商开发需求的客户提供可复用、可参考的落地方案，另一方面用作全栈开发能力的展示案例。系统内置商品检索筛选、购物车增删改查、跨会话数据持久保存等电商核心能力。
2、软件功能、核心功能模块介绍
产品浏览模块：内置 12 款演示商品，分为电子、服饰、家居、运动四大品类；支持关键词检索、分类筛选、价格与名称排序；商品卡片展示商品评分、库存数量、可视化图标。
购物车模块：支持商品加入购物车并自动校验库存、调整商品数量、单独删除商品、一键清空购物车，实时计算商品小计与订单总金额；依托会话标识机制，实现购物车数据跨页面、跨访问会话持久保存。
后端 API 服务：采用 RESTful 接口规范，共开发 7 个接口，包含 GET、POST、PATCH、DELETE 多种请求方式；接口覆盖商品列表、商品详情、商品分类、购物车增删改查功能，统一使用 JSON 格式返回数据，规范 HTTP 状态码。
首页展示模块：包含品牌宣传主视觉区域、品类快捷导航入口、高分优质商品推荐、项目技术架构展示板块。
3、业务流程、功能路径描述
用户访问网站首页，浏览品类导航或平台推荐商品，跳转至商品列表页面，可使用搜索、筛选、排序功能查找目标商品；点击商品加入购物车，商品数据绑定当前会话标识存入 SQLite 数据库，页面购物车图标实时更新商品数量；用户打开购物车页面，可修改商品数量、删除商品、查看订单金额汇总，选择继续选购商品或进入结算演示页面。
4.我通过 React 18、Vite 构建项目，搭配 Tailwind CSS 完成页面样式开发，使用 React Router v6 实现页面路由；通过 CartContext 全局管理购物车状态，封装独立接口请求模块统一处理前后端通信；会话标识同时存储在本地存储中，并通过请求头完成前后端传递。
后端采用 Node.js、Express 搭建服务，配置跨域 CORS 中间件；自定义中间件自动生成、识别用户会话标识。