不知不覺一年又過去一大半,很快秋招就要開始了,最近有不少同學私信我問秋招相關的問題,今天透過這篇文章給大家講解一下,校招走前端方向,應該怎麼做準備。
眾所周知,校招分為秋招和春招,秋招會有更多的優質就業機會,好的公司會在秋招招一半以上的崗位空缺。只有大概30%左右的崗位會在春招和社招的時候補充。並且有很多同學會因為考研或者考公等因素放棄秋招,隨著考研和公考的結束,這些考試失利的人也會流入春招。所以,不論從崗位數量還是競爭壓力的角度來講,建議各位同學一定不要錯過秋招。
PS:有部分之前沒怎麼學習同學,或者是對於自己所學的專業不滿意,剛想走前端方向的同學,一定要有緊迫感,即使趕不上秋招,也一定要在春招找到一份工作,別等到社招。社招找工作的難度是要比校招高很多的。
根據自身情況的不同,我把人群分為兩部分。
第一部分:985、211科班出身,想進大廠的同學。
對於這部分同學來講,應該花更多的時間精力在計算機基礎上。大廠更多講究你的可培養潛力和計算機科學基礎,演算法、設計模式、編譯原理、微機結構、數學圖論、線代、網路基礎協議理解、工程設計思想 。不要把用過的框架羅列成自己的簡歷,因為原生能力過硬,工程思想還可以的開發者,學習框架到應用都是非常迅速的。
各大廠往年的校招面試題在網上搜一搜,都是能找到的。不難看出這些面試題都是由80%基礎知識+20%專業知識組成。基礎知識主要考量作業系統、計算機網路、計算機組成原理、資料結構與演算法等,專業知識會考量前端基礎、框架、瀏覽器原理、node。js特性、工程化實踐等。
所以,對於這部分同學,我給的建議就是,在提升程式設計能力的同時,一定不能忽視計算機基礎。可以多在leetcode、牛客網等平臺上刷題,至少一百題以上。同時,如果能在github參與一些大廠的開源專案最好。
學習的過程中也可以多找一些志同道合的人一起學習,這裡有一個WEB前端學習裙,裙檔案有我整理的學習教程、PDF書籍、面試題、簡歷模板、開發工具等。學習氛圍也很好,無論你是剛開始學習的小白,還是已經從事開發工作,在裡面都能獲得幫助,問一個問題很快就有大佬解答,我希望把它打造成一個非常好的前端圈子,以後有好的工作機會也可以互相內推,感興趣可以私信“前端”獲取入圈方式。
第二部分:普通本科專科以及非科班走前端方向的同學。
對於這部分同學來講,第一份工作想進入大廠的機率會小一些,但也不是完全沒有機會。這部分同學如果從大一開始就把成為大廠前端工程師作為目標,有在認真學習技術,一樣也是有進入大廠的。
但國內這些普通高校的學習氛圍一般,有很多同學都是臨近畢業才意識到技術的重要性,所以基本上大部分人第一份工作都是進普通的中小公司。普通中小公司,要的是能夠上手幹活的,會更看重程式設計能力以及專案經驗。所以,對於這部分同學來講,應該把大量的時間用在提升前端專業知識上,等工作之後再補計算機基礎。
普通中小公司面試主要會考量前端基礎、框架掌握情況以及專案經歷。很多面試官會問一些前端基礎問題,考察你的基礎是否紮實,然後會根據你的專案經歷提一些問題,考察你對專案中用到的技術棧掌握程度以及解決問題的能力。
最後給大家總結了一下2021年web前端的學習內容,可能內容過於多,但是從具備競爭力的角度考慮,我儘量把大前端全棧工程師要學習的內容都給大家列了出來,按照我這個標準去學,保底就業薪資在15K以上。配套的資料因為網盤連結放上來會被建議修改,可以私信我“前端”獲取全套大前端教程。
一、HTML/CSS3 部分
前端概念總覽、vscode開發工具使用、markdown文件工具使用、瀏覽器平臺環境、標籤基礎、DTD與META
語義化、選擇器、權重與優先順序、匹配規則、浮動與清除、BFC、類名組合規則、SEO前端技巧、定位、疊加技巧、
偽類、偽元素、盒子模型、程式碼規範、效能最佳化、渲染原理、CSS Sprites 、 iconfont字型圖示、佈局思路、佈局定式
css3動畫、 css3選擇器、 css3過渡、flex佈局、背景漸變、css3實用動效、3D模組、css3變數、em/rem/vw
企業內部多頁面專案實戰(非仿站)有完整PSD與切圖
二、JavaScript 部分
JavaScript概念、基礎認知、發展歷史、應用範圍、優缺點。
ECMAScript
語言概覽、語句語法、資料型別、運算子、隱式轉換、運算規則、控制流程、作用域、作用域鏈、作用域解析、js解釋引擎、字串屬性方法、for of/for in
陣列屬性方法、物件、廣義物件概念、物件特性、儲存機制、深複製、物件實際應用、工廠模式、建構函式、原型、原型鏈、原型指向、封裝、
多種繼承、包裝物件、this、this指向、js資料處理、垃圾GC、閉包原理與應用、debug方法論、瀏覽器控制檯工具應用、面向物件開發、函式式開發、
純函式、遞迴函式、回撥函式、組合函式、快取函式、柯里化函式、偏函式、函式防抖與節流、高階函式、IIFE函式、模組化、
數學物件、高階陣列方法(reduce、filter、map、every、some、forEach、find、findIndex、include)等、
高階物件方法(entires、defineProperty、freeze、fromEntries、assign、keys、create、hasOwnProperty)等
this透過bind、call、apply指向偏移、同步與非同步、閉包模組化、資料形變處理、效能處理
DOM/BOM
DOM物件與方法、節點與遍歷樹、DOM選擇器、DOM節點增刪改查、DOM樣式操作、DOM位置獲取與偏移、DOM物件與標籤區別、DOM虛擬化、DOM事件、
Event物件、定時器與監聽器、事件委託、事件代理、事件分流、事件冒泡、預設行為、事件捕獲、防抖、節流、滾動、鍵盤行為、事件降頻、行為鎖機制、
拖拽模組、碰撞檢測、距離判斷、三角函式、方向判斷、運動框架、彈性運動、重力加速度、DOM樹、CSSOM樹、渲染解析、載入、迴流、重繪、瀏覽器執行緒與阻塞。
BOM深入、window物件、navigator、history、screen、location、spa概念、本地傳參、日期物件使用、日期格式化封裝、隨機封裝、DOM分片容器
JS業務應用擴充套件
JSON物件、資料解析、JSON方法、模板渲染、快取懶載入、正則表示式RegExp、元字元、修飾符、正向預查、貪婪模式、replace方法、分組與不分組、test、match與exec
正則庫封裝、表單校驗、圖片預存懶載入、自定義封裝滾動元件、多重輪播(迴圈、視差、旋轉木馬)、選項卡切換、樓梯導航、吸頂導航、拖拽導航 、
JavaScript編碼風格指南、console應用技巧
ECMAScript5 --- ECMAScript9擴充套件
版本解讀、應用環境、let、const、解構賦值、箭頭函式、物件解構、reset引數解構、class、set、get、extends、super、static、private實現、symbol、promise、proxy代理攔截、async/await
物件新增API、陣列新增API、字串新增API、原型屬性、物件修飾、代理攔截、鏈式詢問、空值合併運算子、泡泡龍面向物件遊戲開發
三、HTML5 / 移動端開發 部分
HTML5標籤與API
HTML5概念、定義、新增特性、DTD對比、新增H5標籤、新增語義化H5標籤、H5表單
H5拖拽事件 video、audio、fullScreen、FileReader檔案流、Blob物件、sessionStorage、localStorage、
網路狀態、頁面生命週期、網頁狀態監聽、地理資訊與定位、canvas畫布、worker多執行緒、Notifications桌面通知
播放器開發 canvas互動特效開發
移動端適配/事件
移動端適配概念、尺寸與解析度原理、PPI與DPI計算、DIP與DPR裝置畫素概念、視口viewport概念、佈局視口、視覺視口、理想視口
視口適配方案(Meta viewport)縮放設定 、screen視窗大小API、媒體查詢@media、rem適配、vw vh適配
移動端適配方案、flexible rem方案、 vh vw方案 、複合方案、高畫質適配方案、移動端字型縮放解決、1px邊框問題解決、半畫素線
圖片高畫質適配、image-set、srcset、js拼接URL技巧、IPhonex劉海屏適配、安全區域、fit與env
Meta許可權管理、相容最佳化、IOS頭部底部閃屏回退輸入框問題、輸入法空格問題、預設首字母大寫問題、滑動卡頓問題等
終端樣式美化與訪問判斷
Touch事件組封裝、click延遲處理、FastClick使用、禁用縮放設定理想視口
常用類庫/工具
jquery: 元素選擇、增刪改差、事件處理、位置獲取、動畫過渡、高階方法、特效應用
zepto:移動端的jquery、DOM操作、移動端事件、click延遲處理、touch事件組
基礎UI庫: layerUI 、easyUI、bootStrap、UI模組化、UI庫使用技巧、文件解讀、案例除錯、表單系統
iScroll、touchjs等移動端事件庫使用
swiper:移動端網站觸控滑動、輪播圖外掛、模組化應用、原始碼解讀
art-template: 模板引擎 模板語法、渲染方法、原生模板引擎實現
CSS預處理:sass、less使用 stylus深入學習 、預處理語法、css程式設計、 Minxin 、預處理函式、繼承、巢狀
vscode高階外掛與配置 liveserver sass
模板化應用 、預處理應用
date-picker移動端原生元件開發
需求分析、業務規則、技術棧選型、檔案輸出規則、技術分析
MVC模型概念與設計、業務邏輯分類
view層適配方案 原型佈局搭建 模板化生成
工具函式開發、面向物件式業務設計 功能類日期物件開發
互動業務封裝 模組對接 最佳化設計 面向物件高階程式設計
四、Nodejs與工程化開發 部分
Node原生基礎
Node基礎概念、NPM命令、V8引擎概念、JavaScript模組化 CMD AMD UMD、EventLoop事件迴圈、同步非同步、 阻塞非阻塞 、任務佇列、宏任務、微任務、
原生Node模組、核心模組與require、module、觸發器events與path模組、fs模組、Buffer物件、URL模組、HTTP模組 、stream流
Node原生封裝HTTP與檔案伺服器
Node框架
express框架使用、中介軟體、核心物件、路由配置、模板引擎、資料指令碼、Router核心、CORS配置、錯誤處理、校驗封裝、PM2管理、nodemoon管理
MORGAN日誌處理、查詢正則捕獲、中介軟體開發、bodyParse等第三方中介軟體使用 、檔案流上傳下載、檔案流切分
webpack工程化構建
工程化概念、工程化工具介紹、webpack基礎知識、webpack配置與執行、plugin外掛、loader使用、入口出口配置、模組modules、依賴處理、dev Server
target 、檔案切分、build打包、熱處理、package管理、效能最佳化、測試處理 、第三方外掛使用、babel等
前後端資料互動
HTTP通訊互動原理、請求響應、MIME、URI地址、報文解析、埠、報文流、測試監聽抓包、TCP/IP握手機制、網路業務模型
代理、快取、閘道器、隧道等概念、method與請求頭分類
基礎XMLHTTPRequest物件方法屬性、方法、ajax非同步互動 、同源策略原理
原生js封裝ajax互動、 jquery的ajax封裝互動、jsonp跨域處理、cors跨域處理、攜帶cookie與跨域處理、代理伺服器跨域處理、
cookie驗證與通訊 、axios庫的使用 代理、封裝、攔截、合併、二次封裝
通訊加密策略、資料對稱加密、資料非對稱加密、RSA加密實踐、MD5加密實踐
登入註冊與鑑權機制、Authenticity認證、Token認證、JWT認證、session狀態管理、 oauth認證
RESTful介面設計
RESTful設計原則、狀態碼設計與規範、伺服器響應規則與格式、前後端介面協議制定、傳統RESTful改進
API設計規範、 資源定位、JSON模式、合約說明、資源識別符號、快取友好API、HTTP頭管理、文件定義、松耦合原則、一致性、重用、穩定性原則
資料庫儲存
MongoDB基礎概念、NoSQL與SQL、CAP定理、RDBMS、MongoDB語法、指令、監控與GUI、MongoDb驅動、Mongoose應用
資料庫建立、集合增刪改查、文件增刪改查、資料庫查詢、高階查詢操作、通道查詢、多條件查詢、反向篩選、索引處理、aggregate聚合管道、
validation驗證、population聯表、middleware中介軟體處理、查詢ERROR類二次封裝
部落格後臺專案實戰
資料庫設計、服務端路由搭建、介面設計與API管理、通訊互動管道封裝、註冊登入、路由導航、前端路由管理、許可權管理、使用者管理、分類管理、標籤管理
、文章管理、模組化功能封裝、校驗庫封裝、promise鏈式行為封裝、
非同步模組處理、SPA單頁面應用初級實現、原生集中行為控制器、模板化+模組化+預處理+工程化實現前端頁面
元件化封裝
元件化基礎概念、元件設計原則、元件封裝、元件耦合與解耦、工程化+模板化+模組化實現原生元件化功能、
五、Vue框架部分
vue基礎
vue開發準備、工具與外掛、mvc mvp mvvm設計理念、原生js實現MVVM核心框架、vue設計模式、生命週期、命令與屬性、元件化
資料驅動與雙向繫結、虛擬DOM概念原理、模板語法、條件與列表、陣列監測、計算屬性、事件處理、修飾與表單、監聽器、過濾器、
methods watch computed filter對比、元件化開發、動態元件、元件通訊、高階元件通訊、插槽、vue動畫 、例項物件、set、get、nextTick、vue外掛
vue工程化
Babel、webpack配置vue、vue單檔案元件、vue-cli、工程平臺處理、postCss、animate、core、socket、lodash工具、vue-cli外掛、preset、靜態資源處理、
環境變數與膜還是切換、工程化部署、工程構建
vue Router
vue路由概念、巢狀路由、路由檢視、動態路由、路由匹配、程式設計式導航、history、hash模式管理、命名檢視、重定向與別名、導航守衛、路由元資訊、滾動與懶載入、導航故障處理
vuex
vuex核心概念、EventBus對比、狀態管理模式、Store、state、getter、mutation、action、moudule
vuex輔助函式與API功能、vuex環境選擇、vuex模組化處理規則與技巧、物件風格提交方式、模組重用等
vue專案實戰
vue部落格專案實戰 PC + 移動端、 elementUI、vantUI、websocket聊天室、虛擬人偶、vueScroll、store、qs、nprogress、editor、
文章分類、詞雲效果、spa單頁面應用、移動PC無縫切換、完整註冊登入、vue加密鑑權、http封裝管理、錯誤處理封裝、vuex核心狀態管理、本地儲存狀態更新、令牌處理、
文章富文字編輯、點贊、收藏、訪問、評論、元件封裝、元件複用、元件混合、高階元件開發、複合性元件通訊、vue中處理原生DOM行為、vue常見錯誤處理、
重置vue資料響應、個人資訊修改、頭像上傳、通知元件封裝、postcss應用、專案打包最佳化