HTML/CSS/Javascript三座大山是前端技術(shù)的核心，萬變不離其宗，回歸基礎(chǔ)，夯實(shí)基礎(chǔ)，加深理解，是成為高級前端工程師的必經(jīng)之路。
基礎(chǔ)知識學(xué)習(xí)請參考 MDN 或菜鳥教程

基礎(chǔ)技術(shù):

• HTML 定義網(wǎng)頁的內(nèi)容
• CSS 規(guī)定網(wǎng)頁的布局
• JavaScript 對網(wǎng)頁行為進(jìn)行編程

HTML&HTML5

• HTML 指的是超文本標(biāo)記語言 (Hyper Text Markup Language)
• HTML5 是最新的 HTML 標(biāo)準(zhǔn)。
  HTML5 是專門為承載豐富的 web 內(nèi)容而設(shè)計(jì)的，并且無需額外插件。
  HTML5 擁有新的語義、圖形以及多媒體元素：canvas，video，audio。
  HTML5 提供的新元素和新的 API 簡化了 web 應(yīng)用程序的搭建。
  HTML5 是跨平臺的，被設(shè)計(jì)為在不同類型的硬件（PC、平板、手機(jī)、電視機(jī)等等）之上運(yùn)行。
  拖放：Drag，Drop
  視頻音頻：video，audio
  畫布：canvas
  地理定位：geolocation
  web存儲：localStorage - 沒有時間限制的數(shù)據(jù)存儲，sessionStorage - 針對一個 session 的數(shù)據(jù)存儲

CSS&CSS3

• CSS 指層疊樣式表 (Cascading Style Sheets)。
  定義如何顯示 HTML 元素，樣式通常存儲在樣式表中，一般情況下分為三種樣式：行內(nèi)樣式，內(nèi)部樣式，外聯(lián)樣式。

• CSS3 是最新的 CSS 標(biāo)準(zhǔn)。
  選擇器：屬性選擇器，偽類選擇器，子元素選擇器.etc.
  框模型：flex-box，grid-box
  背景和邊框：background-size，border-radius，box-shadow，border-image
  文本效果：text-shadow，word-wrap
  2D/3D 轉(zhuǎn)換：transform相關(guān)
  動畫：@keyframes，animation
  多列布局：column-count，column-gap，column-rule
  用戶界面：box-sizing，resize

• Sass & Less

  1. Sass 是一款強(qiáng)化 CSS 的輔助工具，它在 CSS 語法的基礎(chǔ)上增加了變量 (variables)、嵌套 (nested rules)、混合 (mixins)、導(dǎo)入 (inline imports) 等高級功能，這些拓展令 CSS 更加強(qiáng)大與優(yōu)雅。使用 Sass 以及 Sass 的樣式庫（如 Compass）有助于更好地組織管理樣式文件，以及更高效地開發(fā)項(xiàng)目。 Sass學(xué)習(xí)
  2. Less 是一門 CSS 預(yù)處理語言，它擴(kuò)展了 CSS 語言，增加了變量、Mixin、函數(shù)等特性，使 CSS 更易維護(hù)和擴(kuò)展。Less學(xué)習(xí)

相關(guān)css屬性瀏覽器支持情況請查詢 https://www.caniuse.com/

Javascript

JavaScript 在 1995 年由 Brendan Eich 發(fā)明，并于 1997 年成為一部 ECMA 標(biāo)準(zhǔn)。
ECMA-262 是其官方名稱。ECMAScript 2019（ES10）為最新版本，ECMAScript 6 （發(fā)布于 2015 年）是最熟知的 JavaScript 版本。
Js學(xué)習(xí) https://developer.mozilla.org/zh-CN/docs/Web/JavaScript

ES 歷史版本

常用插件/組件

工欲善其事，必先利其器。 善用工具和框架能使我們開發(fā)事半功倍。當(dāng)前用工具的同時我們也要明白其中的原理，這樣才能知其然又知其所以然。官方API是最好的學(xué)習(xí)工具。

目前流行的三大框架

• Vue

  
  
  Vue

Vue (讀音 /vju?/，類似于 view) 是一套用于構(gòu)建用戶界面的漸進(jìn)式JavaScript框架。與其它大型框架不同的是，Vue 被設(shè)計(jì)為可以自底向上逐層應(yīng)用。Vue 的核心庫只關(guān)注視圖層，方便與第三方庫或既有項(xiàng)目整合。
Vue全家桶：vue-cli + vue + vuex + vue-router + axios + element-ui
Vue學(xué)習(xí) https://vuejs.org/

• React

  
  
  React

React 是一個用于構(gòu)建用戶界面的 JavaScript 庫。
React全家桶：react+react-dom+react-router+axios+redux
React學(xué)習(xí) https://react.docschina.org/docs/getting-started.html

• AngularJs

  
  
  AngularJs

JS&UI組件/插件

1. UI組件：

• ElementUI
  
  ElementUI
• IviewUI
  
  image.png
• mint-ui
  
  mint-ui
• muse-ui
  
  muse-ui
• 滴滴 mand-mobile
  
  mand-mobile

2. 圖表插件：

• 百度 Echarts
  
  echarts
• HighCharts
  
  high-charts
• FusionCharts
  
  image.png

3. 其他工具插件：

• Node.js
  Node.js 是一個基于 Chrome V8 引擎的 JavaScript 運(yùn)行時
• Webpack-js
  本質(zhì)上，webpack 是一個現(xiàn)代 JavaScript 應(yīng)用程序的靜態(tài)模塊打包器(module bundler)。當(dāng) webpack 處理應(yīng)用程序時，它會遞歸地構(gòu)建一個依賴關(guān)系圖(dependency graph)，其中包含應(yīng)用程序需要的每個模塊，然后將所有這些模塊打包成一個或多個 bundle。
• Lodash-js
  Lodash是一個一致性、模塊化、高性能的 JavaScript 實(shí)用工具庫。
• Babel
  Babel 是一個工具鏈，主要用于將 ECMAScript 2015+ 版本的代碼轉(zhuǎn)換為向后兼容的 JavaScript 語法，以便能夠運(yùn)行在當(dāng)前和舊版本的瀏覽器或其他環(huán)境中。
• Axios
  Axios 是一個基于 promise 的 HTTP 庫，可以用在瀏覽器和 node.js 中
  1. 從瀏覽器中創(chuàng)建 XMLHttpRequests
  2. 從 node.js 創(chuàng)建 http 請求
  3. 支持 Promise API
  4. 攔截請求和響應(yīng)
  5. 轉(zhuǎn)換請求數(shù)據(jù)和響應(yīng)數(shù)據(jù)
  6. 取消請求
  7. 自動轉(zhuǎn)換 JSON 數(shù)據(jù)

有關(guān)jQuery，easyUI之類的工具類和UI組件在此不在贅述，有需自查官方文檔