一款专为个人或多人用餐场景设计的轻量化智能点餐决策工具。项目基于 Vue.js + Uni-app 构建跨平台前端,后端采用 PHP + Laravel 框架提供简洁高效的API服务,实现数据实时同步与本地存储。系统旨在解决“两人就餐时选择困难、口味偏好难协调、点菜效率低下”的日常痛点,核心功能包括:双人协同点餐(实时同步菜品选择、分别勾选偏好)、智能菜品推荐(根据历史订单生成口味兼容方案)、决策辅助工具(“随便”模式随机选择、菜品对比投票)、个性化菜单管理(收藏常点菜品、忌口标签标注)及账单便捷结算(AA制/请客模式快速拆分)。通过聚焦双人场景的深度优化,让点餐过程变得轻松有趣,成为两人用餐的默契小助手。
1. 整体架构与技术栈设计
本项目采用前后端分离架构,基于Vue.js + Uni-app构建多端应用,PHP提供高性能API服务,满足多平台快速迭代需求。
前端技术栈:
框架:Vue.js 2.x + Uni-app 3.x(多端统一开发)
状态管理:Vuex
UI框架:uView UI 2.x(跨平台组件库)
构建工具:Webpack 5 + 自定义构建配置
代码规范:ESLint + Prettier + Husky Git钩子
后端技术栈:
语言:PHP 8.1(强类型模式)
框架:Laravel 9.x(遵循MVC架构)
API开发:RESTful API设计规范
身份认证:JWT(JSON Web Token)
接口文档:Swagger/OpenAPI 3.0
队列处理:Redis + Laravel Queue(异步任务)
文件存储:CDN加速
2. 个人负责模块与量化成果
作为全栈开发工程师,我负责了整个项目的架构设计和核心功能实现:
前端核心模块:
多端兼容架构
基于Uni-app的条件编译,实现一套代码多端发布
性能优化方案
图片懒加载 + WebP格式自动转换
路由懒加载 + 组件异步加载
关键渲染路径优化
状态管理设计
基于Vuex的模块化状态管理
3. 技术难点与解决方案
难点一:Uni-app多端兼容性问题
问题:不同平台(微信小程序、H5)的CSS渲染差异和API支持度不同
解决方案:
创建平台适配层,统一API调用接口
使用SCSS混合器和变量管理平台差异样式
条件编译处理平台特定逻辑