快捷導(dǎo)航

Vue+Koa+MongoDB從零打造一個(gè)任務(wù)管理系統(tǒng)的詳細(xì)過(guò)程

更新時(shí)間：2022年08月18日 08:40:35 作者：DOM哥

這篇文章主要介紹了Vue+Koa+MongoDB從零打造一個(gè)任務(wù)管理系統(tǒng),本文通過(guò)圖文實(shí)例代碼相結(jié)合給大家介紹的非常詳細(xì)，需要的朋友可以參考下

大概是在18年的時(shí)候，當(dāng)時(shí)還沒(méi)有疫情。當(dāng)時(shí)工作中同時(shí)負(fù)責(zé)多個(gè)項(xiàng)目，有 PC 端運(yùn)營(yíng)管理后臺(tái)的，有移動(dòng)端 M 站的，有微信小程序的，每天 git 分支切到頭昏眼花，每個(gè)需求提測(cè)需要發(fā)送郵件，而且周五要寫煩人的周報(bào)，我就萌生了做一個(gè)任務(wù)管理系統(tǒng)的想法。其實(shí)不管是日常需求還是處理線上 bug，都可以看作一個(gè)個(gè)大大小小的任務(wù)。這些任務(wù)有排期，prd，項(xiàng)目分支，開(kāi)發(fā)測(cè)試人員等關(guān)鍵因素，在開(kāi)發(fā)過(guò)程中這些都會(huì)得到明確，從而根據(jù)這些信息推導(dǎo)出提測(cè)郵件內(nèi)容，進(jìn)而通過(guò)排期時(shí)間區(qū)間匯總出周報(bào)。

說(shuō)干就干，花了兩個(gè)周末。

基本上就是任務(wù)的增刪改查。

使用的技術(shù)棧如下：

# 前端
less
vue2
element-ui

# 后端
node
koa

# 數(shù)據(jù)庫(kù)
由于當(dāng)時(shí)對(duì) mongodb 不熟悉，又想快速原型，選擇了直接操作 json 文件的方式??

盡管如此簡(jiǎn)陋，但我還是比較滿意的，由于這時(shí)就我自己在用，功能基本夠用。此時(shí)的關(guān)注點(diǎn)主要在 3 個(gè)要素

任務(wù)的排期，匯總周報(bào)的依據(jù)
任務(wù)的狀態(tài)
- 未開(kāi)始，那些已提上日程但未著手開(kāi)始的任務(wù)
- 開(kāi)發(fā)中，進(jìn)行中的工作
- 已提測(cè)，這種狀態(tài)的任務(wù)的主要工作是修改 bug
- 已完成，發(fā)布上線了的任務(wù)，無(wú)需再繼續(xù)關(guān)注，匯總周報(bào)，季報(bào)的時(shí)候會(huì)用到
任務(wù)的項(xiàng)目分支，在多任務(wù)多項(xiàng)目并行時(shí)特別有用

我就把它定為 1.0 版本吧

后來(lái)，我也開(kāi)始借鑒市面上的任務(wù)管理工具，比如 tower，trello， teambition 等發(fā)展成熟的產(chǎn)品。

經(jīng)過(guò)兩年的改進(jìn)和迭代，它已經(jīng)變成了現(xiàn)在的樣子。

支持卡片拖動(dòng)去改變?nèi)蝿?wù)狀態(tài)

畫(huà)了一個(gè)甘特圖去直觀的展現(xiàn)任務(wù)排期跨度

模仿 github 日歷圖，排除掉周末節(jié)假日，直觀體現(xiàn)每天的任務(wù)并行情況

此時(shí)數(shù)據(jù)庫(kù)也已經(jīng)切換到了 mongodb

我就把這時(shí)的系統(tǒng)定為 2.0 版本吧

歲月荏苒，時(shí)光如梭。疫情不斷反復(fù)，前端的技術(shù)也已翻天覆地。為了與時(shí)俱進(jìn)，準(zhǔn)備把這個(gè)項(xiàng)目用最新的技術(shù)重寫一下。

具體計(jì)劃如下

# 主要是前端 vue
vue cli -> vite
vue2 -> vue3

最好的學(xué)習(xí)方式莫過(guò)于邊學(xué)邊練完成一個(gè)項(xiàng)目。

我準(zhǔn)備接下來(lái)圍繞這個(gè)項(xiàng)目更新一個(gè)系列，期間會(huì)涉及到下面這顆樹(shù)的枝干。同時(shí)分享一些幾年開(kāi)發(fā)生涯的所思所想。
然鵝并不會(huì)對(duì)哪個(gè)技術(shù)做過(guò)多的糾纏，我想做的是引出枝干，如果想做到枝繁葉茂碩果累累，我想官網(wǎng)是營(yíng)養(yǎng)最高的地方。

到此這篇關(guān)于Vue+Koa+MongoDB從零打造一個(gè)任務(wù)管理系統(tǒng)的文章就介紹到這了,更多相關(guān)Vue+Koa+MongoDB任務(wù)管理系統(tǒng)內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

您可能感興趣的文章: