當前位置:首頁 » 網頁前端 » 大公司如何發布前端項目
擴展閱讀
webinf下怎麼引入js 2023-08-31 21:54:13
堡壘機怎麼打開web 2023-08-31 21:54:11

大公司如何發布前端項目

發布時間: 2023-05-01 08:07:13

❶ 常見的前端集成部署方案有哪些各自的優缺點是什麼

前端行業經歷了這么長時間的發展,技術元素非常豐富,這里列舉出一般web團隊需要用到的技術元素:

開發規范:包括開發、部署的目錄規范,編碼規范等。不要小瞧規范的威力,可以極大的提升開發效率,真正優秀的規范不會讓使用者感到約束,而是能幫助他們快速定位問題,提升效率。

模塊化開發:針對js、css,以功能或業務為單元組織代碼。js方面解決獨立作用域、依賴管理、api暴露、按需載入與執行、安全合並等問題,css方面解決依賴管理、組件內部樣式管理等問題。是提升前端開發效率的重要基礎。現在流行的模塊化框架有requirejs、seajs等。

組件化開發:在模塊化基礎上,以頁面小部件(component)為單位將頁面小部件的js、css、html代碼片段放在一起進行開發、維護,組件單元是資源獨立的,組件在系統內可復用。比如頭部(header)、尾部(footer)、搜索框(searchbar)、導航(menu)、對話框(dialog)等,甚至一些復雜的組件比如編輯器(editor)等。通常業務會針對組件化的js部分進行必要的封裝,解決一些常見的組件渲染、交互問題。

組件倉庫:有了組件化,我們希望將一些非常通用的組件放到一個公共的地方供團隊共享,方便新項目復用,這個時候我們就需要引入一個組件倉庫的東西,現在流行的組件庫有bower、component等。團隊發展到一定規模後,組件庫的需求會變得非常強烈。

性能優化:這里的性能優化是指能夠通過工程手段保證的性能優化點。由於其內容比較豐富,就不在這里展開了,感興趣的同學可以閱讀我的這兩篇文章 [1] [2]。性能優化是前端項目發展到一定階段必須經歷的過程。這部分我想強調的一點是性能優化一定是一個工程問題和統計問題,不能用工程手段保證的性能優化是不靠譜的,優化時只考慮一個頁面的首次載入,不考慮全局在宏觀統計上的優化提升也是片面的。

項目部署:部署按照現行業界的分工標准,雖然不是前端的工作范疇,但它對性能優化有直接的影響,包括靜態資源緩存、cdn、非覆蓋式發布等問題。合理的靜態資源資源部署可以為前端性能帶來較大的優化空間。

開發流程:完整的開發流程包括本地開發調試、視覺效果走查確認、前後端聯調、提測、上線等環節。對開發流程的改善可以大幅降低開發的時間成本,工作這些年見過很多獨立的系統(cms系統、靜態資源推送系統)將開發流程割裂開,對前端開發的效率有嚴重的阻礙。

開發工具:這里說的工具不是指IDE,而是工程工具,包括構建與優化工具、開發-調試-部署等流程工具,以及組件庫獲取、提交等相關工具,甚至運營、文檔、配置發布等平台工具。前端開發需要工具支持,這個問題的根本原因來自前端領域語言特性(未來我會單獨寫一篇文章介紹前端領域語言缺陷問題)。前端開發所使用的語言(js、css、html)以及前端工程資源的載入與定位策略決定了前端工程必須要工具支持。由於這些工具通常都是獨立的系統,要想把它們串聯起來,才有了yeoman這樣的封裝。前面提到的7項技術元素都直接或間接的對前端開發工具設計產生一定的影響,因此能否串聯其他技術要素,使得前端開發形成一個連貫可持續優化的開發體系,工具的設計至關重要。

❷ 在創業型公司做前端,應該怎麼做

你就有啥就做啥。 不要跑。 你先要學會爬。
1。 給自己指定硬規范。 給隊友軟規范。 不要對隊友強制執行。 你自己有個規范後,設計和製作方向會非常清晰。 擺脫猶豫不覺的問題。
2。 用現有技術(你會的)做一套快速發布系統。 學習gulp 准備來代替grunt。只用grunt也行, 目標是要完整的實現發布,修復,恢復功能。加速deploy。
3。backbone,angular 有學習成本。如果你們公司不是single page app,不需要強制上任何框架。 熟練less 和jquery 足以完成大部分任務。
4。 介於你是半路出家到前台。 需要補習各種瀏覽器知識,版本區別,手機平板兼容等等。
5。 team build。搞好人際關系
6。 建立task flow 系統。 那個先做那個後做。因為這是老闆的事,所以就在這帶一句了。打工的程序員基本用不上。
7。 增加後台和前台的聯系。 不要分的太開。很多事情還需要後台大大幫你搞定

❸ Github配合Jenkins,實現vue等前端項目的自動構建與發布

轉原文: https://www.jianshu.com/p/4c4f92209dd1

因為它是依賴於 Java 環境的,所以必須先安裝 java 環境,否則啟動 Jenkins 服務的時候會報錯哦。
執行以下命令安裝JDK,一步到位。建議安裝版本1.8以上的

我一般習慣使用 yum 安裝軟體。由於 yum 的 repo 中默認沒有 Jenkins ,所以需要先將 Jenkins 庫添加到 yum repos 中,依次執行下面的命令:

賦予 Jenkins 在網站根目錄的讀寫許可權,我這邊網站的根目錄為 /usr/share/nginx/hxkj

啟動 Jenkins

因為 jenkins 默認使用 8080 埠,如果使用的是雲伺服器,還需要在安全組中開放 8080 埠(如果不想使用 8080 埠,或者埠被佔用了,可以在 Jenkins 的配置文件里修改默認埠)

可以根據頁面提示在伺服器中找到該密碼,輸入如下命令:( cat 命令後面的路徑為頁面上顯示的標紅文字,每個人的可能不一樣)

這一步,啥都不用做,慢慢等吧。。。

接下來默認插件安裝完成之後,創建一個管理員賬戶,完成配置後,就可以登錄 Jenkins 了

打開 系統管理 => 管理插件 搜索 NodeJs 然後勾選安裝
打開 系統管理 => 全局工具配置 拉到底部 配置 node 版本,如圖:

所有命令

步驟分離之後,如下圖

進入 github 設置頁,選擇 Developer settings

選擇 Personal access tokens => Generate new Generate

勾選如下配置,然後點擊 Generate Generate ,一定要保存好這個 token 哦,它只顯示一次。

打開 系統管理 => 管理插件 搜索 Github Plugin 然後勾選安裝

然後進入 系統管理 => 系統設置 => Github Server 添加信息

憑據 那裡再點擊 添加 添加如下信息

添加完畢之後記得選擇我們剛剛添加的憑據信息

最後點擊 連接測試 如果如下顯示,說明配置是正確的

當完成 push 操作之後,回到 Jenkins 管理頁面,就會看到在構建隊列中,新增了一條記錄。

而且,查看構建日誌,也提示成功!!!

❹ 前端項目的開發流程

前端開發流程概述

前端開發流程可分為需求分析、開發階段、測試階段、維護階段,下面分別進行敘述。

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依然是重要的基本功,在學習前沿工具的同時不能放棄基本功的訓練。

❺ 前端發布重要功能應該做好什麼准備事項

1,及時關注,並且自己在生產去測測,即便有bug,也不要等別人測出來,那樣就晚了,有bug,先回退版本,然後再想辦法解決問題。
2,發布之前,反復的多測試即便。

❻ 我是一個馬上畢業了的前端程序員,前端項目開發的流程一般是怎樣的呢

首先呢,前端算不上程序員,可以叫做「前端工程師」,跟我一樣撒(當然了,我技術差點,O(∩_∩)O~)。項目開發一般是這樣的流程:

  1. 產品給出UE

  2. 美工給出設計圖

  3. 前端開發

  4. 功能開發

  5. 測試

  6. 上線

    以上就是大體的流程,你的工作就是在第3步,其他的不用管。

❼ 大公司和小公司的web前端崗位工作內容有哪些不同

然,對於不同規模的公司,web前端崗位的設定也是有區別的,下面就來給大家介紹一下,企業是如何根據規模大小設定web前端的崗位的。

1. 企業規模:10人以下
我們先從幾個人的小作坊說起,這種小作坊裡面,基本上有一個人負責頁面的設計,然後把頁面「切」出來,然後有一個專門的人負責套程序。在這樣的公司裡面,Web前端其實是由網頁設計人員來兼作的,而這個職位一般叫做網頁設計師或者叫做網站美工。
2. 企業規模:10——30人
隨著公司規模的擴大,在達到十人以上到三十人左右的時候,網站一般會設置一個設計組,而這個組裡面一般要分出一個人來專職做Web前端的頁面製作,而不再是由美工兼任。而這樣的職位一般叫做網頁製作,說好聽一些可以叫做「網頁製作工程師」。不過在公司的一般泛稱則是諸如「製作」、「切頁面的」、「頁面仔」等。
3. 企業規模:100人以上
公司繼續壯大,發展到上百人的時候,網站一般來說也會越來越重視用戶體驗等細節,這個時候,大公司的一般做法是成立一個由設計人員和Web前端人員組成的用戶體驗部門,這個部門一般來說應該叫做UED(騰訊的叫ISD),而Web前端也在這個部門之中。
規模較小的UED中的Web前端團隊一般叫做網頁製作組或者Web前端組,這個組主要是負責Web頁面的製作的,也就是Web頁面中的HTML和CSS的相關工作,相應的職位則叫做「網頁製作工程師」或者「Web前端製作工程師」。
騰訊的Web前端設置比較特殊,他們的規模較大,不叫UED,而是叫做ISD,他們的分工一般來說也是只負責Web頁面的HTML和CSS部分,可能也包含少部分的Java代碼,而他們的這個職位叫做「Web重構工程師」。
4. 大型購物網站
而類似淘寶UED這種比較大的UED團隊,其Web前端人員的職責范圍也更大一些,他們的Web前端人員不僅要做HTML和CSS,還要做全部的Java或者Action,並且進一步擴展到Ajax甚至PHP等腳本語言的范圍,而其相關的職位則主要分為「前端開發工程師」、「資深前端開發工程師」以及「前端架構師」。
5. 結語
概括來說,Web前端的相關職位名稱主要有:「網頁製作」、「網頁製作工程師」、「前端製作工程師」、「網站重構工程師」、「前端開發工程師」、「資深前端開發工程師」以及「前端架構師」。

❽ 請高手解答在實際的Web前端開發的過程中,項目是怎麼做下來的(開會什麼的就免了,主要說做的過程)

我做前端有三年了吧,給你分享一下我的經驗,合適你就看看,不合適就當我說廢話了;前端首先從美工手裡拿到源文件,然後自己就對源文件分析,看看結構怎麼去布置,這個結構得在自己腦子裡面畫出來,然後就開始切圖,一邊切一邊寫html和css,js簡單的一些可以先寫,復雜一些放後面,這樣可以保證進度,比如一個焦點圖的js,在寫html的時候自己也是要把框架搭建好,不然後面寫js就麻煩了,就這樣把前端的東西搞好了之後就先給美工過關,看需求要調兼容性,包括犯賤的IE6,美工過關了之後就給程序員吧;程序員添加功能之後,頁面上出現的問題你也的去修修補補了,我的工作就這樣吧!希望可以幫到你!