前端技术 - duxiaoyao/pdp GitHub Wiki

Q: 如何选择前端框架？

1. 如果是中后台应用
   • 如果主要在PC上使用，则选择：Ant Design Pro of React/Vue, Ant Design of React/Vue
   • 如果移动优先，选择：Ant Design Mobile of React/Vue
2. 如果是前台应用
   • 如果主要在PC上使用，则选择：Ant Design of React/Vue，或者直接 React/Vue
   • 如果移动优先，选择：WEUI，Ant Design Mobile of React/Vue，或者直接 React/Vue
     • 如果是微信生态，优选WEUI
3. 如果是桌面应用
   • 如果是多端-支持web，选择：Tauri 或 Electron.js
   • 如果不是多端不需要web技术，选择：QT等

Q: 前端框架选择react还是vue？
团队精通那个用那个，都不精通或一样精通选vue：简单、上手快、有中文文档和社区。

Q: 前后端分离
前后端通过Restful或GraphQL API分离，数据格式的主流是JSON。接口管理可以使用RAP。

Q: 多端统一指什么
从设备角度，多端指：PC、手机、TV、手表等
从平台角度，多端指：web（浏览器）、ANDROID、IOS、Windows、Linux等
从应用形态，多端指：web APP、桌面APP、移动APP
大前端最大的特点是多端统一，即一次开发，同时适用多端。目前是基于web技术实现多端统一，即利用web不仅能开发出网站，还可以开发手机端web应用和移动端应用，甚至桌面应用。
利用web技术开发移动端应用推荐react native或weex，利用web技术开发桌面应用推荐Electron或基于浏览器的APP（PWA）

Q: 前端需要关注的趋势

1. 只支持现代浏览器（支持ES6），尽量不要去兼容不支持ES6的浏览器
2. 尽量少用框架或前端库，尽量使用原生JS和原生web技术
3. 将来会有原生的web components支持，就不用去选择react或vue了，当然到时这些框架肯定会提供相关支持。

Q: 前后端API交互如何保证数据安全性？

1. 通信使用https
2. 请求签名，防止参数被篡改
3. 身份确认机制，每次请求都要验证是否合法
4. APP中使用ssl pinning防止抓包操作
5. 对所有请求和响应都进行加解密操作

后端：@verify_sign、@encrypt、@decrypt
前端：用axios的拦截器来统一处理签名、加密、解密操作
基于身份认证cookie，生成加解密key，基于此key做签名和加解密，带上时间戳（10分钟内有效）

附
中后台前端
面向PC、兼顾移动端：Ant Design Pro of React/Vue, Ant Design of React/Vue
移动优先：Ant Design Mobile of React/Vue

前台前端
面向PC、兼顾移动端：Ant Design Pro of React/Vue, Ant Design of React/Vue
移动优先：WEUI, Ant Design Mobile of React/Vue