① 前端項目的開發流程
前端開發流程概述
前端開發流程可分為需求分析、開發階段、測試階段、維護階段,下面分別進行敘述。
2.1 需求分析
這個環節中,首先是和客戶進行交流,了解客戶的需求,然後分析項目的可行性,撰寫項目需求文檔。如果項目可行,則起討論具體方案,分模塊分步驟進行規劃,分析項目進度安排、所需成本,進行原型設計(包括頁面布局圖,頁面邏輯流程圖,說明文檔等。通過原型設計,可以讓項目組和客戶都可以對項目有一個直觀感受,同時可以低成本高效率的復現業務場景和各模塊流程)。
可以說需求分析階段是整個前端項目的基礎,基礎不牢,地動山搖。可以試想,如果和客戶溝通不順暢,有的方面客戶沒搞清楚是什麼效果,開發完成後就可能與客戶發生糾紛;如果可行性有問題,有的模塊很難實現或成本超出預算,就很難處理。
2.2 開發階段
這個環節是前端工程師主要參與的部分,按照需求分析階段的規劃按步驟完成任務。
根據產品需求分析文檔和原型圖進行UI設計,對產品的整體美術風格、交互設計、界面結構、操作流程等做出設計。負責項目中各種交互界面、圖標、LOGO、按鈕等相關元素的設計與製作。
根據UI設計進行規劃,提取界面中可以復用的模塊方便重復利用,分析界面是否有實現難度比較困難的地方,進行溝通和功能排期,按功能大小以及難度進行功能時間的評估,和後端溝通好排期時間,保證大家能夠更有效地開發合作,針對功能復雜的地方要先理清思路。
不要盲目開發前端搭建框架。根據設計圖進行前端界面開發,以及遇到的問題及時與產品、UI、後台人員溝通,保持大家信息一致,針對不清楚的地方也要及時溝通,以免做錯功能。
根據後端介面進行欄位填充,以及部分功能開發。針對缺少的欄位或者數據結構進行提出,及時與後端反應,盡量讓大家都能以最小的改動完成後續開發工作。前後端都要按照規范進行開發,針對不規范的地方要給與提出、指正,營造出規范的工作模式,以後維護成本和溝通成本更低以及開發效率更高。如果前端的設計進度遠遠超前後端的介面和數據結構設計,也不必等後端,可以自行開發nodejs伺服器配合postman等介面軟體進行開發。
前後端功能聯調、完成自測。檢查功能完成情況,看是否有遺漏,出現問題及時溝通解決。
2.3 測試階段
發布測試、修改bug、發布上線,自測完成後提交測試,測試根據提交的項目以及需求進行測試,提出bug給相關人員修改,開發人員周期性的配合修改bug,保證今天能夠修復昨天的bug。
發布dev環境,配合測試,修復bug以及需求優化
發布test環境,修復bug以及需求優化
發布it環境,修復bug以及需求優化
發布pre環境,修復bug以及需求優化
pre驗收之後,發布線上環境,產品進行驗收
2.4 維護階段
如果客戶驗收通過,項目就進入了維護階段,程序的維護包括程序上線後後續bug的修復和程序版本的更新。
3 個人經驗總結
3.1 文檔很重要
前端項目的文檔似乎已經作為前端工程化的標准流程之一了,文檔寫的好,可以便於同事快速了解你的代碼功能和需求,便於協作。可以想像,隨之項目復雜度增加,體量越來越龐大,開發團隊人數也越來越多。這種情況下,如果像變魔術一樣隱匿中間流程而直接得出結果,後果可想而知:項目復雜度越增加就越難以管理,開發效率低,合作混亂,結果甚至導致項目死亡。
好的文檔看起來就像一個產品說明書,但作用卻遠遠超過了說明書,不僅僅告訴你如何使用,還應該告訴你項目的設計思路,用了哪些組件,哪些部分不完善,將來有什麼規劃等等。這是一份比較好的說明文檔。
3.2 與客戶及時溝通很重要
3.3 扎實的基本功很重要
盡管當下框架、函數庫、工具包等更新迭代非常快,前端工程師有很多新的知識要學,但原生JS、HTML和CSS依然是重要的基本功,在學習前沿工具的同時不能放棄基本功的訓練。
② 前端項目開發周期
一個項目的開發周期
0、產品經理有需求想法去找項目經理討論可行性和緊迫性
1、項目經理開始分任務
2、產品建群發需求文檔 答疑解惑
3、前後端把產品叫過來答疑解惑准備開發發送答疑解惑郵件
4、前端或者後端選擇一位作為項目負責人對項目工時分解,溝通開發時間和測試時間,最終開發測試產品約定統一時間
5、建立開發任務立項郵件附帶上一步的分解文檔,讓主管在任務平台創建任務和分解任務,在文檔中約定時間開始開發
6、測試前一天確定是否延期,如果延期,需要產品測試過來重新評估工期
到提測最後一天時,需要產品測試和主管過來驗收項目
7、根據驗收,第二天中午前修復bug發測試、發布提測郵件
8、bug集中在郵件中發送,典型bug需要在任務平台建立
9、完成測試時會發生確認郵件
③ 前端改動一定依賴於版本發布嗎
不一定。
當前端需要發布新版本時,可以不依賴於後端(根據實際情況,也可以不依賴於運維)。 畢竟有很多需求並不需要後端介入。
前端項目的工程化,不只對開發層面的組件化、模塊化、規范化等,更涉及到構建、部署的工程化和自動化。工程化的一些概念,編譯、構建、部署、發布、CI/CD、灰度等概念,其實都是軟體工程中很成熟的概念,現在前端項目中也快速發展起來。
④ nginx發布前端項目,想更換html.CSS.js等,如何不重啟nginx更換
直接修改nginx配置文件,然後reload
⑤ 一個前端開發新項目,開發流程是怎樣的
我們以前基本的流程是,領導或甲方提出需求,然後產品分析需求,並且根據需求畫出原型圖,然後根據原型圖出設計稿。 出完設計稿團隊評審,過後交與前端製作靜態頁面,然後靜態頁面,交與設計審核,過後交給開發人員,進行動態數據的添加。 添加...
⑥ 怎樣從無到有地建立一個前端項目
年後入職新公司,面試時聊到公司的情況大致是這樣的:團隊里需要招一名前端(就此一人,其他都是後台開發的),項目是一個工具類的Pc端項目(我的理解就弊局姿是web應用!?),框架用的是vue,而且這個項目組是新成立的,也就是說前端的活兒需要我從零開始一步一步搭建。我本人之前的項目經驗比較膚淺,沒有過這種全權負責整個前端部分的經驗,因此想問問各位大神,一般來說,應該怎樣做准備工作?在搭建項目時,有沒有什麼提前需要注意的地方嗎?
1. 通讀文檔、原型圖,不懂、不明確的地方找產品確定,不要憑自己感覺猜測
2. 畫流程圖,考慮一些交互,不確定的技術方案可以試著寫個簡單 demo 跑跑
3. 拉上產品、設計、後端開個技術交互評審臘臘 4. 確定介面 5. 拿到設計稿,過一遍,看看有什麼不合理遺漏的地方
6. 切圖,根據介面文檔寫代碼,期間遇見問題,及時和產品設計後端溝通
7. 參加測試人員的技術評審 8. 自測聯調,發布測試版 9. 改 BUG 10. 發布預發版,外網測試(如果是對外項目)
11. 發布正式版
如果做後台頁面,可能沒有設計師,那麼盡量保持各頁面風格統一,可以考慮 Bootstrap、ElementUI。
排期有問題,也及時溝通,並說明理由。產品改需求,影響排期,需要說明。 我的經歷大致就是這樣。
仔細看一遍vue官方文檔。
從框架api到編程風格指導,一條龍。
再搭配vue官方腳手架vue-cli,完美。
首先肯定了解清楚需求,是否前後端分離,是否需要ssr,是中後台項目還是純展示項目。
既然框架選擇vue,那麼推薦使用vue-cli,是否需要引入vuex看項目需求。按照vue-cli推薦的目錄劃分項目文件,組織好基礎的配置結構,便於之後接手項目的人。
提供好相應的初始化鉤子,定好less顏色變數,路由集租絕中管理,bundle按路由拆分,純組件和業務組件分開,全局的loading和錯誤處理,類似登陸注冊基礎的模塊,前端錯誤收集,一些模塊的二次封裝,模塊按需載入,tree shaking。一個好的項目模版甚至可以保留後,之後的業務基於項目模版開發。
做到新人針對某一個頁面開發,加一個路由對全局不會造成太大的影響。 首先前端是你一個人,而且沒有人提出讓你用什麼,要麼用你會用的要麼用你想用的。如果你用vue就更方便了。直接使用腳手架搭起來一個項目然後寫東西就行了。不用考慮太多!
如果我是樓主目前的水平,我會擼起Jquery就是干,管它vue不vue,反正前端就一個,怕個 *** 朝天。
vue cli 自帶的webpack模板 賊開心 1、 是否是前後端分離項目,使用vue進行開發是否使用腳手架工具vue-cli或者使用webpack自己搭建開發環境 2、 css的模塊化設計,使用原生css,還是使用預編譯器less或者sass 3、 框架的選擇,web端的vue框架很多,例如:iview……
⑦ web前端項目開發流程
前端前景是很不錯的,像前端這樣的專業還是一線城市比較好,師資力量跟得上、就業的薪資也是可觀的,學習前端可以按照路線圖的順序,
0基礎學習前端是沒有問題的,關鍵是找到靠譜的前端培訓機構,你可以深度了解機構的口碑情況,問問周圍知道這家機構的人,除了口碑再了解機構的以下幾方面:
1. 師資力量雄厚
要想有1+1>2的實際效果,很關鍵的一點是師資隊伍,你接下來無論是找個工作還是工作中出任哪些的人物角色,都越來越愛你本身的技術專業前端技術性,也許的技術專業前端技術性則絕大多數來自你的技術專業前端教師,一個好的前端培訓機構必須具備雄厚的師資力量。
2. 就業保障完善
實現1+1>2效果的關鍵在於能夠為你提供良好的發展平台,即能夠為你提供良好的就業保障,讓學員能夠學到實在實在的知識,並向前端學員提供一對一的就業指導,確保學員找到自己的心理工作。
3. 學費性價比高
一個好的前端培訓機構肯定能給你帶來1+1>2的效果,如果你在一個由專業的前端教師領導並由前端培訓機構自己提供的平台上工作,你將獲得比以往更多的投資。
希望你早日學有所成。