一直以来都想自己编写一个自己的社区博客,后来在网上找了一下,最后决定参考慕课网的一个社区项目,决定改用vue2.6+AntdForVue+koa2+mongoose实现一套社区博客。
这是一个基于VUE全家桶+AntdForVue+koa2+mongo实现的一套社区交流源码,前端页面是响应式的,适合想往全栈发展,ko2学习,mongoDB学习的同学,废话不多说。
http://82.157.55.15:4999/web/#/7/50
https://juejin.cn/post/7079638553386287134
- vue2.6全家桶+antdforvue+dayjs+websocket
- koa2+mongoose+redis+websocket+nodemailer
- 登录
- 注册
- 邮箱找回密码
- 个人中心
- 签到模块
- 文章周热议
- 增删改查文章
- 增删改查评论
- 评论点赞
- 采纳最佳评论
- websocket实时消息-断线重连机制
├── assets
├── components # 公共组件
├── Custom # 自定义组件
├── Home # 首页公用组件
├── Link.vue,Sign.vue ... # 签到 友情链接等公用模块
├── api # 各模块请求的API
├── config # 项目的参数配置
├── plugins # antd按需引入
├── router # 路由
├── store # vuex
├── utils # 工具类
├── const # 各模块的变量
└── views
├── Center # 个人中心模块
└── Post # 文章模块
├── Home # 首页
├── Login # 登录
├── ReSetPassWord # 重置密码
├── User # 个人主页
├── api # 各模块Controller层-接口逻辑
├── config # 项目的参数配置
├── index # 基础配置
├── MailerConfig # 邮件服务配置
├── MongoDB # mongoDB数据库配置
├── RedisConfig # Redis配置
├── WebSocket # WebSocket配置
├── model # 各模块mongo的Schema表
├── router # 路由-各模块接口的入口
- 先把前后端两个项目源码clone到本地
- 然后安装好mongoDB和redis(这里我用的是redis6.2.6版本的,mongoDB是5.0.5)
- 在在后端项目里有个DateBse文件夹里面有7个数据库文件,自己去根据文件名创建7个数据库集合
- 打开后端项目用
npm i
安装依赖 - 打开后端项目的config文件夹下的
index.js
根据自己数据库和redis情况设置好对应的参数
- 使用
npm run serve
启动服务,至此后端项目就完成启动了 - 接下来打开前端项目同样使用
npm i
安装依赖 - 然后打开config目录下的
index.js
文件进行各参数配置
- 最后使用
npm run serve
启动项目就好了
isMock为true时则开启整个项目走mock请求 想要置顶某个接口走mock也可以
本项目适合向往全栈发展的同学,比较适合入门,觉得项目对你有用的话可以github上给他Star
星星
注:UI布局以及部分逻辑是参考慕课网某个社区项目的进行重构的