前端技术栈

前端技术大杂烩，对前端开发涉及的各大主流技术进行分类归纳说明，介绍了HTML语言、CSS语言、脚本语言、请求工具、前端测试、可视化、前端模块化、前端工程化、MVVM框架、UI组件库、WEB应用框架、服务端、新时代几个概念。

前端技术栈

• HTML语言
  • HTML4
    • 1997年 HTML4 成为互联网标准
  • HTML5
    • 2008年正式发布，成为互联网的新标准
• CSS语言
  • CSS2
    • 1998年推出的技术规范
  • CSS3
    • 2001完成了 CSS3 的草案规范
    • CSS3 被分为多个小模块独立发布
  • Less
    • CSS 预处理语言
  • Sass
    • CSS 扩展语言
  • PostCSS
    • 使用 JS 插件来转换 CSS 的工具
  • CSS in JS
    • 用 JavaScript 在写 CSS
  • CSS Modules
    • 所有的 class 的名称和动画的名称默认属于本地作用域的 CSS 文件
• 脚本语言
  • JavaScript5
    • 2009年12月正式发布
  • ES6 ~ ES10
    • 从2015年开始，ECMAScript 每年发布一个新版本
  • TypeScript
    • 由微软开发并开源，2013年正式版发布
    • JavaScript 的超集，前端下一代开发语言
• 请求工具
  • Ajax
    • 异步 JavaScript 和 XML
    • Ajax 是一种可以使网页实现异步更新的技术
  • Fetch
    • AJAX 的替代品，使用原生 JS 实现
    • 基于标准 Promise 实现，支持 async/await
  • Axios
    • 易用、简洁且高效的 http 库
• 前端测试
  • Mock Server
    • 前端开发的 Web 容器
  • Mock.js
    • 生成随机数据，模拟服务器响应
  • Jest
    • Facebook 开源的 JavaScript 测试框架
  • Mocha
    • 功能丰富的 JavaScript 测试框架
  • Selenium
    • Web 应用自动化测试框架
  • DOCLever
    • 可视化接口管理工具
• 可视化
  • 可视化基础
    • Svg
      • 可缩放矢量图形
    • Canvas
      • HTML5 新增功能，用于图形的绘制
    • WebGL
      • 一种3D绘图协议
      • 可以为 Canvas 提供硬件3D加速渲染
  • 可视化库
    • Zrender
      • 轻量级的 Canvas 类库
    • D3.js
      • 基于 Web 标准的 JavaScript 可视化库
    • Three.js
      • JavaScript 编写的 WebGL 第三方库
  • 可视化框架
    • AntV
      • 蚂蚁金服全新一代数据可视化解决方案
    • ECharts
      • 使用 JavaScript 实现的开源可视化库
    • Highcharts
      • 用纯 JavaScript 编写的一个图表库
• Web设计
  • SPA
    • Single Page Application，单页面应用
  • MPA
    • Multi Page Application，多页面应用
  • SSR
    • Server Side Render，通过服务端渲染
  • PWA
    • Progressive web Apps，渐进式 Web 应用
• 新时代
  • WebAssembly
    • 源于 Mozilla 发起的 Asm.js 项目
    • 设计补充而非取代 JavaScript
    • 是一种可移植的字节码格式，字节码以二进制格式传输
    • 让高性能的 Web 应用在浏览器上运行成为可能
  • Serverless
    • Serverless，无服务器，真正的云计算模式
    • 无服务器计算是指构建和运行不需要服务器管理的应用程序的概念
    • 从技术角度来说，Serverless 就是 FaaS 和 BaaS 的结合
• 服务端
  • NodeJS
    • 基于 Chrome V8 引擎的 JavaScript 运行环境
    • 运行在服务端的 JavaScript，发布于2009年
  • EggJS
    • 阿里开源的企业级 Node.js 框架
  • Nestjs
    • 渐进的 Node.js 框架
    • 可以在 TS 和 JS 之上构建企业级服务器端应用程序
  • Express
    • 基于 Node.js 平台的Web应用开发框架
  • Koa
    • 基于 Node.js 平台的下一代Web开发框架
    • 由 Express 原班人马打造
• Web应用框架
  • mapvue
    • 使用 Vue.js 开发小程序的前端框架
  • Nuxt.js
    • 基于 Vue.js 用于服务端渲染的简单框架
  • ReactNative
    • Facebook 于2015年开源的跨平台移动应用开发框架
  • Electron
    • 能够使用 Web 技术开发跨平台桌面应用的框架
  • uniapp
    • 使用 Vue.js 开发跨平台应用的前端框架
• UI组件库
  • layui
    • 采用自身模块规范编写的前端 UI 框架
  • Element UI
    • 基于 Vue2.x 的 UI 组件库，由饿了么开源
  • Mint UI
    • 基于 Vue.js 的移动端 UI 框架，由饿了么开源
  • Cube UI
    • 基于 Vue.js 实现的精致移动端组件库，滴滴团队开源
  • iView UI
    • 一套基于 Vue.js 的高质量 UI 组件库
  • At UI
    • 阿里团队创建的基于 Vue 2.x 的前端 UI 组件库
  • vant UI
    • 有赞前端团队基于有赞统一的规范实现的 Vue 组件库
  • AntD
    • 基于 Ant Design 设计体系的 React UI 组件库
  • Flutter
    • Google 开源的 UI 工具包，用于创建高性能、跨平台的移动应用
• MVVM框架
  • AngularJS
    • 诞生于2009年，Google开源
  • ReactJS
    • 2013年由Facebook开源
  • VueJS
    • 正式发布于2014年，作者尤雨溪
    • 2020年9月18日，Vue3.0正式发布
• 前端工程化
  • npm
    • Node 的包管理工具
  • Bower
    • 针对 Web 前端开发的包管理器
  • Babel
    • JavaScript 的编译器
  • Eslint
    • JavaScript 代码检测工具
  • StyleLint
    • CSS 代码检测工具
  • Prettier
    • 前端代码格式化工具
  • Webpack
    • 模块化打包工具
  • Gulp
    • 自动化构建工具
  • Yeoman
    • 强健的工具，库，及工作流程的组合
• 前端模块化
  • CommonJS
    • JS模块化规范，Node 中模块化规范
  • AMD
    • 模块定义的规范，RequireJS 对其进行了实现
  • CMD
    • 模块定义的规范，SeaJS 对其进行了实现
  • ES Module
    • ES6 推出的模块化标准