约学 - 可以寻找一起自习的小伙伴的 web App
一个基于 vue & Node 的移动端全栈小项目
在线演示(请使用移动端查看效果) http://yuexue.tk:3001/
源码地址: https://github.com/G-lory/yuexue https://github.com/G-lory/yuexue
部分页面截图(不许吐槽我首页的背景图片!
技术栈
前端: Vue2 vue-router Webpack axios Sass MintUI Iconfont
后端: Node.JS(v8.11.1) Koa2 SQLite node-cache log4js
启动项目
我将前后端项目到同一个 GitHub repo 了
- # 克隆项目
- Git clone https://github.com/G-lory/yuexue.git
- # 启动后端项目
- # 到后端项目
- cd yuexue-server
- # 安装依赖
可以通过 NPM install --registry=https://registry.npm.taobao.org 重新指定 registry 来解决 NPM 安装速度慢的问题
- NPM install
- # 运行后端项目 打开浏览器访问 http://localhost:3001
- NPM run start
- # 启动前端项目
- # 到前端目录
- cd yuexue-frontend
- # 安装依赖
- NPM install
- # 热加载启动 打开浏览器访问 http://localhost:8080 (保证后端项目已启动
- NPM run dev
- # 生产环境压缩打包
- NPM run build
实现功能
邮箱注册
邮箱密码登录
查看个人信息
修改个人信息
上传头像
退出登录
密码找回
首页信息展示
未读消息提示
发布邀约
删除已发布邀约
查看邀约
根据城市信息和关键字搜索邀约
接受邀约
密码加密存储
打印日志且保存到文件
未实现 & bug
邀约列表页在某些浏览器中 列表不能完全加载
后端代码未加单元测试
项目结构
前端
后端
其他
写项目之前是不会 Node.JS 的, 因为有 Java 基础, 所以目录结构在参考他人的基础上, 就着 Java 的 MVC 结构写的.
单元测试实在不会 (想) 写了.
开始数据库使用的是 MySQL, 但是由于我的服务器内存太小了装不上, 改成了 SQLite...(全部写完又修改的......QAQ)
同样的是问题是保存验证码之前还想着用一下 Redis(可以假装很厉害)后来使用了 node-cache
遇到了很多很多问题, 包括但不限于
移动端滑动穿透的问题
仿移动端页面切换效果, 这两个问题可见(https://www.cnblogs.com/wenruo/p/9948348.html)
SQLite 数据库操作问题 (后来发现是引用文件时要使用绝对路径)
某些设备 #加 8 位十六进制数字表示透明色不生效 改成 rgba 修复
开始使用 HTML 自带表单, 通过 Ajax 提交, 提交表单会导致刷新页面, 使的用 iframe 修复, 后面全部删除了表单
列表无限加载有些时候不生效(未修复, 因为好像大部分都没问题
跨域问题, 包括 cookie 跨域问题
来源: https://www.cnblogs.com/wenruo/p/10064998.html