如今的前端技術是一個復雜的生態，
隨便閱讀一篇關于前端的技術文章，一定會發現大量的技術術語，什么 vue, webpack, react, Antdesign 等，各種新名詞讓初學者感到非常困惑，在較短的時間根本快速的理解整個前端體系，從而陷入一種低效、焦慮的學習狀態，
什么是前端？
在網站技術中，前端就是用戶界面，主要通過頁面向用戶展示內容或資料，同時用戶可以自主選擇需要的內容并向網站填寫資料后給出反饋，
前端是相對后端而言的，前+后這種分工模式，在生活中或人類的組織分工中非常常見，舉例：
- 電視機+機頂盒
- 士兵+作戰指揮部
- 無人便利店+運作系統
簡而言之，網站的前端主要通過從后臺獲取資料，向用戶展示資料或采集資料傳送到后臺
前端技術體系
以網站為例，前端的載體就是瀏覽器 Chrome, FireFox 等，所以前端技術自始至終都是圍繞瀏覽器的幾個基礎技術進行發展：
- HTML
- CSS
- JavaScript/ECMAScript
現在流行的前端技術都是對以上基礎技術進行“高級編程”，圍繞界面設計、界面互動和界面體驗，提供不同的軟體包，
比如：Vue, React, Bootstrap 等框架都是這方面的杰出代表，
不管哪一種框架最終都是依賴以上技術，
UI 框架
UI 框架偏重于 UI 顯示的效果，其包含設計理念，所以基于同一種 UI 框架的網站其視覺效果看起來非常類似，
主流的 UI 框架為：
- Material Design
- Ant Design
- Bootsrap
- iView
- Element
JS 框架（互動編程）
不同于 UI 框架，互動編程偏重于用戶互動后的資料展示（采集），也就是說，當你的前端頁面需要根據用戶的選擇展示不同型別的資料的時候，就需要進行互動式編程，
早期，開發者主要采用原生的 JavaScript 來實作這種互動，隨著技術的演進，就誕生了專門用于互動編程的 JS 軟體包框架，解決一些通用的問題，開發者能夠基于這種 JS 軟體包更方便的開發前端互動，
主流的 JS 框架為：
- jQuery
- Vue.js
- React
- Angula.js
- Ember.js
- Meteor
- Mithril
- Backbone.js
- Handlebars.js
混合框架
實際開發網站中，單單使用某一種框架并不能滿足業務，
比如 Vue.js 雖然能夠很好的處理資料互動，但它自身卻無法構造優美的界面，由于開源世界總有一些默默無聞的頂尖級程式員創造偉大的作品，所以基于主流的 UI 和 JS 框架，產生了繁榮的生態，框架相互組合，并引入了更多的工具，又組合成新的框架，
以 Vue.js 為例，產生了更多混合框架：
- bootstrap-vue 即 Vue.js + Boostrap
- Ant Design of Vue 即 Vue.js + Ant Design
- Vuetify.js 即 Vue.js + Material Design
- Nuxt.js 即 Vue.js 的 SSR 模式增強
- NativeScript-Vue 即 Vue.js 移動端開發增加
- Quasar 即 Vue.js + 撰寫一次代碼，并同時將其部署為網站，移動應用程式和/或電子應用程式
輔助技術
還有一些很重要的技術，它們沒有上升到框架的層面，也不是技術的核心，但是它們是前端應用不可或缺的重要組成部分，包括：
- Node 前端引擎
- NPM 前端軟體包的安裝管理器
- Webpack 前端打包工具
- Babel 主要用于將 ECMAScript 2015+ 版本的代碼轉換為向后兼容的 JavaScript 語法
談談 Node
Node 即 Node.js，
前面我們提到過，瀏覽器是包含 JavaScript 程式的解釋器的，所以它能夠處理 JS 代碼，
Node 區別于以上任何框架，它應該稱之為 JavaScript 程式的解釋器（類似虛擬機），所以它主要用于不方便呼叫瀏覽器的場景下處理 JS 代碼，
Node 使用場景包括：除錯和構建
總結
以上的解釋看起來簡單明了，但實際作業中仍然需要我們自身不斷地實踐和總結，才能抓住根本，
本文由Websoft9原創發布，轉載請注明出處，創作不易，歡迎討論，感謝支持！
轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/228759.html
標籤：其他
上一篇：開源ERP和其它ERP軟體比較
下一篇：企業ERP核心模型與云計算生態