Ⅰ 前端開發的難點到底在什麼地方
一般意義上的前端項目:
-從0到1,治理曬哦為健全點的都能搗鼓出來;
-從1到60,後後端或者設計崗位勉強能兼任;
-從60到80,需要比較專業的前端;
-從80到100,這么好的前端可遇不可求。
從0到1就是從無到有的過程,很多人用WordPress,建站之星就差不多就能搞個demo了,可以拿去騙投資人的錢。
從1到60,就是勉強可用,基本上讓後端工程師或者UI設計師找一套bootstrap的模板東拼西湊的也能勉強應付到第一版本上線。
從60到80,就是真正要做一款能完備、性能優良、架構合理的中小規模產品,沒有專業的設計、前端、後端、產品、運營是走不到這步的,差不多到A輪了。
從80到100,那就是追求各方面的極致,與競爭對手一較高下,各個方面沒有頂尖的人才都會影響整體的戰鬥力,木桶效應。
解釋一下:
1. 核心競爭力的主體是工程經驗。
其實這個結論可以推廣到其他研發崗位,就是每個研發崗位的知識體系都是由基礎學科知識+領域工程經驗構成,彼此不可替代的就是工程經驗部分。一個後端工程師一時間不能替代同等級前端工程師到不是基礎或者智商的問題,主要是工程經驗不足,你讓一個前端一個後端分別實現對方領域中一個有明確輸入輸出的功能函數,二者通過簡單學習新語言新語法,加上開發手冊查詢,一般都能比較正常的實現業務邏輯,但你讓他們hold住對方領域的完整項目就很困難了,技術選型,系統設計,模塊拆分,平台特性,宿主環境,性能優化,構建部署,系統測試等等都是領域工程經驗問題。
2. 工程經驗的等級是能cover項目從0發展到80+。
這個很好解釋,因為從0-60的非專業前端也能做到,60+的才是專業前端。
所以不用擔心核心競爭力問題,60+的前端現在都很搶手啊。工程經驗只有60-的話確實壓力比較大。
Ⅱ web前端開發面臨的挑戰主要是有哪些
平時工作,多數是開發Web項目,由於一般是開發內部使用的業務系統,所以對於安全性一般不是看的很重,基本上由於是內網系統,一般也很少會受到攻擊,但有時候一些系統平台,需要外網也要使用,這種情況下,各方面的安全性就要求比較高了。
1、測試的步驟及內容
這些安全性測試,據了解一般是先收集數據,然後進行相關的滲透測試工作,獲取到網站或者系統的一些敏感數據,從而可能達到控制或者破壞系統的目的。
2、SQL注入漏洞的出現和修復
SQL注入定義:
SQL注入攻擊是黑客對資料庫進行攻擊的常用手段之一。隨著B/S模式應用開發的發展,使用這種模式編寫應用程序的程序員也越來越多。但是由於程序員的水平及經驗也參差不齊,相當大一部分程序員在編寫代碼的時候,沒有對用戶輸入數據的合法性進行判斷,使應用程序存在安全隱患。用戶可以提交一段資料庫查詢代碼,根據程序返回的結果,獲得某些他想得知的數據,這就是所謂的SQL Injection,即SQL注入。
SQL注入有時候,在地址參數輸入,或者控制項輸入都有可能進行。如在鏈接後加入』號,頁面報錯,並暴露出網站的物理路徑在很多時候,很常見,當然如果關閉了Web.Config的CustomErrors的時候,可能就不會看到。
3、跨站腳本攻擊漏洞出現和修復
跨站腳本攻擊,又稱XSS代碼攻擊,也是一種常見的腳本注入攻擊。例如在界面上,很多輸入框是可以隨意輸入內容的,特別是一些文本編輯框裡面,可以輸入例如這樣的內容,如果在一些首頁出現很多這樣內容,而又不經過處理,那麼頁面就不斷的彈框,更有甚者,在裡面執行一個無限循環的腳本函數,直到頁面耗盡資源為止,類似這樣的攻擊都是很常見的,所以我們如果是在外網或者很有危險的網路上發布程序,一般都需要對這些問題進行修復。
Ⅲ 面試web前端的工作,會被問到什麼問題
在實際的面試中,你可能需要使用 JavaScript、CSS 和 HTML 來編寫代碼。在你的面試期間,你可能需要實現 UI、構建窗口小部件或使用 Lodash 和 Underscore.js 這樣的庫編寫常用的實用程序函數。例如:構建常見的 Web 應用程序的布局和交互,例如類似 Netflix 網站那樣的。實現小部件,如日期選擇器、輪播或電子商務網站購物車。寫一個類似 debounce 或深度 clone 對象的函數。
Ⅳ 關於網頁前端開發的問題
一口吃不出胖子的喂,我本身做後台程序的,但是你上面提到的我全都會,不說精通,但很多地方比我們的前台設計人員還要知道的多一點,因為某些時候我可以給出一些優化意見。
你上面說到的JS框架,說到底現在一般也就是JQUEYR這樣的東西,這個東西本身其實是為了優化JS使用而存在的,只不過是個寫好的JS文件而已,上來就學這個可能會感覺死記硬背的好煩,我建議你學習一些JS的基本知識,然後在看JQUERY這些包。
開始的工作不可能很復雜所以應該把工作學習重點放在DIV+CSS的布局上,這其中其實也有很多要學的地方,特別是瀏覽器兼容上的事,是需要慢慢的積累和習慣的。一開始JS實在不會可以網上搜人家寫好的,反正常用的也就幾個JS,最好不要搜用了JQEURY的,不能提高新手水平的。
所謂的審美,我可以很現實的告訴你,小公司為了省錢肯定請不起專業做美工的,所以都只可能是半吊子的美工,而大公司是有專門做美工的人員的,人家都是灰常NB的,不需要你查收。你的話會用PS,會用網上搜索到的素材,經常性的看看TAOBAO啊,微博啊之類的布局,美工足夠了,真要做到精通美工,先問下公司肯不肯給你10K一個月。
Ⅳ 前端面試官常問的問題有哪些
1、重繪和重排的關系:
重繪不會引起重排,但重排一定會引起重繪,一個元素的重排通常會帶來一系列的反應,甚至觸發整個文檔的重排和重繪,性能代價是高昂的。
2、重繪的概念:
重繪是一個元素外觀的改變所觸發的瀏覽器行為,例如改變visibility、outline、背景色等屬性。瀏覽器會根據元素的新屬性重新繪制,使元素呈現新的外觀。由於瀏覽器的流布局,對渲染樹的計算通常只需要遍歷一次就可以完成。
但table及其內部元素除外,它可能需要多次計算才能確定好其在渲染樹中節點的屬性值,比同等元素要多花兩倍時間,這就是我們盡量避免使用table布局頁面的原因之一。
3、觸發重排的情況:
頁面渲染初始化時;瀏覽器窗口改變尺寸;元素尺寸改變時;元素位置改變時;元素內容改變時;添加或刪除可見的DOM元素時。
4、rex的缺點:
(1)一個組件所需要的數據,必須甶父組件傳過來,而不能像flux中直接從store取。
(2)當一個組件相關數據更新吋,即使父組件不需要用到這個組件,父組件還是會重新render,可能會有效率影響,或者需要寫復雜的shouldComponentUpdate進行判斷。
5、對MVC和MVVM的理解:
(1)mvc:View傳送指令到Controller Controller完成業務邏輯後,要求Model改變狀態Model將新的數據發送到View,用戶得到反饋所有通信都是單向的。Angular它採用雙向綁定(data-binding):View的變動,自動反映在ViewModel,反之亦然。組成部分Model、View、ViewModel
(2)View:UI界面ViewModel:它是View的抽象,負責View與Model之間信息轉換,將View的Command傳送到Model;Model:數據訪問層。
Ⅵ H5前端聽起來好像很復雜,學起來難不難啊
同學,我們先來看看H5前端到底是何方神聖!H5前端:通過使用HTML標記語言製作網頁的過程。又有同學問,是不是只會HTML標記語言就能學好前端了?其實不然,前端是集合了許多主流技術的一門學科。學好H5要掌握哪些技術呢?具體如下:
前端網頁基礎:熟悉HTML、css基本知識,掌握選擇器、盒子模型、布局樣式等使用方法。
前端編程基礎:Javascript基礎、BOM+DOM編程、jQuery+交互動畫。
響應式網站與項目自動化開發。
前端框架編程及原理。
這樣看起來H5前端好像很復雜,讓很多同學也開始打退堂鼓了。但只要你是喜歡編程、喜歡解決問題,或者非常非常想進入高薪行業,並且可以為之長期堅持努力,那麼前端學好就不在話下。
Ⅶ 前端是有多難看完你就知道了
最近感覺追不動前端的發展了,寫篇文章感嘆一下。
HTML
我知道有一些學校會教一些簡單的網頁製作,就是用 Dreamweaver 點一點的那種。大多也會留作業,最後交作業的時候看起來也像模像樣。
只要不看代碼。
看了代碼感覺寧願選擇死亡。
table 布局,無意義的 dom 節點。大小寫混用,縮進混亂。
作為一個前端工程師,至少要寫明白自己寫的聲明是什麼意思對吧?
然後還得減少不必要的 dom 節點,畢竟很多文章說節點多會影響渲染速度(ps: 我是不在乎的,我覺得有點兒矯枉過正的味道了)
然後比較重要的一點兒是對於語義化標簽的見解。比如什麼時候該用 ul, 什麼時候該用 section, aside
至於 head 裡面的那些無聊的聲明只要會復制粘貼就好了,我覺得沒什麼意思
自信做到這些的應該算差不多了
文章說的是前端有多難,很多人都覺得這些標簽簡單。然而想像一下,要寫多少的標簽才能理解語義化的意義?要寫多少頁面才能真正的明白這個節點應該寫什麼標簽?如何組合才算合理?
CSS
然後是關於 CSS,我覺得這方面是很復雜的。並不像很多人覺得只是一些單詞的組合。
一開始我會改 background-color 覺得開心得不行,以為掌握了
後來無限突破視野。
在第一次寫超過50個class之後就感覺想死,重復性勞動,樣式修改調試,寫法丑。。。
接觸到 Sass 之後像是發現了新大陸,有一段時間甚至不會寫原生 css 語法了。
然後折騰: Sass -> Stylus
到這里結束了么? naive
後面還有postcss, cssnext 這些東西。
在 react 生態中還有 css-moles, css-in-js 這些鬼東西。
雖然語法都不是很難。但是這么長時間的折騰下來,雖說提升是有的,但並沒有感覺到生產力有多少巨大的提升。
css 到這里還沒完。
還有BEM的命名方式要去理解。
到這里依舊沒有完。
css3 的新特性,還有各種 hack。比如如何實現footer始終在底部,內容始終撐滿全局?如何實現條紋?
到這里結束了么?
依舊沒完。
css stage 4 等著去學習。
還有精力?
可以試著多做些兼容性相關的東西。會崩潰,相信我
到這里?
在我的視野中差不多算結束了,然而有誰能確定明天有沒有一個什麼new-css之類的東西解決什麼問題。
JS
來了來了,前端的一個核心。
說JS輕松么?咱們來扯扯。
首先是各種 dom 的增刪改,然後是ajax相關。學會了差不多能做簡單的頁面了。
然後對非同步的理解。只有理解了非同步才能正常地寫js。
然後是對js語言特性的理解。比如ES5如何實現繼承什麼的,閉包。
總之這些就是面試題總是會問的東西。
之後還應該理解設計模式對吧?
到這里是正常的語言應該學習的內容了。然而js到這里只是起步。
之後一個前端工程師還得會 ES2015/2016 之類的吧。現在不寫個async誰好意思說自己是寫前端的?
之後應該是配合工具了,後文說。
繼續順著語言往下說。會了 ECMAScript 就能做個合格的前端了么?
還早呢。
之前火的 coffee script 現在不行了,然而 TypeScript 火了啊。不學一下怎麼好意思追前端?
ts 對於之前寫 Java, C# 的非常友好,基本語法沒什麼變化。然而可苦了那些不寫這些語言的同學。語法改變倒是其次,思維方式的轉變才是難以接受的。
現在還有 Elm 了。。。
我覺得我老了,追不上了
Ⅷ Web前端崗位面試題有哪些
前端面試題匯總,基本上會有四大類問題,具體如下:
一、HTML
1、Doctype作用?嚴格模式與混雜模式如何區分?它們有何意義?
2、HTML5 為什麼只需要寫 <!DOCTYPE HTML>?
3、行內元素有哪些?塊級元素有哪些? 空(void)元素有那些?
4、頁面導入樣式時,使用link和@import有什麼區別?
5、介紹一下你對瀏覽器內核的理解?
6、常見的瀏覽器內核有哪些?
7、html5有哪些新特性、移除了那些元素?如何處理HTML5新標簽的瀏覽器兼容問題?如何區分 HTML 和 HTML5?
8、簡述一下你對HTML語義化的理解?
9、HTML5的離線儲存怎麼使用,工作原理能不能解釋一下?
10、瀏覽器是怎麼對HTML5的離線儲存資源進行管理和載入的呢?
11、請描述一下 cookies,sessionStorage 和 localStorage 的區別?
12、iframe有那些缺點?
13、Label的作用是什麼?是怎麼用的?(加 for 或 包裹)
14、HTML5的form如何關閉自動完成功能?
15、如何實現瀏覽器內多個標簽頁之間的通信? (阿里)
16、webSocket如何兼容低瀏覽器?(阿里)
17、頁面可見性(Page Visibility)API 可以有哪些用途?
18、如何在頁面上實現一個圓形的可點擊區域?
19、實現不使用 border 畫出1px高的線,在不同瀏覽器的Quirksmode和CSSCompat模式下都能保持同一效果。
20、網頁驗證碼是幹嘛的,是為了解決什麼安全問題?
21、tite與h1的區別、b與strong的區別、i與em的區別?
二、css
1、介紹一下標準的CSS的盒子模型?與低版本IE的盒子模型有什麼不同的?
2、CSS選擇符有哪些?哪些屬性可以繼承?
3、CSS優先順序演算法如何計算?
4、CSS3新增偽類有那些?
5、如何居中div?如何居中一個浮動元素?如何讓絕對定位的div居中?
6、display有哪些值?說明他們的作用。
7、position的值relative和absolute定位原點是?
8、CSS3有哪些新特性?
9、請解釋一下CSS3的Flexbox(彈性盒布局模型),以及適用場景?
10、用純CSS創建一個三角形的原理是什麼?
11、一個滿屏 品 字布局 如何設計?
三、常見兼容性問題?
1、li與li之間有看不見的空白間隔是什麼原因引起的?有什麼解決辦法?
2、經常遇到的瀏覽器的兼容性有哪些?原因,解決方法是什麼,常用hack的技巧 ?
3、為什麼要初始化CSS樣式。
4、absolute的containing block計算方式跟正常流有什麼不同?
5、CSS里的visibility屬性有個collapse屬性值是幹嘛用的?在不同瀏覽器下以後什麼區別?
6、position跟display、margin collapse、overflow、float這些特性相互疊加後會怎麼樣?
7、對BFC規范(塊級格式化上下文:block formatting context)的理解?
8、CSS權重優先順序是如何計算的?
9、請解釋一下為什麼會出現浮動和什麼時候需要清除浮動?清除浮動的方式
10、移動端的布局用過媒體查詢嗎?
11、使用 CSS 預處理器嗎?喜歡那個?
12、CSS優化、提高性能的方法有哪些?
13、瀏覽器是怎樣解析CSS選擇器的?
14、在網頁中的應該使用奇數還是偶數的字體?為什麼呢?
15、margin和padding分別適合什麼場景使用?
16、抽離樣式模塊怎麼寫,說出思路,有無實踐經驗?[阿里航旅的面試題]
17、元素豎向的百分比設定是相對於容器的高度嗎?
18、全屏滾動的原理是什麼?用到了CSS的那些屬性?
19、什麼是響應式設計?響應式設計的基本原理是什麼?如何兼容低版本的IE?
20、視差滾動效果,如何給每頁做不同的動畫?(回到頂部,向下滑動要再次出現,和只出現一次分別怎麼做?)
21、::before 和 :after中雙冒號和單冒號 有什麼區別?解釋一下這2個偽元素的作用。
22、如何修改chrome記住密碼後自動填充表單的黃色背景 ?
23、你對line-height是如何理解的?
24、設置元素浮動後,該元素的display值是多少?(自動變成display:block)
25、怎麼讓Chrome支持小於12px 的文字?
26、讓頁面里的字體變清晰,變細用CSS怎麼做?(-webkit-font-smoothing: antialiased;)
27、font-style屬性可以讓它賦值為「oblique」 oblique是什麼意思?
28、position:fixed;在android下無效怎麼處理?
29、如果需要手動寫動畫,你認為最小時間間隔是多久,為什麼?(阿里)
30、display:inline-block 什麼時候會顯示間隙?(攜程)
31、overflow: scroll時不能平滑滾動的問題怎麼處理?
32、有一個高度自適應的div,裡面有兩個div,一個高度100px,希望另一個填滿剩下的高度。
33、png、jpg、gif 這些圖片格式解釋一下,分別什麼時候用。有沒有了解過webp?
34、什麼是Cookie 隔離?(或者說:請求資源的時候不要讓它帶cookie怎麼做)
35、style標簽寫在body後與body前有什麼區別?
四、JavaScript
1、介紹JavaScript的基本數據類型。
2、說說寫JavaScript的基本規范?
3、JavaScript原型,原型鏈 ? 有什麼特點?
4、JavaScript有幾種類型的值?(堆:原始數據類型和 棧:引用數據類型),你能畫一下他們的內存圖嗎?
5、Javascript如何實現繼承?
6、Javascript創建對象的幾種方式?
7、Javascript作用鏈域?
8、談談This對象的理解。
9、eval是做什麼的?
10、什麼是window對象? 什麼是document對象?
11、null,undefined的區別?
12、寫一個通用的事件偵聽器函數(機試題)。
13、[「1」, 「2」, 「3」].map(parseInt) 答案是多少?
14、關於事件,IE與火狐的事件機制有什麼區別? 如何阻止冒泡?
15、什麼是閉包(closure),為什麼要用它?
16、javascript 代碼中的」use strict」;是什麼意思 ? 使用它區別是什麼?
17、如何判斷一個對象是否屬於某個類?
18、new操作符具體幹了什麼呢?
19、用原生JavaScript的實現過什麼功能嗎?
20、Javascript中,有一個函數,執行時對象查找時,永遠不會去查找原型,這個函數是?
21、對JSON的了解?
22、[].forEach.call($$("*"),function(a){ a.style.outline="1px solid #"+(~~(Math.random()*(1<<24))).toString(16) }) 能解釋一下這段代碼的意思嗎?
23、js延遲載入的方式有哪些?
24、Ajax 是什麼? 如何創建一個Ajax?
25、同步和非同步的區別?
26、如何解決跨域問題?
27、頁面編碼和被請求的資源編碼如果不一致如何處理?
28、模塊化開發怎麼做?
29、AMD(Moles/Asynchronous-Definition)、CMD(Common MoleDefinition)規范區別?
30、requireJS的核心原理是什麼?(如何動態載入的?如何避免多次載入的?如何 緩存的?)
31、讓你自己設計實現一個requireJS,你會怎麼做?
32、談一談你對ECMAScript6的了解?
33、ECMAScript6 怎麼寫class么,為什麼會出現class這種東西?
34、非同步載入的方式有哪些?
35、documen.write和 innerHTML的區別?
36、DOM操作——怎樣添加、移除、移動、復制、創建和查找節點?
37、.call() 和 .apply() 的含義和區別?
38、數組和對象有哪些原生方法,列舉一下?
39、JS 怎麼實現一個類。怎麼實例化這個類
40、JavaScript中的作用域與變數聲明提升?
41、如何編寫高性能的Javascript?
42、那些操作會造成內存泄漏?
43、JQuery的源碼看過嗎?能不能簡單概況一下它的實現原理?
44、jQuery.fn的init方法返回的this指的是什麼對象?為什麼要返回this?
45、jquery中如何將數組轉化為json字元串,然後再轉化回來?
46、jQuery 的屬性拷貝(extend)的實現原理是什麼,如何實現深拷貝?
47、jquery.extend 與 jquery.fn.extend的區別?
48、jQuery 的隊列是如何實現的?隊列可以用在哪些地方?
49、談一下Jquery中的bind(),live(),delegate(),on()的區別?
50、JQuery一個對象可以同時綁定多個事件,這是如何實現的?
51、是否知道自定義事件。jQuery里的fire函數是什麼意思,什麼時候用?
52、jQuery 是通過哪個方法和 Sizzle 選擇器結合的?(jQuery.fn.find()進入Sizzle)
53、針對 jQuery性能的優化方法?
54、Jquery與jQuery UI有啥區別?
55、JQuery的源碼看過嗎?能不能簡單說一下它的實現原理?
56、jquery 中如何將數組轉化為json字元串,然後再轉化回來?
57、jQuery和Zepto的區別?各自的使用場景?
58、針對 jQuery 的優化方法?
59、Zepto的點透問題如何解決?
60、jQueryUI如何自定義組件?
61、需求:實現一個頁面操作不會整頁刷新的網站,並且能在瀏覽器前進、後退時正確響應。給出你的技術實現方案?
62、如何判斷當前腳本運行在瀏覽器還是node環境中?(阿里)
63、移動端最小觸控區域是多大?
64、jQuery 的 slideUp動畫 ,如果目標元素是被外部事件驅動, 當滑鼠快速地連續觸發外部元素事件, 動畫會滯後的反復執行,該如何處理呢?
65、把 Script 標簽 放在頁面的最底部的body封閉之前 和封閉之後有什麼區別?瀏覽器會如何解析它們?
66、移動端的點擊事件的有延遲,時間是多久,為什麼會有? 怎麼解決這個延時?(click 有 300ms 延遲,為了實現safari的雙擊事件的設計,瀏覽器要知道你是不是要雙擊操作。)
67、知道各種JS框架(Angular, Backbone, Ember, React, Meteor, Knockout…)么? 能講出他們各自的優點和缺點么?
68、Underscore 對哪些 JS 原生對象進行了擴展以及提供了哪些好用的函數方法?
69、解釋JavaScript中的作用域與變數聲明提升?
70、那些操作會造成內存泄漏?
71、JQuery一個對象可以同時綁定多個事件,這是如何實現的?
72、Node.js的適用場景?
(如果會用node)知道route, middleware, cluster, nodemon, pm2, server-side rendering么?
73、解釋一下 Backbone 的 MVC 實現方式?
74、什麼是「前端路由」?什麼時候適合使用「前端路由」? 「前端路由」有哪些優點和缺點?
75、知道什麼是webkit么? 知道怎麼用瀏覽器的各種工具來調試和debug代碼么?
76、如何測試前端代碼么? 知道BDD, TDD, Unit Test么? 知道怎麼測試你的前端工程么(mocha, sinon, jasmin, qUnit..)?
77、前端templating(Mustache, underscore, handlebars)是幹嘛的, 怎麼用?
78、簡述一下 Handlebars 的基本用法?
79、簡述一下 Handlerbars 的對模板的基本處理流程, 如何編譯的?如何緩存的?
80、用js實現千位分隔符?(來源:前端農民工,提示:正則+replace)
檢測瀏覽器版本版本有哪些方式?
81、我們給一個dom同時綁定兩個點擊事件,一個用捕獲,一個用冒泡,你來說下會執行幾次事件,然後會先執行冒泡還是捕獲
Ⅸ 為什麼我們的WEB前端變的越來越復雜
1、以前對於前端的定位可能只是「頁面仔」,把設計師的設計變成一個實際的網頁。不過現在可不是這么簡單了,同樣是一張設計圖,需要在許多千奇百怪的瀏覽器上面進行兼容,調試。而且因為現在網頁的交互已經變得越來越復雜,單純的網頁已經不能夠滿足於用戶。而更加像是一個富客戶端。
2、而且隨著HTML5跨平台應用的興起,前端的定位又進一步發展了。因為可以要求前端編寫移動端web app應用甚至是跨平台應用。這個時候,前端要學習的東西就更多了。
3、可能這些只是一個表面上看到的東西。因為前端工程師如果定位不好,在一個團隊中很容易成為一個中間人。為什麼這么說呢,因為團隊中會使用一種後端語言,常見的有python,php,ruby現在還有node.js(對不起,我知道node.js不是一種語言,不過你懂就行了),如果你不會這種後端語言,你會變得好像一個局外人,甚至在團隊中顯得像個外包。因此前端又需要在應用層面上會這些後端的語言,比如說要爬爬數據,你總不能在瀏覽器上就完成吧?所以前端的范圍就更廣了。
好吧,從幾個方面說了前端為什麼那麼苦逼。其實前端是一個很好的練武場,你一定會在前端職位上成為一個多面手,學習到最多的東西,因為你跨維度是最大的,你懂設計,懂交互,懂後端語言,懂前端語言,會溝通,會兼容,你都做到了,你已經是個牛人了!歡迎加入前端。
Ⅹ 前端開發的難點到底在什麼地方
不同級別的前端面臨的難點各不相同,不可一概而論;
業務開發的前端難點在於對業務的理解和把控能力;
平台開發的前端難點在於產品化的把控和推進能力。
觀點1:不同級別的前端面臨的難點各不相同,不可一概而論。
其他回答有說 CSS 難,有說 CSS 不難的,每個人水平不同,這樣爭論毫無意義。我剛學前端時覺得 JS/CSS/瀏覽器兼容問題都很難,現在覺得也就那樣,因為前端路子廣,辦法總比問題多。後來覺得要評估好需求,把控好項目質量比較難,很多時候我們是在幹事,在解決問題,不是只埋頭寫代碼,時間一長你會發現前端工作中,技術問題往往比較好解決,反而資源+協作問題比較麻煩。現在對我來說比較難的是快速產品化的能力,如何從無到有去做出一些有價值的東西。
舉一個簡單粗暴的例子吧:阿里前端很多,P5/P6 一大把,但是 P8/P9 的非常少,為什麼?進階的難點在哪裡?
前端開發的難點跟前端進階的難點是非常相似的。阿里對每個前端層級都有一個標准,這也從側面回答了這個問題,比如對 P5 來說,難點可能是寫好業務代碼,保證其靈活性和可維護性,能解決各種適配問題;對 P6 來說則需要獨擋一面,能獨立 owner 需求,而 P7 則需要在某方面技術有深入理解,等等。
能提出這個問題首先得恭喜題主,說明題主在當前階段遇到瓶頸了,需要向下一個 level 出擊了。
觀點2:業務開發的前端難點在於對業務的理解和把控能力。
業務邏輯開發本身並不是難點,誰都可以寫。但是對於你自己負責的這塊業務,後續業務的發展方向和潛力,你有去了解過嗎?當業務方提需求過來時你是只負責執行還是和業務方一起探討更合理的方案?你有沒有給自己負責的產品提過一些建議?做過一些改善措施?如果前端只是作為一個執行者,作為一種被調度的資源,那麼即使最終項目取得了好的成績,跟你有多大關系?你自己會有多大的成就感?
另外一個很重要的點:就是對業務的把控能力。業務方總是會催著上線,開發時間不斷被壓縮該怎麼辦?進度不如預期怎麼辦?開發遇到瓶頸怎麼辦?發布新功能翻車了怎麼辦?
我見過有默默加班保證進度的,也有跟需求方重新談延期的,有發布出問題手足無措的,也有自己默默修復的,有遇到瓶頸一籌莫展的,也有及時跟老闆溝通,跟業務方撕逼的… 如何優雅的處理這些問題,有時候比寫代碼更難。為什麼有的人業務代碼邏輯混亂,寫的一團糟?我不相信是智力問題,反倒更相信是對項目本身沒有把控好,本來排了5天工作量的需求被業務方壓到了3天,你還能保證寫出健壯而不失風度的代碼?
觀點3:平台開發的前端難點在於產品化的把控和推進能力。
做業務時有人給你提需求,幫你出交互視覺稿,你只要負責寫頁面就行了。但是在支付寶前端,很多內部平台和技術產品都是技術自己主導,你需要自己發現問題,出方案,設計資料庫,自己出頁面,這是一個從無到有的創造的過程。並且要保證你做的東西是真正解決問題的,而不是做一些自己覺得很牛逼實際上並沒有解決用戶痛點的東西,用我老闆的話說就是對產品的把控能力,不要跑偏了。前端是最容易做出產品化東西的工程師了,因為後端不會做 UI,UI 不會寫代碼,唯前端兼顧,這是最大優勢。
再一個就是對產品的推進能力了,你做的東西可能需要各種資源?如何爭取?可能牽扯到多方利益?如何權衡?東西做出來了如何推廣?如何在用戶的一片罵聲中奮勇前進?
印象中很多平台型產品,剛開始投入使用時都是一片罵聲,各種問題,說實話負責這些產品的程序員壓力是相當大的,天天被罵還得徹夜幫別人解決問題,還得不斷優化系統,你說難不難?
以上三點就是本文所展現的理念,希望能對大家有幫助。