新手學web前端應該學什麼？

隨着互聯網的發展速度迅猛，web前端工程師愈來愈火熱，想學習Web前端開發嗎 ? 若想成爲web前端工程師須要掌握哪些知識？今天小編總結了成爲web前端工程師須要掌握的全部知識。

1、基礎

一、H5標籤

1.一、H5引進的一些新的標籤，須要注意article、header、footer、aside、nav以及HTML的標題結構

1.二、理解瀏覽器解析HTML的過程，理解DOM的樹形結構，及相應API

1.三、理解HTML標籤在各個瀏覽器上的默認樣式（代理樣式），理解CSS中的重置樣式表的概念

1.四、理解Canvas、SVG、video等功能性標籤

1.五、理解form、iframe標籤，理解文件提交過程

二、CSS知識

2.一、學習基礎知識，包括大部分經常使用屬性、選擇器的用法，瞭解大多數標籤基本概念

學習瀏覽器兼容性問題，知道兼容性的主要問題及解決方法

2.二、深刻理解盒子模型，區分塊級元素、行內元素，一些重要的屬性： display、float、position，必需要會區分盒子、行內盒子的概念

還能夠學一些簡單的預編譯語言：sass、less

2.三、學習經常使用框架，可使用bootstrap構建項目

2.四、學習框架的代碼組織方式

包括：12格柵系統、組件化、組件的風格化等

2.五、學習CSS 3的新功能，特別是動畫效果、選擇器

2.六、學習一些CSS對象化思想，學習編寫簡潔性、高複用性、高健壯性的CSS

2.七、能夠看看扁平化設計，還有簡潔性

2.八、理解CSSOM、render、reflow、CSS性能、CSS阻塞概念

學習方法：

多看別人的代碼，優秀的設計網站

要學會使用grunt、gulp壓縮CSS

display + position + float 能夠組合出很複雜的效果，多練習盒子模型

嘗試在不用float，且position不爲absolute的狀況下實現等高、等寬等佈局

三、深刻學習javascript

3.一、從新學習JS語法，注意：表達式、語句、類型

主要傾向於「原生」JS哦，不要使用框架

3.二、深刻理解JS的「一級函數」、對象、類的概念

學會使用函數來構造類、閉包，學會用面向對象的方式組織代碼

3.三、深刻理解JS的做用域、做用域鏈、this對象

理解函數的各類調用方法（call、apply、bind等）

3.四、理解對象、數組的概念

理解對象的「[]」調用，理解對象是一種「特殊數組」

理解for語句的用法

深刻理解JS中原始值、包裝對象的概念（重要）

3.五、學習一些經常使用框架的使用方法，包括：JQUERY、underscore、EXTJS，更高級的：backbone、angularjs、ejs、jade比較多個框架的使用方法，總結常見用法，提升學習速度學習模塊化開發（使用require.js、sea.js等）

3.六、適當看一些著名框架的源碼，好比jQuery重要的是學習框架中代碼的組織形式，即設計模式

3.七、瞭解JS解釋、運行過程，理解JS的單線程概念

深刻理解JS事件、異步、阻塞概念

3.八、理解瀏覽器組成部件，理解V8的概念

學習V8的解釋-運行過程

在V8基礎上，學會如何提升JS性能

學會使用chrome的profile進行內存泄露分析

學習方法：

提升對本身的要求

多看優秀框架的源碼，特別是框架的架構模式、設計模式

多學設計模式

學習原生JS、DOM、BOM、Ajax

四、跨終端

理解混合APP的概念

理解網頁在各種終端上的表現

理解網頁與原生app的區同，重在約束

理解單頁網站，特別要規避頁面的內存泄露問題

入門nodejs，對其有個基礎概念

五、工具 

學會使用grunt進行JS、CSS、HTML 壓縮，特別是模塊化js開發時候的壓縮

會用PS進行切圖、保存icon

入手sublime、webstorm

學會使用chrome調試面板，特別是：console、network、profile、element

2、進階：

一、性能

1.一、理解資源加載的過程

包括：TCP握手鍊接、HTTP請求報文、HTTP回覆報文

1.二、理解資源加載的性能約束，包括：TCP鏈接限制、TCP慢啓動

1.三、理解CSS文件、JS文件壓縮，理解不一樣文件放在頁面不一樣位置後對性能的影響

1.四、理解CDN加速

1.五、學會使用HTTP頭控制資源緩存，理解cache-control、expire、max-age、ETag對緩存的影響

1.六、深刻理解瀏覽器的render過程

二、http及TCP協議族

2.一、學習http協議，理解http請求-響應模式

2.二、理解http是應用層協議，它是構建在TCP/IP協議上的

2.三、理解http報文（請求-響應報文）

2.四、理解http代理、緩存、網關等概念，指定如何控制緩存

2.五、理解http協議內容，包括：狀態碼、http頭、長鏈接（http1.1）

2.六、學習http服務器的工做模型，對靜態文件、CGI、DHTML的處理流程有個大體概念

三、安全性

XSS、SQL注入

學web前端的內容不少，不少新手在自學過程當中遇到問題沒有人指導就很容易迷失，時間久了就會失去信心，心灰意冷容易放棄。所以，選擇一家靠譜的培訓機構不只有系統的學習機制，還有學習範圍，更有項目實戰彌補新人經驗的不足，以避免就業難。學web前端選擇知海匠庫讓你成爲一名優秀的程序員！知海匠庫是海南生態軟件園惟一受權的互聯網人才實訓基地，大量項目實戰讓學員掌握真實技能，特點項目路演，讓學員瞭解參與項目組搭建到項目完成的整個項目流程，讓你畢業就有項目經驗，從容應對應聘和就業。