一份優(yōu)秀的前端開(kāi)發(fā)工程師簡(jiǎn)歷是怎么樣的？

大家是否有這樣的困惑？在公司跟了幾個(gè)項(xiàng)目，可能就是組長(zhǎng)跟我們說(shuō)下需求然后就開(kāi)始動(dòng)手寫(xiě)頁(yè)面，也不用自己選型，腳手架也是現(xiàn)成的，除了 Vue 就是拿Echarts寫(xiě)過(guò)圖表都沒(méi)什么技術(shù)含量，照著文檔寫(xiě)，遇到問(wèn)題查一下就解決了。但寫(xiě)簡(jiǎn)歷時(shí)又要體現(xiàn)出在項(xiàng)目中的作用。怎樣找到只屬于自己的那些亮點(diǎn)呢？

你負(fù)責(zé)的業(yè)務(wù)是什么？

我接觸過(guò)不少同學(xué)，有說(shuō)在小公司，被業(yè)務(wù)需求壓著。既然大家都說(shuō)在做業(yè)務(wù)，那么，正看到這里的你，能不能5分鐘說(shuō)明白，你負(fù)責(zé)的業(yè)務(wù)是什么？

這個(gè)問(wèn)題我在活動(dòng)群的 github issue 活動(dòng)中，帶有業(yè)務(wù)理解標(biāo)簽的題目里經(jīng)常會(huì)問(wèn)到，可是大部分同學(xué)都沒(méi)有說(shuō)到位，甚至答非所問(wèn)。

這里談?wù)勎覀€(gè)人對(duì)業(yè)務(wù)的理解，或許沒(méi)有普遍意義，所以僅供參考。

業(yè)務(wù)最核心的要素是業(yè)務(wù)本身的價(jià)值

一家公司，或者一個(gè)部門(mén)，做的事情有許許多多，零零散散。也有很多事情合到一起，促成了一件大事的時(shí)候。那么，我們是把那些零散的事情都看成業(yè)務(wù)？還是只把那一件大事看成業(yè)務(wù)呢？我認(rèn)為都可以。決定權(quán)在于這件事是否邏輯自洽，以及是否具有獨(dú)特的價(jià)值。

接下來(lái)讓我們拿著一個(gè)例子來(lái)說(shuō)，假設(shè)你在開(kāi)發(fā)一個(gè)營(yíng)銷(xiāo)活動(dòng)頁(yè)，這個(gè)頁(yè)面能夠給公司帶來(lái)3000人的新用戶，這些人有可能會(huì)購(gòu)買(mǎi)公司的產(chǎn)品，從而帶來(lái)收入。

這里明顯可以感受到，營(yíng)銷(xiāo)是一個(gè)業(yè)務(wù)線，他的商業(yè)邏輯是投放頁(yè)面 -> 拉新回流 -> 商品銷(xiāo)售，價(jià)值在于新用戶的觸達(dá)，以及商品銷(xiāo)售利益?；谶@兩點(diǎn)，我們就值得投入精力，因?yàn)樽龅脑胶?，公司業(yè)績(jī)?cè)胶谩?/p>

那么，做個(gè)頁(yè)面就是亮點(diǎn)了？

當(dāng)然不是，但是亮點(diǎn)已經(jīng)離我們很近了。如果你想要有亮點(diǎn)，那你需要保持思考。在上面的例子中，我們有許多可以優(yōu)化和驗(yàn)證的事情。

• 營(yíng)銷(xiāo)頁(yè)每天換內(nèi)容，怎么快速替換？

• 營(yíng)銷(xiāo)部門(mén)人越來(lái)越多了，頁(yè)面每天要10個(gè)，一個(gè)人怎么做得完？

• 前端的人也越來(lái)越多了，改個(gè)組件不能只靠復(fù)制黏貼，怎么管理？

• 拉新回流效率具體有多高？新人真的有買(mǎi)我們的商品嗎？這么多人投入，都是要工資的，賣(mài)- 出去的商品能夠發(fā)我們的工資嗎？

• 轉(zhuǎn)化率低了，怎么才能提升？

這個(gè)按鈕寫(xiě)錯(cuò)個(gè)樣式到了右邊，居然點(diǎn)的人特別多？那下次是不是都應(yīng)該放右邊？

上面列舉的幾個(gè)問(wèn)題，估計(jì)很多同學(xué)日常都有做類似的事情。但問(wèn)題是，這些事情是你想做的，還是產(chǎn)品讓你做的？這些事情能誕生什么出來(lái)呢？

• b運(yùn)營(yíng)配置后臺(tái)與投放策略

• 營(yíng)銷(xiāo)搭建體系

• 工程化研發(fā)套件

• 業(yè)務(wù)埋點(diǎn)與數(shù)據(jù)分析系統(tǒng)

• 數(shù)據(jù)倉(cāng)庫(kù)與數(shù)據(jù)分析后臺(tái)

• nA/B test系統(tǒng)

至少在我看來(lái)，如果面試的同學(xué)上來(lái)自我介紹的時(shí)候，能夠講一下上面例子中遇到的問(wèn)題，之后再說(shuō)做了下面對(duì)應(yīng)的某一個(gè)系統(tǒng)，那么，這就是絕對(duì)夠分量的亮點(diǎn)。只可惜這樣的同學(xué)少之又少，大部分同學(xué)是因?yàn)楫a(chǎn)品說(shuō)要做就去做了。

所以，你真的想過(guò)業(yè)務(wù)是什么嗎？有為業(yè)務(wù)想過(guò)什么嗎？有了你，業(yè)務(wù)有什么不同嗎？

可以開(kāi)始寫(xiě)代碼了？

好了，假設(shè)我們思考了一下，想了點(diǎn)東西出來(lái)，接下來(lái)我們可以開(kāi)始寫(xiě)代碼了.....嗎？

做一個(gè)有亮點(diǎn)的技術(shù)產(chǎn)出，可不是擼起袖子就能快速干出來(lái)的，當(dāng)然，如果你是個(gè)天才，那請(qǐng)自便。如果和我一樣是普通人，那么請(qǐng)先做好技術(shù)方案設(shè)計(jì)。而設(shè)計(jì)的第一步，就是做一個(gè)ppt工程師，畫(huà)圖。

圖，是思想的結(jié)晶

在上面提到過(guò)的github issue活動(dòng)里，大部分同學(xué)的業(yè)務(wù)大圖或者技術(shù)架構(gòu)圖，都沒(méi)法說(shuō)明白先表達(dá)的意思。

幾個(gè)最典型的問(wèn)題是：

• 思路混亂：下面幾個(gè)框在寫(xiě)業(yè)務(wù)的系統(tǒng)，上面畫(huà)了一個(gè)vue或者webpack的框。

• 層級(jí)混亂：底層寫(xiě)的是native容器，上層畫(huà)了個(gè)api gateway。

• 答非所問(wèn)：要求畫(huà)業(yè)務(wù)大圖，結(jié)果畫(huà)了一堆前端腳手架的關(guān)鍵字，或者畫(huà)成了流程圖。

如果看到這里，不明白畫(huà)圖是干什么的同學(xué)，可以去查一下架構(gòu)圖是什么，以及如何做程序設(shè)計(jì)。這經(jīng)常是被大家忽略的事情，雖然很多同學(xué)在大學(xué)里學(xué)習(xí)的時(shí)候，都學(xué)過(guò)相關(guān)的課程，但是估計(jì)大部分都還回去了。

怎么畫(huà)好一張圖？

這里不做具體的展開(kāi)，畢竟我自己也不是畫(huà)圖高手，每次畫(huà)圖也是遲遲不知如何下筆。只給到幾個(gè)建議，供大家參考。

同時(shí)，以一個(gè)模擬面試同學(xué)的案例來(lái)做參考。

原圖：

第一步，先想明白這張圖要表達(dá)什么？

這位同學(xué)說(shuō)他參加過(guò)很多技術(shù)會(huì)議，看那些分享的ppt里面的大圖，都很酷炫，自己平時(shí)也有總結(jié)(這點(diǎn)非常好)，但是總畫(huà)不出那種圖來(lái)。面試過(guò)程中我問(wèn)了這位同學(xué)，這張圖他想表達(dá)什么，答案是他想說(shuō)明白消息通信業(yè)務(wù)的技術(shù)方案。但是，這張圖并不能表達(dá)出一個(gè)技術(shù)方案來(lái)。

這張圖第一個(gè)問(wèn)題是不夠完整，他只有一條主鏈路，對(duì)于IM這樣的復(fù)雜技術(shù)產(chǎn)品，主鏈路只是冰山一角，如果真的只做了主鏈路，那么代表思考不夠，早晚會(huì)出現(xiàn)線上故障。

第二個(gè)問(wèn)題在于含義不明與層次混亂。最下面的UI層有個(gè)箭頭指向存儲(chǔ)層，那是指渲染進(jìn)程會(huì)去調(diào)用localStorage？那再向上2級(jí)的網(wǎng)關(guān)層呢？UI層會(huì)調(diào)用網(wǎng)關(guān)層？這里顯然邏輯是不通順的。

第二步，圖里的每一個(gè)大塊必須是同一個(gè)領(lǐng)域或類似概念的，每一個(gè)框都有意義

在這個(gè)問(wèn)題上，這位同學(xué)做的還是很好的，但也還是有些小問(wèn)題，比如UI層里的兩個(gè)進(jìn)程。這兩個(gè)框顯得意義不明，在沒(méi)有描述的情況下，至少我是不明白他想表達(dá)的意思，而實(shí)際在溝通過(guò)程中，他也覺(jué)得這里挺奇怪的。

第三步，畫(huà)完回顧一下是否描述清楚了第一步里的核心邏輯

很多時(shí)候我們一氣呵成畫(huà)了一張大圖，結(jié)果一不小心容易畫(huà)成一張流程圖，把怎么寫(xiě)代碼的思路也畫(huà)到圖上了。這就會(huì)導(dǎo)致圖上有些地方是模塊劃分，而有些地方則是細(xì)節(jié)流程，整體就很失調(diào)。這只能通過(guò)反復(fù)的回顧和思考，進(jìn)行自我調(diào)整了。

最后，我給出當(dāng)時(shí)模擬面試時(shí)，對(duì)于這個(gè)業(yè)務(wù)的粗略設(shè)想：

知道原理有什么用？

有了大圖，我們終于可以開(kāi)始實(shí)現(xiàn)亮點(diǎn)了......嗎？

現(xiàn)實(shí)很殘酷，哪怕我們想出了一個(gè)大餅，并不代表我們能吃到嘴里，從圖變成面餅，我們需要太多的中間步驟。

而擺在技術(shù)人面前的問(wèn)題是：如果有面粉了，你會(huì)揉面嗎？你揉面的技術(shù)能保證烤出來(lái)的餅好吃嗎？

知其然，而后使其然

我認(rèn)為這就是為什么我們要了解原理。曾經(jīng)有一位模擬面試的同學(xué)，在最后互問(wèn)互答的時(shí)候問(wèn)了我一個(gè)問(wèn)題，怎么看待面試造火箭，平時(shí)擰螺絲？我覺(jué)得有點(diǎn)冤枉，因?yàn)橐幻娲蟛糠謫?wèn)的都是怎么擰螺絲，以及螺絲的型號(hào)，二面開(kāi)始也就問(wèn)問(wèn)怎么造飛機(jī)，但是真的進(jìn)入工作狀態(tài)，阿里的場(chǎng)景里，至少在我們團(tuán)隊(duì)的場(chǎng)景里，我們就是在造火箭，只是造火箭的時(shí)候必須要擰擰螺絲，沒(méi)螺絲你敢上？

有同學(xué)又不服了，我會(huì)擰螺絲，和我需要知道用什么螺絲有什么關(guān)系。那么上面那個(gè)烤餅，你能告訴我放白芝麻好吃還是放黑芝麻好吃嗎？我相信大廚一定能回答上來(lái)，他甚至連小麥原產(chǎn)地都會(huì)和你掰扯一下。為什么到了同樣需要匠心的編碼領(lǐng)域，我們就不用關(guān)心用什么螺絲了呢？

當(dāng)時(shí)我給這個(gè)同學(xué)舉了個(gè)實(shí)際的例子：簡(jiǎn)歷中有提到上傳，那你能不能當(dāng)場(chǎng)告訴我，這個(gè)上傳是服務(wù)端http接口配合你上傳，還是用阿里云oss？用oss是服務(wù)端每次加簽，還是用sts，還是前端直接加簽？http上傳你用什么contentType？用form表單組件提交還是自己通過(guò)xhr發(fā)送？如果需要登錄鑒權(quán)怎么辦？如果出現(xiàn)跨域問(wèn)題怎么辦？?jī)煞N場(chǎng)景都有，都要實(shí)現(xiàn)，怎么封裝組件？

什么？你說(shuō)你要百度一下？你要百度一天？那我為什么不聘用那個(gè)不用百度的人呢？一天的工資算上5金這些成本，月薪20k來(lái)算，估計(jì)也得有小2000了，如果我把這2000增加到一個(gè)懂原理的大神手里，我們豈不是雙贏，為什么要等你去搜索呢？只是個(gè)簡(jiǎn)單的上傳文件功能，也就是頁(yè)面里的一個(gè)豆腐塊，這么小的螺絲，里面卻有大大的學(xué)問(wèn)。而日常工作中我們遇到類似的問(wèn)題有非常多，具體可以參考我上一篇文章的解讀，這里就不重復(fù)了。

任務(wù)的拆解

對(duì)于平時(shí)愿意學(xué)習(xí)的同學(xué)，到這一步可能開(kāi)始陷入迷茫了，我之前也遇到過(guò)類似的困惑，那就是：要不要造輪子

我們經(jīng)常會(huì)發(fā)現(xiàn)好像什么都能做，比如：你有的，我改改也能實(shí)現(xiàn)；社區(qū)有個(gè)差不多能用的，要不要直接用；好像大圖上都有差不多的，那是不是拼拼湊湊就可以了，這個(gè)方案是不是沒(méi)什么好做的了。

從我個(gè)人來(lái)說(shuō)，每次畫(huà)圖我都會(huì)陷入這樣的思考，還常常會(huì)鉆牛角尖，為了整點(diǎn)差異化，故意換一些思路去做，這樣能保證這個(gè)餅是我的。但最后我都會(huì)繞出來(lái)，這得益于上面畫(huà)圖的第三步，每次畫(huà)完我都會(huì)重新回顧一下我真正想做的事情是什么。我認(rèn)為這也是是否造輪子的一個(gè)評(píng)判標(biāo)準(zhǔn)：從業(yè)務(wù)的價(jià)值出發(fā)，思考真正核心的目標(biāo)，并且為之努力，如果有現(xiàn)成的輪子，能滿足業(yè)務(wù)核心訴求，那就放手去用。

首先，現(xiàn)實(shí)往往是這樣的，當(dāng)我們放手去用的時(shí)候，會(huì)發(fā)現(xiàn)這個(gè)輪子好像不那么好用，或者這個(gè)輪子沒(méi)人維護(hù)了，又或者業(yè)務(wù)變化太快，輪子自己覺(jué)得頂不住了。機(jī)會(huì)自然會(huì)來(lái)到身邊，而觸發(fā)這些機(jī)會(huì)的，是我們不斷的站在業(yè)務(wù)的視角去思考問(wèn)題，業(yè)務(wù)的變化一定比一個(gè)平臺(tái)化的輪子要來(lái)得快。

其次，真正核心的系統(tǒng)一定是緊貼業(yè)務(wù)，而且很難大范圍復(fù)用的，好的技術(shù)架構(gòu)在設(shè)計(jì)的時(shí)候，講究的是夠用即可，過(guò)度設(shè)計(jì)大部分就是沒(méi)用的設(shè)計(jì)。在之后的迭代中，會(huì)隨著業(yè)務(wù)的不斷變化，被帶動(dòng)著自我進(jìn)化，那最終的產(chǎn)物也自然是和業(yè)務(wù)形態(tài)非常貼合。所以，我個(gè)人在選擇的時(shí)候，一些核心的輪子，該造就造起來(lái)，但這些輪子一定是帶有業(yè)務(wù)特色的，比如我會(huì)去造一個(gè)業(yè)務(wù)組件庫(kù)，但是我絕不會(huì)去造一個(gè)antd。

最后，隨著事物的演變，分久必合合久必分，單一業(yè)務(wù)用的好的系統(tǒng)一定是可以在更高的視角上抽象、整合的，在整個(gè)過(guò)程中，每個(gè)人的成長(zhǎng)就會(huì)是我們想要的亮點(diǎn)了?；蛟S在簡(jiǎn)歷上你寫(xiě)下的是一個(gè)已經(jīng)廢棄的系統(tǒng)，但是它的靈魂在你心里，也存在于把他整合了的系統(tǒng)里，這種亮點(diǎn)在個(gè)人介紹的時(shí)候，一定是能侃侃而談的。

從1到10能做什么？

終于，我們經(jīng)歷的各種抉擇，投入了大量的時(shí)間，把一個(gè)亮點(diǎn)做出來(lái)了，完成了美好的從0到1，可有時(shí)候我們會(huì)發(fā)現(xiàn)的問(wèn)題：從0到1看上去有很多要做的，做完了，從1到10還能做什么？

這個(gè)問(wèn)題我個(gè)人也沒(méi)有太多話語(yǔ)權(quán)，因?yàn)檫@兩年總是在做從0到1的事情，甚至和我老板也聊過(guò)這個(gè)，總感覺(jué)自己沒(méi)有個(gè)確定的事情。從0到1做一次挺爽的，一直做，不會(huì)一直爽，卻只會(huì)讓人覺(jué)得心慌，畢竟誰(shuí)能保證永遠(yuǎn)能想出從0到1的事情呢？

而靜下來(lái)反思之后，我發(fā)現(xiàn)事情并不是這么一刀切的，誰(shuí)能說(shuō)明白現(xiàn)在做的事情是0到1，還是1到10呢？這里的邊界其實(shí)并沒(méi)有那么明確，但抽象看，他們都是同一個(gè)套路

業(yè)務(wù)/技術(shù)思考 => 發(fā)現(xiàn)痛點(diǎn) => 產(chǎn)出方案 => 拆解實(shí)現(xiàn)

伴隨著這個(gè)閉環(huán)，業(yè)務(wù)永遠(yuǎn)在變化，而變化又會(huì)帶來(lái)新的問(wèn)題，只要保持一個(gè)思考的狀態(tài)，沒(méi)有必要區(qū)分具體再哪個(gè)階段，因?yàn)槟憧偰苷业娇梢詫?shí)現(xiàn)自我價(jià)值的地方，發(fā)現(xiàn)屬于你的亮點(diǎn)。

阿里巴巴淘寶技術(shù)部-躺平技術(shù)團(tuán)隊(duì)

我在阿里巴巴淘寶技術(shù)部-躺平技術(shù)團(tuán)隊(duì)。目前，躺平正在深耕家居家裝行業(yè)，縱向深入行業(yè)內(nèi)部，希望能給行業(yè)帶來(lái)一些創(chuàng)新。我們還有更多有趣、充滿挑戰(zhàn)和超出你想象的業(yè)務(wù)。

如果你愿意來(lái)和我們一起相信，那請(qǐng)發(fā)送簡(jiǎn)歷過(guò)來(lái)，我們一定會(huì)一起看見(jiàn)，一起創(chuàng)造無(wú)數(shù)的亮點(diǎn)！

前端簡(jiǎn)歷請(qǐng)發(fā)送到：[email protected] 或 [email protected] ? ? ?? ? ?

主攻3d方向的同學(xué)，簡(jiǎn)歷請(qǐng)發(fā)送到：[email protected] ?? ? ? ?

??

java簡(jiǎn)歷請(qǐng)發(fā)送到：[email protected] 或 [email protected] ? ? ?? ? ?

客戶端簡(jiǎn)歷請(qǐng)發(fā)送到：[email protected]