前端技术多且杂，那么作为前端开发者，我们可以从那些方面进行进阶提升呢？本文从以下几个方面进行了整理归纳
内容如下：
- 一.网页开发
- 二.小程序
- 三.移动端
- 四.桌面端
- 五.其他技术
一.网页开发
这里指PC端网页开发，要求的技术主要有以下几类：
1.Vue、React 和 Angular
作为 MVVM 前端框架的三大巨头，在招聘信息中，基本都要求熟练掌握其中一种框架，并了解其原理。它们各自有各自的优点，Vue 使用便捷简单，React 编码更加灵活，Angular 则注重包容性。就流行程度而言，Vue 和 React 在国内更加受欢迎，所以我们在学习的时候可以优先选择这两个。
2.jQuery
曾经前端界的扛把子，那时前端还没得这么多五花八门的技术和框架，基本只要熟练掌握了 jQuery 就完全能找到工作了。这些年虽然一直在唱衰它，但现在仍然能在很多 C端产品上看到它的身影。
3.响应式开发
很多公司的门户网站基本会用到这个技术，这样可以节约成本。这项技术一般适用于简单网页，复杂网页做响应式比较困难，而且体验也不是很好。相关框架 BootStrap等。
二.小程序
小程序这块一般指微信小程序，当然还有支付宝、百度、头条和QQ等一系列小程序。下面我们就微信小程序为主，讲讲都有哪些开发方式。
1.微信小程序原生开发
官方文档：https://developers.weixin.qq.com/miniprogram/dev/framework/
在微信小程序早期的时候，有许多问题：没有自定义组件、UI控制自由度不高、ES6支持度不高、开发工具不好用等系列问题，这也是导致第三方框架层出不穷的原因之一。当然，经过这些年发展，很多问题已得到解决。所以，如果没有多端的要求，完全可以采用原生开发的形式。
2.uni-app
官方文档：uni-app官网
uni-app 是一个使用 Vue.js 开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、H5、以及各种小程序（微信/支付宝/百度/头条/QQ/钉钉）等多个平台。
3.Taro
官方文档：Taro 介绍 | Taro 文档
Taro 是一套遵循 React 语法规范的 多端开发 解决方案。使用 Taro，我们可以只书写一套代码，再通过 Taro 的编译工具，将源代码分别编译出可以在不同端（微信/百度/支付宝/字节跳动/QQ/京东小程序、快应用、H5、React-Native 等）运行的代码。
4.其他
其他的小程序开发框架我觉得都没得太大的优势，以前比较流行的框架比如 mpvue 。
5.云开发
开发者可以使用云开发开发微信小程序、小游戏，无需搭建服务器，即可使用云端能力。
云开发为开发者提供完整的原生云端支持和微信服务支持，弱化后端和运维概念，无需搭建服务器，使用平台提供的 API 进行核心业务开发，即可实现快速上线和迭代，同时这一能力，同开发者已经使用的云服务相互兼容，并不互斥。
据说云开发在未来很有潜力，有兴趣的不妨去了解了解。
三.移动端
包含 Web App、Android App 和 IOS App。开发方式有以下两种。
1.Native App
即原生APP开发模式，利用iOS、Android开发平台官方提供的开发工具进行APP的开发。
2.Hybrid App
Hybrid App（混合模式移动应用）是指介于 web-app、native-app 这两者之间的 app，兼具“Native App良好用户交互体验的优势”和“Web App跨平台开发的优势”。
主流开发框架有：
1）.RN（React Native）
官方文档：React Native 中文网 · 使用React来编写原生应用的框架
React Native使你只使用JavaScript也能编写原生移动应用。 它在设计原理上和React一致，通过声明式的组件机制来搭建丰富多彩的用户界面。
React Native产出的并不是“网页应用”， 或者说“HTML5应用”，又或者“混合应用”。 最终产品是一个真正的移动应用，从使用感受上和用Objective-C或Java编写的应用相比几乎是无法区分的。 React Native所使用的基础UI组件和原生应用完全一致。
与之对应的框架 Weex，支持 Vue.js 。这里没有单独列出来，因为它已经内置到 uni-app 中了。
2）.Flutter
官方文档：Flutter中文网
Flutter是谷歌的移动UI框架，可以快速在iOS和Android上构建高质量的原生用户界面。 Flutter可以与现有的代码一起工作。在全世界，Flutter正在被越来越多的开发者和组织使用，并且Flutter是完全免费、开源的。
当然，前面提到的 uni-app、Taro 也可用来开发 App，除此之外还有 Weex 等框架...
这里再推荐一篇 RN、Flutter 和 uni-app 之间的比较的文章：flutter、rn、uni-app比较 - DCloud问答
四.桌面端
桌面端开发框架也非常多，就前端而言，这里推荐下面这个框架
1.Electron
官方文档：Electron | Build cross-platform desktop apps with JavaScript, HTML, and CSS.
Electron是由Github开发，用HTML，CSS和JavaScript来构建跨平台桌面应用程序的一个开源库。 Electron通过将Chromium和Node.js合并到同一个运行时环境中，并将其打包为Mac，Windows和Linux系统下的应用来实现这一目的。
这里再推荐一个 Tauri 框架ya，不过这个框架相对而言学习成本要高不少，需要去学习 Rust 语言相关的知识。
五.其他技术
1.TypeScript
官方文档：TypeScript中文网 · TypeScript——JavaScript的超集
TypeScript 是 JavaScript 的一个超集，支持 ECMAScript 6 标准。TypeScript 由微软开发的自由和开源的编程语言。TypeScript 设计目标是开发大型应用，它可以编译成纯 JavaScript，编译出来的 JavaScript 可以运行在任何浏览器上。
现在有很多公司都要求开发者掌握 TypeScript。
2.前端工程化
作为前端工程师，我们需要具备工程化思想，并掌握相关框架的使用，如：Webpack、Vite、Gulp、Grunt 等。
3.算法，设计模式
一般大些的公司都要求我们掌握一些常用的算法和设计模式。
4.网络、安全
http、跨域、CSRF（跨站请求伪造）、XSS（跨域脚本攻击）等。
5.Node.js
简单的说 Node.js 就是运行在服务端的 JavaScript。最近 Node.js 的作者又出了一个和 node 相似的 deno => De（Destroy）no(Node)，可简单的理解为 node 的升级版，以解决 node 中存在的难以解决的问题。
6.数据可视化
相关技术和框架：SVG、Canvas、WebGL；Echarts（可视化图表库）、Three.js（主流 3D 绘图 JS 引擎）、Cesium（跨平台、跨浏览器的展示三维地球和地图的 JS 库）等。
一些第三方的数据大屏：阿里云-DataV、腾讯云图
7.微前端
早期实现微前端是通过 iframe，但 iframe 更适合静态、纯展示类的页面，对于交互性强的应用并不适合。
微前端的好处在于各个微应用之间彼此独立（独立开发、独立部署、技术栈无关）。
复杂的中后台应用中，适合采用微前端进行开发，以避免后期项目难以维护。
常用微前端框架：
qiankun
single-spa
wujie
8.PWA
PWA 全称 Progressive Web App，即渐进式 WEB 应用。
优点：
- 可以添加至主屏幕，点击主屏幕图标可以实现启动动画以及隐藏地址栏
- 实现离线缓存功能，即使用户手机没有网络，依然可以使用一些离线功能
- 实现了消息推送
讲讲PWA
有哪些使用 PWA 的 app ？
9.前端自动化测试
常用框架：Jest
一些相关专业名词：
- TDD，Test Driven Development 测试驱动开发
- BDD，Behavior Driven Development 行为驱动开发
常见组合：
- Vue + Vue-test-utils
- React + Enzyme
10.更多
这里就不在继续往下写了，因为太多了，比如：游戏、视频、直播、图形处理等方面，还有 AR（增强现实）、VR（虚拟现实）等。
