網(wǎng)易前端工程師分享課程

第一場(chǎng)：前端成長(zhǎng)之路

1. 前端級(jí)別 // 來(lái)自網(wǎng)易公司的級(jí)別
   • 前端開發(fā)工程師
   • 高級(jí)前端開發(fā)工程師
   • 資深前端開發(fā)工程師
   • 前端技術(shù)專家
2. 從0 -> 前端開發(fā)工程師
   學(xué)習(xí)時(shí)學(xué)習(xí)的知識(shí)知識(shí)點(diǎn)吠各，而開發(fā)時(shí)時(shí)要實(shí)現(xiàn)復(fù)雜業(yè)務(wù)需求，有時(shí)感到難以下手

選擇合適知識(shí)點(diǎn)挂疆，組和應(yīng)用實(shí)現(xiàn)復(fù)雜業(yè)務(wù)需求
做法：把前端開發(fā)分解為頁(yè)面制作和頁(yè)面邏輯耻警，分開編碼

頁(yè)面制作過(guò)程：

• 把頁(yè)面分解成模塊派近，模塊在細(xì)分細(xì)分到可以使用基礎(chǔ)知識(shí)來(lái)實(shí)現(xiàn)的傳給你都
• 把細(xì)分模塊組裝起來(lái)涧郊，最后對(duì)所有模塊布局

頁(yè)面邏輯處理：(流程分解)

• 把邏輯分解成一個(gè)一個(gè)的流程
• 對(duì)每個(gè)過(guò)程編碼飒泻、測(cè)試钾虐，最后對(duì)整個(gè)流程測(cè)試

3. 網(wǎng)易杭研究院前端架構(gòu)師工作職責(zé)

• 分析和評(píng)估
• 制定規(guī)范協(xié)助實(shí)施
• 技術(shù)的選型和培訓(xùn)
• 任務(wù)分解和分配
• 架構(gòu)設(shè)計(jì)
• 代碼開發(fā)
• 打包與發(fā)布
• 資訊協(xié)助
• 技術(shù)推進(jìn)

第二場(chǎng)：如何準(zhǔn)備一場(chǎng)前端技術(shù)面試

1. 簡(jiǎn)歷

• 技術(shù)能力
  • 體現(xiàn)廣度噪窘，基礎(chǔ)、框架效扫、前沿
• 研究總結(jié)
  • 體現(xiàn)學(xué)習(xí)能力倔监、總結(jié)能力、興趣(關(guān)注的社區(qū)菌仁、公眾號(hào)浩习、大牛)
• 項(xiàng)目經(jīng)驗(yàn)
  • 體現(xiàn)工程和業(yè)務(wù)復(fù)雜度，自己在項(xiàng)目里做了些什么
  • 體現(xiàn)架構(gòu)济丘、方案設(shè)計(jì)谱秽、解決問(wèn)題的能力

2. 筆試
   多關(guān)注基礎(chǔ)內(nèi)容
3. 技術(shù)面試

• 基本技能
  • css
    • 選擇器 (有哪些及應(yīng)用場(chǎng)景)
    • 盒模型 (box-size等)
    • 布局
  • js
    • 類型
    • 數(shù)組、函數(shù)
    • 作用域
    • 閉包
    • 繼承摹迷、封裝
  • DOM
    • 節(jié)點(diǎn)操作
    • 事件
    • Ajax
  • 前沿
    • css3
    • HTML5
    • ES6
    • 新型熱門框架
  • 綜合應(yīng)用
    • 自適應(yīng)布局的多種方案: float疟赊、BFC、 FLEX峡碉、........
    • bind(): 原型近哟、閉包、this鲫寄、arguments吉执、array疯淫、apply、.......
    • 事件代理 ： 添加事件戳玫、事件階段熙掺、事件對(duì)象、節(jié)點(diǎn)屬性量九、封裝适掰、....
    • 組件實(shí)現(xiàn)： 封裝、繼承荠列、DOM
• 方案經(jīng)驗(yàn)
  • 架構(gòu)类浪、選型
  • 解決方案
  • 流程、規(guī)范
  • 難度 (面試分層)
    • 事件代理
      • 如何添加事件肌似、三階段
      • 實(shí)現(xiàn)一個(gè)列表項(xiàng)操作的事件代理 (可能手寫代碼)
      • 封裝事件代理
• 簡(jiǎn)歷內(nèi)容
  • 證實(shí)费就。證實(shí)你是否真的擁有技能
  • 深度。了解技能深度
• 校招與社招
  • 校招：基礎(chǔ)川队、潛力(軟技能)
  • 社招： 基礎(chǔ)力细、經(jīng)驗(yàn)
• 一些建議
  • 前端基礎(chǔ)排第一位
  • 志愿倒序，從面試中找不足固额。讓面試官給意見眠蚂，最想進(jìn)的公司最后在面
  • 強(qiáng)化手寫能力。面試時(shí)手寫代碼
  • 細(xì)節(jié)和深度斗躏。特別是基礎(chǔ)的和在簡(jiǎn)歷里提到的東西

第三場(chǎng)： 我的網(wǎng)易十年前端路

學(xué)習(xí)篇

1. 基礎(chǔ)

   • 計(jì)算機(jī)基礎(chǔ)知識(shí)
     • 數(shù)據(jù)結(jié)構(gòu)/算法
     • 程序設(shè)計(jì)/網(wǎng)絡(luò)協(xié)議
     • 編譯/操作系統(tǒng)/數(shù)據(jù)庫(kù)
     • 模式/架構(gòu)/工程/安全
   • 專業(yè)基礎(chǔ)
     • css
     • HTML
     • javascript
   • 學(xué)習(xí)方式
     • 書籍逝慧。多看正版
     • 代碼。 理解啄糙、補(bǔ)漏笛臣、啟示。 從學(xué)習(xí)到應(yīng)用隧饼∩虮ぃ看哪些代碼：書籍里的、前輩的燕雁、論壇里诞丽、網(wǎng)站的、開源代碼贵白、自己的率拒。針對(duì)某個(gè)功能做切入看源碼
     • 標(biāo)準(zhǔn)
       • 行業(yè)標(biāo)準(zhǔn)。前端通用標(biāo)準(zhǔn)禁荒。ecma(js核心標(biāo)準(zhǔn)), w3c(html猬膨，css，dom等標(biāo)準(zhǔn)), ietf(主要定義http相關(guān)的協(xié)議)
       • 廠商標(biāo)準(zhǔn)

2. 實(shí)踐篇

• 問(wèn)題(以問(wèn)題為主線)
  • 發(fā)現(xiàn)： 功能需求、非功能需求勃痴、疑問(wèn)建議抱怨
  • 分析：分析問(wèn)題的本質(zhì)谒所，給出多個(gè)解決方案平衡利弊決定最后使用啥方案
  • 解決
  • 沉淀： 把解決方案納入自己的知識(shí)體系

3. 進(jìn)階篇

• 個(gè)人
  • 深度： 表象 -> 原理 -> 實(shí)現(xiàn)
  • 廣度
    • 專業(yè)技能： 覆蓋面、了解度沛申、標(biāo)準(zhǔn)/框架/工具/工程
    • 領(lǐng)域范圍： 移動(dòng)端劣领、桌面端、產(chǎn)品铁材、后端尖淘、測(cè)試
• 團(tuán)隊(duì)
  • 流程
  • 協(xié)作
  • 效率
    網(wǎng)易實(shí)踐協(xié)作體系：NEI
    suggest attitude is everthing and never stop learning

第四場(chǎng)：聽說(shuō)你想當(dāng)個(gè)前端開發(fā)工程師

1. 工作職責(zé)

   • 項(xiàng)目前期：分析、評(píng)估著觉、規(guī)范(工程結(jié)構(gòu)村生、編碼規(guī)范、產(chǎn)出文檔饼丘、流程規(guī)范)趁桃、選型(框架、庫(kù)肄鸽、工具)卫病、培訓(xùn)(對(duì)不熟悉的人做培訓(xùn))
   • 項(xiàng)目中期：分解(子系統(tǒng)、模塊典徘、功能邊界)蟀苛、分配(時(shí)間與人員)、設(shè)計(jì)(系統(tǒng)模塊的詳細(xì)設(shè)計(jì)逮诲，接口規(guī)范定義等文檔)屹逛、編碼、測(cè)試(自測(cè)汛骂、詳細(xì)測(cè)試)、發(fā)布(方案與工具)
   • 項(xiàng)目后期： 迭代评腺、升級(jí)帘瞭、維護(hù) 三個(gè)階段循環(huán)進(jìn)行

2. 核心能力

   • 專業(yè)技能： css(選擇器，布局蒿讥，盒模型)蝶念、DOM(樹、事件芋绸、存儲(chǔ)媒殉、消息、網(wǎng)絡(luò))摔敛、js(類型廷蓉、原型/原型鏈、作用域马昙、面向?qū)ο?桃犬、前沿(css3,ES6,H5,編程模式)刹悴、綜合
   • 通用技能： 數(shù)據(jù)結(jié)構(gòu)(哈希、堆棧攒暇、數(shù)組土匀、隊(duì)列、樹形形用、字符)就轧、算法分析(加密算法、空間復(fù)雜度田度、排序算法妒御、搜索算法、時(shí)間復(fù)雜度)每币、網(wǎng)絡(luò)協(xié)議(EventSource携丁、webSocket、RTMPHLS兰怠、webRTC梦鉴、http、https)揭保、編程范式(面向過(guò)程肥橙、面向?qū)ο蟆⒚嫦蚯忻娼章隆⒒谠痛娣ぁ⒒陬?、設(shè)計(jì)模式(創(chuàng)建模式味榛、架構(gòu)模式椭坚、結(jié)構(gòu)模式、行為模式搏色、并發(fā)模式)善茎、軟件工程(自動(dòng)化、規(guī)范频轿、流程垂涯、工程化、標(biāo)準(zhǔn))
   • 其他技能：學(xué)習(xí)航邢、分析耕赘、解決、創(chuàng)新膳殷、總結(jié)
     問(wèn)題（發(fā)現(xiàn)操骡、分析、解決、沉淀）

3. 應(yīng)聘準(zhǔn)備

   • 簡(jiǎn)歷： 技能当娱、工作吃既、項(xiàng)目
     • 簡(jiǎn)歷內(nèi)容：基本信息、能體現(xiàn)自己能力的東西跨细、工作經(jīng)驗(yàn)鹦倚、項(xiàng)目經(jīng)驗(yàn)、從工作經(jīng)驗(yàn)或者項(xiàng)目經(jīng)驗(yàn)中收獲的知識(shí)能力等方面的成長(zhǎng)
   • 筆試： 基礎(chǔ)知識(shí)
   • 面試： 專業(yè)冀惭、能力震叙、經(jīng)驗(yàn)
     • 面試內(nèi)容： 專業(yè)技能、通用技能散休、學(xué)習(xí)能力媒楼、問(wèn)題解決能力、多提問(wèn)了解面試官對(duì)這個(gè)問(wèn)題的看法
   • 校招與社招
     • 校招：基礎(chǔ)戚丸、潛力(軟技能)
     • 社招： 基礎(chǔ)划址、經(jīng)驗(yàn)

4. 資料推薦
   ECMA,
   IETF,
   w3c
   電子書：共享電子書, 免費(fèi)電子書, 搜索電子書格式： keyword filetype:pdf site:x.y.com filetype為文件類型，site表示來(lái)自哪個(gè)網(wǎng)站