雲棲君導讀：7月19日晚舉行了一場前端課程直播活動，主講人為阿里雲前端工程師行劍和閒魚前端技術負責人青頁，本文為該場課程的內容回顧。

課程一：《新人前端如何快速成長》

分享人：行劍，阿里雲高階前端開發工程師

分享主要包含三個方面的內容:

•    個人經歷及成長

•    阿里雲前端技術

•    交流互動

行劍個人成長經歷：本科通訊，研究生專業是航海，其實專業不是計算機專業並不是很重要，其他專業反而會成為你的加分項。

14年開始接觸前端 ，阿里雲深度使用者，16年阿里雲校招實習，17年7月正式入職。

第一部分：個人經歷及成長

很多同學都很關心校招的事情，下面我和大家談談我的理解：

01

基礎知識

1、計算機基礎知識。編譯原理、網路。看似基礎，在工作中並不一定會使用，但是往深層次的發展就會用到。

2、 行業基礎知識。前端行業，語言層。三大件：html 、css 、js。再往上就要了解這個行業的共識，我們現在認為的工程化的方法，前端行業的框架。

02

實踐

只有基礎知識，沒有實踐的話，你就是不知道你所學的知識哪個輕哪個重，和實際中踩的哪些坑。團隊篩選簡歷也是對實踐相當重視。

03

關注事物的本質並思考學習

前端行業變化特別快，時時刻刻都有新的東西出現。要關注事物的本質，比如說使用者互動，和狀態之間的管理和控制。

04

溝通能力

校招是五輪面試，這五輪面試官都有在考核你的溝通能力，在日常開發中溝通還是很重要的。在學校中可以組織開發小組，其中可以扮演各種角色來溝通。

在阿里面試，很多時候是電話面試，這時候就很考驗溝通能力，溝通能力也是面試官重點考察的一個方面。

如果你校招順利的拿到了offer，那麼你就進入了阿里的實習階段：

在不同公司實習，其實在本質上，也有很多相似的東西。

1、學習、思考、總結：

這就是說你實習的時候要給你的團隊展現出你不斷的學習能力，前端本來是一個不斷變化的行業，不斷學習也是非常重要的。

其實來到阿里，對於一個技術來講是一個非常幸福的事情。因為你會覺得你一下子掉到了一個技術的海洋裡，有非常非常多的學習資料，還有可以跟師兄們交流學習，有很多學習的途徑，我大概說兩點學習途徑：

內部學習平臺，阿里內部有一個我們自己的學習平臺，雲棲社群，這個學習平臺會有非常多的學習資料，每天都有人更新，他在專案裡的一些總結，一些新技術的研究，還有一些技術之間互相的影響，這些都會放到這個學習平臺，進來阿里實習，這個平臺肯定會接觸的。很多內部的文章很多都會通過雲棲社群的小二，發到雲棲社群裡。

2、做前端技術很重要的是原始碼學習，剛開始可能看不懂，慢慢就會熟悉了。實習中也要注意溝通，技術是最好的溝通橋樑，增強和同事的互動。

如果你順利的結束實習期答辯，那你來年畢業之後就可以正式入職：

實習時的需求和入職時的需求還是有很大的差異的，要考慮到產品的上游和下游，是思路的轉變，從點到線；要持續學習，實踐，思考，總結，在過去一年提升了抗壓能力，最重要的是心態，要和老闆溝通，排解壓力，不要害羞。

第二部分：阿里雲前端技術 

資料狀態管理的本質是：為UI獲取遠端資料 +本地狀態管理。

資料狀態管理：

這是我們團隊自己研發的一個Mota新專案：

Mota

定義資料模型（Model）的方式是一個簡單物件，之後還可以複用：

輸入雙向繫結：

 現在和大家聊聊工程化：

•       基於任務執行的工具gulp、grunt（開發，自動化編排，打包）

•       打包工具webpack，rollup.js（轉換，打包）

•       vue-cli、angular-cli、create-react-app（初始化，整合ts或webpack進行打包）

•       整合型工具Yeoman（自動生成工具，gulp，包管理），FIS，Fekit等。

我們覺得FIS、Fekit有一些思考的哲學和我們稍微有點不一樣，所以在團隊中使用並且開源了一個Dawn的前端工程化解決方案，可以瞭解一下：

現在來解釋一下問什麼會有這個Dawn

Dawn-標準化工程構建流程

Dawn-阿里雲工程化方案

基於pipeline&middleware

總體來說Dawn：

•       簡單、統一、一致，無論擴充套件還是使用它

•       無關框架、無關語言

•       輕中心化

•       鬆散且易於整合，注重重用，易於擴充套件

•       雲端統一下發構建規則，易團隊統一管理

•       免於安裝或更新，除 CLI 外，無須其它任何形式的安裝和更新操作

給這場直播做個整體總結：

1.持續學習，學習問題的本質

2.選擇好的學習平臺

Q&A

問：在阿里有多少的自主學習時間？

答：要看自己張弛的度，加班是對的，不加班也是對的，但工作完不成是不對的，看需求的多少。

問：校招面試和實習面試的區別？

答：實習是3、4月份，6789面向的是校招的，一般情況下實習的比較多，但是沒招滿的話校招這個渠道還是有的。

問：前端的話最推薦先學習什麼框架？

答：安利團隊的框架，從這個框架入手是不會有錯的，是比較傳統的面向機制，上手快。

問：實習的時候出現BUG總是第一個被@，心態爆炸怎麼辦？

答：這個狀態都會有，網際網路現在很快，大家都是就事論事，快速找出BUG來源於哪裡

問：資料視覺化在阿里雲前端工作的比重有多大？

答：其實阿里雲團隊大概有一百多人，每個團隊專攻的方面不一樣，每個團隊比例都不一樣

問：對新人而言，如何平衡廣度和深度的學習？

答：最近我也參加阿里晉升的面試，就遇到了這個問題，不同的階段解決不同的問題。如果現階段是解決業務問題，就要先進行廣度學習，當這個平臺不能滿足需求的時候，那就要進行深度的學習。

最後，如果您對阿里雲前端開發職位感興趣，請投遞簡歷到[email protected]

職位需求詳見：

https://yq.aliyun.com/articles/613815

課程二：新的技術環境下前端面臨的挑戰和機遇

分享人：青頁，阿里巴巴技術專家，閒魚前端技術負責人。

本節課程主要講解在創業公司做前端的工作經驗，業務和前端基礎架構。

第一部分：個人經歷介紹

在創業公司我主要帶業務支援的團隊，我也做過前端偏基礎架構的事項，以我的工作經歷來講，前端這個部門在很多技術的深度上和業務上，是有深度去鑽研的。

我現在負責的是整個閒魚前端團隊，創業公司和阿里最大的不同。在創業公司很多情況下都是完成任務，而在阿里則是發現問題。把一些需求任務，拆成問題，然後解決問題。比如說，我們運營需要大量的頁面，通常使用人力去堆疊，這會出現人力上限的問題，這個時候我們會針對這個問題，提供一個系統，我們會抽象出一整塊的模式的搭建，讓運營去解決這個問題。

第二部分：前端基礎架構

我們一起來看一下在前端這個變化特別快的行業，我總結了四個階段，這四個階段分別為zepto、單頁應用、端融合、智慧化。

我們現在可以基於PNG的檢視，就可以轉化成一個程式碼，在這個圖上來看，我們已經可以很成熟的可以百分百還原整個個設計稿的展示模式。

接下來，我們看整體結構，我把整個結構分為以下幾個部分。

Q&A

問：技術上沒辦法實現的UI需求？

答：可能有些設計師在某個階段生產出來的產物，跟技術的產物會有比較大的區別，我會跟設計師溝通。假如說這個實現是有問題的，給他我另外一個方案，我們會有一個基礎的達成。

問：對於陳舊，維護性較差的專案，除了推倒重構外，是否還有更好的方案？

答：你覺得現在你成就的這個專案，你不滿意的需求在什麼地方，他的結構化設計不合理，他可能是一個前端應用化的框架，他有一定的差距，這個團隊是否需要將應用應用化，如果在當前的工作中是非常重要的點，那可以投入資源，如果不是很重要，而且收益不是可見的話，去組建層的處理，讓整個專案變為容易維護的階段。

問：閒魚有用到weex嗎？weex中圖片上傳在android中記憶體消耗過大，請問您們有進行優化嗎？

答：閒魚前端現在整體的架構都是在weex基礎上的，我們現在在weex圖片的上傳過程中還沒有遇到像安卓記憶體消耗過大的問題，在外部開源中可能還沒優化到，如果圖片上傳過大的話，可能上傳之前圖片就比較大，這個時候就可以去做一些封片的優化啊。

問：通過工具生成的程式碼怎麼保證可維護性呢，會不會產出的程式碼後期很難維護？

答：我們希望生成的程式碼，可能要比手寫的程式碼實現要更標準，它的實現可能也更優雅，因為機器是相對固定的生成模式，我們整個UI層到處的程式碼會是相對固定的標準，這樣UI的部分他是統一的，一定程度上講，機器生成的程式碼確實比手寫的好，可能會對UI生成的程式碼有一定的改動。

問：技術選型時，主要考慮哪些因素

答：首先看你團隊的能力是什麼樣子的，可能你整個團隊在技術上可能比較擅長react或者vue，這個因素可能是較多的考慮的因素。

第二就是你接下來要面臨的問題，比方說vue語法能力更強一些，像react單向能力更強一些，包括他的生態，vue會漸漸增強，而react像是全家桶一樣的，我想我整個後期靈活性更強一些，我就回去選擇vue，如果想快速的把整個應用搭建出來，我就會去選擇react。

最後，如果您對閒魚前端開發職位感興趣，請投遞簡歷到[email protected]

職位需求詳見（點選閱讀原文檢視）：

https://yq.aliyun.com/articles/613815