Vue+Koa+MongoDB从零打造一个任务管理系统的详细过程
大概是在18年的时候，当时还没有疫情。当时工作中同时负责多个项目，有 PC 端运营管理后台的，有移动端 M 站的，有微信小程序的，每天 git 分支切到头昏眼花，每个需求提测需要发送邮件，而且周五要写烦人的周报，我就萌生了做一个任务管理系统的想法。其实不管是日常需求还是处理线上 bug，都可以看作一个个大大小小的任务。这些任务有排期，prd，项目分支，开发测试人员等关键因素，在开发过程中这些都会得到明确，从而根据这些信息推导出提测邮件内容，进而通过排期时间区间汇总出周报。
说干就干，花了两个周末。
基本上就是任务的增删改查。
使用的技术栈如下：
# 前端 less vue2 element-ui # 后端 node koa # 数据库 由于当时对 mongodb 不熟悉，又想快速原型，选择了直接操作 json 文件的方式😄
尽管如此简陋，但我还是比较满意的，由于这时就我自己在用，功能基本够用。此时的关注点主要在 3 个要素
- 任务的排期，汇总周报的依据
- 任务的状态
- 未开始，那些已提上日程但未着手开始的任务
- 开发中，进行中的工作
- 已提测，这种状态的任务的主要工作是修改 bug
- 已完成，发布上线了的任务，无需再继续关注，汇总周报，季报的时候会用到
- 任务的项目分支，在多任务多项目并行时特别有用
我就把它定为 1.0 版本吧
后来，我也开始借鉴市面上的任务管理工具，比如 tower，trello， teambition 等发展成熟的产品。
经过两年的改进和迭代，它已经变成了现在的样子。
支持卡片拖动去改变任务状态
画了一个甘特图去直观的展现任务排期跨度
模仿 github 日历图，排除掉周末节假日，直观体现每天的任务并行情况
此时数据库也已经切换到了 mongodb
我就把这时的系统定为 2.0 版本吧
岁月荏苒，时光如梭。疫情不断反复，前端的技术也已翻天覆地。为了与时俱进，准备把这个项目用最新的技术重写一下。
具体计划如下
# 主要是前端 vue vue cli -> vite vue2 -> vue3
最好的学习方式莫过于边学边练完成一个项目。
我准备接下来围绕这个项目更新一个系列，期间会涉及到下面这颗树的枝干。同时分享一些几年开发生涯的所思所想。
然鹅并不会对哪个技术做过多的纠缠，我想做的是引出枝干，如果想做到枝繁叶茂硕果累累，我想官网是营养最高的地方。
到此这篇关于Vue+Koa+MongoDB从零打造一个任务管理系统的文章就介绍到这了,更多相关Vue+Koa+MongoDB任务管理系统内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
Vue组件之间是有联系的，避免不了组件之间要互相传值，那么如何实现Vue两个同级组件传值，本文就来介绍一下，感兴趣的可以了解一下2021-07-07
这篇文章主要介绍了解决Vite打包后直接使用浏览器打开,显示空白问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2024-03-03
这篇文章主要介绍了vue3下eslint配置方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2024-01-01
这篇文章主要介绍了Vue3之 页面,菜单,路由的使用，文章围绕Vue3页面,菜单,路由相关资料展开详细内容,需要的朋友可以参考一下2021-11-11
这篇文章主要给大家介绍了基于vue大数据表格卡顿问题的完美解决方案，文中通过示例代码介绍的非常详细，对大家学习或者使用vue具有一定的参考学习价值，需要的朋友们下面来一起学习学习吧2019-03-03
Vue作为一款流行的前端框架,已经在许多项目中得到广泛应用,然而,随着我们在Vue中构建更大规模的应用程序,我们可能会遇到一个严重的问题,那就是内存泄漏,因此,我们需要认识到在Vue开发过程中,内存泄漏问题的重要性,本文将给大家介绍如何解决和预防内存泄漏问题2023-10-10
这篇文章主要介绍了vue parseHTML函数源码解析之析器遇到结束标签的示例详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2022-07-07
这篇文章主要给大家分享了 v-bind的使用和注意需要注意的点，下面文章围绕 v-bind指令的相关资料展开内容且附上详细代码 需要的小伙伴可以参考一下，希望对大家有所帮助2022-10-10
我们开发后台管理系统过程中，会由不同的人操作系统，有admin（管理员）、superAdmin(超管)，及各种运营、财务人员。为了区别这些人员，会给不同的人分配不一样的角色来展示不同的菜单，这就必须要通过动态路由来实现。下面就来介绍vue实现动态路由,需要的朋友可参考一下2021-10-10
Vue element-ui el-cascader 只能末级多选问题
这篇文章主要介绍了Vue element-ui el-cascader 只能末级多选问题，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-09-09
最新评论