WEB前端入門知識及要點大全

不少新手朋友剛接觸前端，不知道從哪裏下手，今天就跟你們分享web前端入門知識及要點大全，但願對你們有幫助！

1、WEB前端是什麼？

使用HTML/CSS/JS以及更多的框架技術，編寫網站頁面、App應用、小程序、2D&3D遊戲、Web VR&AR等應用，經過內容設計、交互動畫、數據操做構建項目與用戶的交互界面。前端開發工程師在項目中能夠與UI設計師和後臺程序員合做，實現設計意圖並調用後臺接口；也能夠獨立工做，完成強用戶交互的各種應用。

2、WEB前端能夠作什麼？

最經典的是各類類型的網站：電子商務、企業門戶、管理系統、社區平臺等；目前也是移動領域首選技術：WebApp、混編App、手機遊戲、微信公衆號、微信小程序等；前端前沿的應用領域還有：數據可視化、3D建模和渲染、WebVR、WebAR等。

3、WEB前端知識體系包括哪些內容？

前端基礎知識：HTML五、CSS三、JavaScript/ECMAScript；前端核心技術：BOM&DOM、jQuery、HTTP、AJAX；前端高階內容：H5高級、響應式佈局、Bootstrap框架；移動端開發：移動端適配、WebApp、混編App、微信公衆號、微信小程序；三大主流框架：Vue.js、Angular、React.js及各自的生態圈；全棧相關技術：Node.js、數據庫、模塊化和自動化構建、項目管理技術。

4、WEB前端學習程度如何？

相較於UI設計師，前端工程師不須要很是高的美術設計功底要求；相較於後臺開發工程師，前端工程師在抽象思惟和算法方面的要求更低一些；同時，前端工程師必備的英語詞彙相對更少，加上達內開發的單詞練習和記憶輔助工具，英語零基礎學員也能夠很快掌握；因此，前端相關技術入門要求更低，無需特別的技術背景和英語基礎。可是因爲市場的緊缺，初中級工程師領域，前端工程師的薪資水平常常高於同起點的其它工程師。

5、名詞解釋

(1)HTML —— Hypertext Markup Language，超文本標記語言

• HTML是用來描述網頁內容和結構的一種語言。例如：網頁中的文字、表格、圖片等等。• HTML相比其它編程語言更加容易掌握，如<p></p>用於表示一段文本，<img>表示一張圖片等等。

(2)H5/HTML5 —— HTML語言第5版本

• HTML5是 HTML語言的最新版本，在以前版本的基礎上新增長了不少強大的功能，如繪圖、音視頻、存儲等。• 因爲Android和iOS系統對H5最新標準的支持很是好，並且能夠實現「一套代碼，運行於兩種平臺」，解決原生移動App開發最大的痛點，因此如今愈來愈多的移動App開始採用H5來編寫。

(3)CSS —— Cascade Style Sheet，層疊樣式表

• HTML描述網頁的內容，就像是人的身體；CSS描述網頁的外觀，就好像人的着裝。• CSS可用於設定網頁內容的顏色、字體、位置、大小等等設定，同時還能夠各類炫酷的交互動畫。

(4)CSS3 —— CSS語言第3版本

• CSS3是最新的CSS標準，對動畫及特效的支持更加豐富，提供的媒體查詢技術可用於編寫響應式網頁。

(5)JS —— JavaScript

• JavaScript 是一種能夠嵌入在網頁中的腳本語言，用於實現頁面內容與用戶的交互 ，例如表單驗證、頁面動畫、異步數據加載等等。

(6)jQuery

• JS標準中提供的操做方法不少時候比較複雜，且存在瀏覽器兼容性問題；jQuery提供了一套簡便的方法，用於簡化網頁中JS的編寫。• jQuery提供了四方面的簡化方法：DOM操做、事件處理、動畫函數、AJAX封裝。

(7)AJAX —— Asynchronous Javascript And XML，異步JS和XML

• 經過在後臺與服務器進行少許數據交換，AJAX 可使網頁實現異步更新。這意味着能夠在不從新加載整個網頁且不影響當前用戶操做的狀況下，對網頁的某部份內容進行更新。

(8)SQL —— Structured Query Language，結構化查詢語言

• 項目中有不少須要永久存儲的數據，例如商品、用戶、評論等等，這些數據通常都是存儲在數據庫中。 • SQL語言用於訪問和處理數據庫中數據的標準語言，包括添加、刪除、修改、刪除等功能。

(9)WebApp

• WebApp是使用HTML5編寫的移動Web應用，幾乎能夠不加修改的運行在PC/Android/iOS等多種平臺。• 傳統的移動App大多使用Objective-C(iOS)或者Java(Android)編寫，一個應用程序須要兩套開發人員，向兩個不一樣方向的市場進行發佈，很是不便；因此如今愈來愈多的移動App都在向WebApp遷移。

(10)混編App

• WebApp不少應用中能夠取代傳統的移動App，可是HTML/JS自己都是運行於瀏覽器中的，不便直接操做手機底層的硬件設備。• 混編App在底層封裝了手機底層及硬件操做，如操做通信錄、攝像頭、各種傳感器等，上層直接使用JS便可進行調用，從而極大的擴展了WebApp的功能。

(11)微信小程序

• 簡稱小程序，目前特指能夠運行於微信平臺上的一種應用框架；相對於傳統的移動App而言，是一種不須要下載安裝便可使用的應用，它實現了應用「觸手可及」的夢想，用戶掃一掃或搜一下便可打開應用。• 除了極大的方便用戶，小程序還能夠充分利用微信龐大的用戶羣實現用戶引流，下降App的獲客成本。

(12)名詞：Vue.js

• Vue是當今世界上發展最迅速的JavaScript框架，是一個經過簡潔的API提供高效的數據綁定和靈活的組件系統。• 它於2014年2月首次發佈，做者是前谷歌員工尤雨溪，並在社區開源；目前有阿里巴巴、百度、GitLab等衆多公司使用。

(13)名詞：Angular

• Angular是一個基於TypeScript的JavaScript框架。是目前普遍使用的框架裏最有歷史的框架。• 在2010年10月發佈，目前由Google開發和維護。用戶有谷歌，weather.com，福布斯等。

(14)名詞：React.js

• React被描述爲一個用於構建用戶界面的JavaScript庫。• 於2013年3月首次發佈，由Facebook開發和維護。當前的用戶有優步，Netflix，Twitter，Paypal，沃爾瑪等。