web前端主要是用來做什么的，難學(xué)嗎？前端開發(fā)是創(chuàng)建Web頁面或app等前端界面呈現(xiàn)給用戶的過程，通過HTML，CSS及JavaScript以及衍生出來的各種技術(shù)、框架、解決方案，來實現(xiàn)互聯(lián)網(wǎng)產(chǎn)品的用

web前端主要是用來做什么的，難學(xué)嗎？

前端開發(fā)是創(chuàng)建Web頁面或app等前端界面呈現(xiàn)給用戶的過程，通過HTML，CSS及JavaScript以及衍生出來的各種技術(shù)、框架、解決方案，來實現(xiàn)互聯(lián)網(wǎng)產(chǎn)品的用戶界面交互

web前端主要是用來做什么的，難學(xué)嗎？

。它從網(wǎng)頁制作演變而來，名稱上有很明顯的時代特征。在互聯(lián)網(wǎng)的演化進(jìn)程中，網(wǎng)頁制作是Web1.0時代的產(chǎn)物，早期網(wǎng)站主要內(nèi)容都是靜態(tài)，以圖片和文字為主，用戶使用網(wǎng)站的行為也以瀏覽為主。隨著互聯(lián)網(wǎng)技術(shù)的發(fā)展和HTML5、CSS3的應(yīng)用，現(xiàn)代網(wǎng)頁更加美觀，交互效果顯著，功能更加強(qiáng)大。 移動互聯(lián)網(wǎng)帶來了大量高性能的移動終端設(shè)備以及快速的無線網(wǎng)絡(luò)，HTML5，node.jS

的廣泛應(yīng)用，各類框架類庫層出不窮。

核心技術(shù)編輯HTML語言掌握HTML是網(wǎng)頁的核心，是一種制作萬維網(wǎng)頁面的標(biāo)準(zhǔn)語言，是萬維網(wǎng)瀏覽器使用的一種語言，它消除了不同計算機(jī)之間信息交流的障礙。因此，它是網(wǎng)絡(luò)上應(yīng)用最為廣泛的語言，也是構(gòu)成網(wǎng)頁文檔的主要語言，學(xué)好HTML是成為Web開發(fā)人員的基本條件。HTML是一種標(biāo)記語言，能夠?qū)崿F(xiàn)Web頁面并在瀏覽器中顯示。HTML5作為HTML的最新版本，引入了多項新技術(shù)，大大增強(qiáng)了對于應(yīng)用的支持能力，使得Web技術(shù)不再局限于呈現(xiàn)網(wǎng)頁內(nèi)容。隨著CSS、JavaScript、Flash等技術(shù)的發(fā)展，Web對于應(yīng)用的處理能力逐漸增強(qiáng)，用戶瀏覽網(wǎng)頁的體驗已經(jīng)有了較大的改善。不過HTML5中的幾項新技術(shù)實現(xiàn)了質(zhì)的突破，使得Web技術(shù)首次被認(rèn)為能夠接近于本地原生應(yīng)用技術(shù)，開發(fā)Web應(yīng)用真正成為開發(fā)者的一個選擇。HTML5可以使開發(fā)者的工作大大簡化，理論上單次開發(fā)就可以在不同平臺借助瀏覽器運(yùn)行，降低開發(fā)的成本，這也是產(chǎn)業(yè)界普遍認(rèn)為HTML5技術(shù)的主要優(yōu)點之一。AppMobi、摩托羅拉、Sencha、Appcelerator等公司均已推出了較為成熟的開發(fā)工具，支持HTML5應(yīng)用的發(fā)展。 [3] CSS學(xué)好CSS是網(wǎng)頁外觀的重要一點，CSS可以幫助把網(wǎng)頁外觀做得更加美觀。JavaScript學(xué)習(xí)JavaScript的基本語法，以及如何使用JavaScript編程將會提高開發(fā)人員的個人技能。操作系統(tǒng)了解Unix和Linux的基本知識，對于開發(fā)人員有益無害。網(wǎng)絡(luò)服務(wù)器了解Web服務(wù)器，包括對Apache的基本配置，htaccess配置技巧的掌握等?！　?yōu)化編輯盡量減少HTTP請求 (Make Fewer HTTP Requests)減少DNS 查找 (Reduce DNS Lookups)避免重定向 (Avoid Redirects)使得 Ajax 可緩存 (Make Ajax Cacheable)延遲載入組件 (Post-load Components)預(yù)載入組件 (Preload Components)減少DOM元素數(shù)量 (Reduce the Number of DOM Elements)切分組件到多個域 (Split Components Across Domains)最小化iframe的數(shù)量 (Minimize the Number of iframes)杜絕 http (No 404s)以上10條涵蓋了Web前端開發(fā)中遇到的各種頁面處理技術(shù)，讓前端開發(fā)人員能夠準(zhǔn)確和快速地把握整個網(wǎng)頁的架構(gòu)，從而達(dá)到減少開發(fā)成本和頁面美化目的。前端框架編輯學(xué)好Web框架熟悉掌握HTML、服務(wù)器端腳本語言、CSS和JavaScript之后，學(xué)習(xí)Web框架可以加快Web開發(fā)速度，節(jié)約時間。PHP程序員可選的框架包括CakePHP、CodeIgniter、Zend等，Python程序員喜歡使用Django和 webpy，Ruby程序員常用RoR。隨著Web 越來越規(guī)范和標(biāo)準(zhǔn)的統(tǒng)一，Web組件化技術(shù)不斷革新，移動端開發(fā)不斷升華，以下是一些常見開源前端框架：Bootstrap主流框架之一，Bootstrap 是基于 HTML、CSS、JavaScript的，它簡潔靈活，使得 Web 開發(fā)更加快捷。html5-boilerplate該框架可以快速構(gòu)建健壯，且適應(yīng)力強(qiáng)的web app或網(wǎng)站。MeteorMeteor是新一代的開發(fā)即時web應(yīng)用的開源框架，它能在較短時間內(nèi)完成開發(fā)。Semantic UI基于自然語言有效原則的UI組件框架Foundation優(yōu)秀的響應(yīng)式前端框架Materialize基于材料設(shè)計的現(xiàn)代化響應(yīng)式前端框架?？商峁┠J(rèn)的樣式，自定義組件。此外，Materialize還改進(jìn)動畫和過渡，為開發(fā)人員提供流暢的體驗。Pure幾乎可以在每一個web項目中使用的一組小的和響應(yīng)式的CSS模塊。VueVue.js 是用于構(gòu)建交互式的 Web 界面的庫。它提供了 MVVM 數(shù)據(jù)綁定和一個可組合的組件系統(tǒng)，具有簡單、靈活的 API。SkeletonSkeleton 是一個小的 JS 和 CSS 文件的集合,可快速開發(fā)漂亮的網(wǎng)站,適合各種屏幕設(shè)備包括手機(jī)。Skeleton 基于 960 grid 開發(fā)。它是一個 UI 框架。Amaze UI國內(nèi)首個開源HTML5跨屏前端框架產(chǎn)品系列，中文排版支持更優(yōu)、本土化組件豐富。該產(chǎn)品系列中有專門針對移動端的HTML5混合應(yīng)用開發(fā)框架Amaze UI Touch以及針對跨屏HTML5網(wǎng)頁開發(fā)的Amaze UI Web。其中，Amaze UI Touch可以幫助開發(fā)者通過豐富的組件，快速構(gòu)建出與原生APP相媲美的專屬移動端的HTML5應(yīng)用。UIkit一個輕量級的和模塊化的前端框架,用于快速開發(fā)和功能強(qiáng)大的web接口。YuiYahoo! UI Library (YUI) 是一個開放源代碼的 JavaScript 函數(shù)庫，為了能建立一個高互動的網(wǎng)頁，它采用了AJAX, DHTML 和 DOM 等程式碼技術(shù)。它也包含了許多 CSS 資源。使用授權(quán)為 BSD許可證。kissy一款跨終端、模塊化、高性能、使用簡單的 JavaScript 框架。MUI最接近原生App體驗的前端框架的框架。Arale一個開放、簡單、易用的前端基礎(chǔ)類庫。JXJX 是模塊化的非侵入式Web前端框架，特別適合構(gòu)建和組織大規(guī)模、工業(yè)級的Web App。GMUGMU是基于zepto的mobile UI組件庫，提供webapp、pad端簡單易用的UI組件! Web App。ZUI開源HTML5前端框架Clouda Touch.jsTouch.js是移動設(shè)備上的手勢識別與事件庫,也是在百度內(nèi)部廣泛使用的開發(fā)。 [4]至于學(xué)習(xí)難度，不是很難，只要學(xué)肯定是能學(xué)會的??！現(xiàn)在網(wǎng)絡(luò)很發(fā)達(dá)，網(wǎng)上有許多學(xué)習(xí)前端的網(wǎng)站像w3c ... 加油?。?！

Token是什么？和session、cookie相比，使用場景有什么區(qū)別？

在Web開發(fā)領(lǐng)域，相信大家對于Cookie和Session都很熟悉，Cookie和Session都是會話保持技術(shù)的解決方案。隨著技術(shù)的發(fā)展，Token機(jī)制出現(xiàn)在我們面前，不過很多開發(fā)者對于Token和Cookie、Session的區(qū)別及使用場景分辨不清。

Cookie和Session的用途要知道我們訪問網(wǎng)站都是通過HTTP協(xié)議或HTTPS協(xié)議來完成的，HTTP協(xié)議它本身是無狀態(tài)的協(xié)議（即：服務(wù)器無法分辨哪些請求是來源于同個客戶）。而業(yè)務(wù)層面會涉及到客戶端與服務(wù)器端的交互（同網(wǎng)站下多個頁面間能共享數(shù)據(jù)），此時服務(wù)器端必須要保持會話狀態(tài)，這樣才能進(jìn)行用戶身份的鑒別。

由于HTTP無狀態(tài)的特性，如果要實話客戶端和服務(wù)器端的會話保持，那就需要其它機(jī)制來實現(xiàn)，于是Cookie和Session應(yīng)運(yùn)而生。

通常情況下，Session和Cookie是搭配在一起使用的。

Token是什么上面說到的Session和Cookie機(jī)制來保持會話，會存在一個問題：客戶端瀏覽器只要保存自己的SessionID即可，而服務(wù)器卻要保存所有用戶的Session信息，這對于服務(wù)器來說開銷較大，而且不利用服務(wù)器的擴(kuò)展（比如服務(wù)器集群時，Session如何同步存儲就是個問題）！

于是有人思考，如果把Session信息讓客戶端來保管而且無法偽造不就可以解決這個問題了？進(jìn)而有了Token機(jī)制。

Token俗稱為“令牌”，它的構(gòu)成是：

uid：用戶唯一身份標(biāo)識

timestamp：當(dāng)前時間戳

sign：簽名字符串，防止第三方偽造數(shù)據(jù)；簽名密鑰是存儲在服務(wù)器端的，其它人無法知道

其它附加參數(shù)。

Token機(jī)制下的認(rèn)證流程Token機(jī)制其實和Cookie機(jī)制極其相似，主要有以下流程：

1、用戶登錄進(jìn)行身份認(rèn)證，認(rèn)證成功后服務(wù)器端生成Token返回給客戶端；

2、客戶端接收到Token后保存在客戶端（可保存在Cookie、LocalStorage、SessionStorage中）；

3、客戶端再次請求服務(wù)器端時，將Token作為請求頭放入Headers中；

4、服務(wù)器端接收請求頭中的Token，將用戶參數(shù)按照既定規(guī)則再進(jìn)行一次簽名，兩次簽名若一致則認(rèn)為成功，反之?dāng)?shù)據(jù)存在篡改請求失敗。

（生成簽名示例圖）

（驗證簽名示例圖）

Token與Cookie Session的區(qū)別Cookie其實也充當(dāng)?shù)氖橇钆谱饔?，但它是“有狀態(tài)”的；而Token令牌是無狀態(tài)的，更利于分布式部署。

以上就是我的觀點，對于這個問題大家是怎么看待的呢？歡迎在下方評論區(qū)交流 ~ 我是科技領(lǐng)域創(chuàng)作者，十年互聯(lián)網(wǎng)從業(yè)經(jīng)驗，歡迎關(guān)注我了解更多科技知識！