前端工作流程轉變

近期前端工作流程發生了一些變化 如圖

首先從工程的角度将之前的工作流程沒有并行，同樣的項目大概要用4周的時間，流程變更後，能節省1周的時間如果團隊配合的好可以節省2周的時間.

先分析下之前的工作流程

• 需求方對需求發起
• PM制定提供需求解決方案，給出産品原型，傳遞給UI設計師
• UI設計師設計根據原型進行産品視覺設計
• 前端拿到UI稿之後開始頁面制作，互動制作
• 後端工程師拿到前端的頁面，開始套頁面模版，與前端工程師溝通ajax接口。寫後端功能。
• 後端與PM溝通驗收，PM回報前端後端問題，調整
• 傳遞測試工程師 bug回報調整

在這個過程中，很像傳統的流水線。一個環節一個環節走。與流程變更後，看似隻是多了一個流程但是實際上在工作過程中溝通浪費的時間還是挺多的，比如傳遞後端的時候，ui實作有變差，就要與前端工程師溝通，在開發階段，發揮重要責任的是後端工程師，往往擔負着很多溝通的責任。

流程優化：

• 需求方發起需求
• Pm制定需求解決方案，确認産品原型
• 産品原型确定後，傳遞給UI設計師，于此同時，前端工程師和後端工程師開始定資料，接口。
• UI稿确定後，前端工程師頁面制作，套後端模版，調試資料和接口。
• 由PM驗收，
• 測試

雖然從工作的内容上大家的工作沒變，但是這裡前端工程師有個細微的改變，寫後端，雖然是小小的改變缺在這個細節上優化了工作流程

這樣做的目前展現出的好處， 後端工程師可以抽身在産品進入開發的時候專注業務邏輯，也就是我們常說的MVC中M和C上。V交給前端工程師，工作的“中心”也轉變到前端工程師。初步實作了前後端的分離。

開發流程中是并行的，能縮短整個項目的開發時間。

這個都是有型的，

更重要的是有些東西是無形的。比如專人專事，讓專業的東西讓專業的人處理，早期團隊開發伺服器上的資源都是後端工程師來管理，導緻每個項目中靜态資源的随意處理，在頁面中js css 代碼混亂，代碼很難維護。現在在流程上做了簡單的前後端分離，前端工程師在開發的工程中有更多的“話語權”可以統一維護 靜态資源 借助現代比較流行nodejs，grunt，等等能更好的實作前端的工程化。

由于是初期試水有些問題看的比較淺顯，越來越多的問題會随着開發過程中浮出水面。

最後談下遇到的問題，目前來看在過程中接口的溝通，是一個成本比較高的，成熟的工程師，在接口設計上更友好。但是不能保證團隊中都是成熟的工程師，雖然有行文規範，但是溝通的成本，和資料正确率難以保證，反複溝通是團隊最容易付出更多時間成本。

團隊有做一個接口溝通的工具想法，大概有接口需求方提供接口所需要的資料類型，接口提供方給出接口，希望能在這款工具上有double Check和接口測試。提供者完成後勾選完成，需求方接到通知，檢查和測試，如果接口滿足的話，勾選完成，double Check的接口自動聲稱文檔－歸類，在接口清單中展示友善後人參閱。

但是苦于沒有時間。截至寫這篇文章的時候，還是想有沒有開源的，chrome app 有款 postman 能實作部分想要的功能但是，還是需要深度定制。期待有更好的。

轉載于:https://www.cnblogs.com/yunkou/p/4116306.html