1. 前端监控系统
    1. 性能监控,安全监控
    2. 流量管控
    3. 异常监控
    4. 数据埋点
    5. API监控
    6. 自动化测试
  2. 低代码平台
    1. 表单设计器
    2. 表格设计器
    3. 卡片看板
  3. 日志系统
  4. 视频会议系统
    1. 网络
    2. webRTC
    3. 聊天
    4. 语音
    5. 视频
    6. 白板
  5. WebAssembly

弹窗管控
问卷调查
答疑机器人

前端开发框架

  1. 框架的初始化
    1. cli命令获取,标准化的项目结构
  2. 开发环境
  3. 工具类库
  4. 模块化
    1. 把一个文件拆分成多个依赖的模块,很好的保证多人协作
  5. 组件化
  6. 规范化
  7. 自动化

https://blog.csdn.net/qq_33150267/article/details/79213054

前端编程规范

  • eslint
  • prettier
  • commitizen
  • commitlint
  • husky
  • pre-commit
  • lint-staged
  • Svg Srpite Icon

最佳开发实践的知识,可以在以下方面带来极大的改进:

  1. 编写的代码质量
  2. 在会议上讨论的想法
  3. 你的长期职业规划
  4. 大致的技术范畴

前端进阶

  1. H5移动端开发
  2. 大屏可视化,数据可视化
    1. 图表设计与开发
    2. web界面设计基础
  3. 组件库最佳实践

react资源

js开源 https://github.com/orgs/alibaba/repositories?language=javascript&page=1&q=&sort=&type=
ts开源 https://github.com/orgs/alibaba/repositories?q=&type=&language=typescript&sort=

hooks https://ahooks.js.org/zh-CN/
react国际化 https://github.com/alibaba/react-intl-universal

前端开发规范 https://github.com/alibaba/f2e-spec
image.png

anyProxy

https://github.com/alibaba/anyproxy
AnyProxy是一个基于NodeJS的,可供插件配置的HTTP/HTTPS代理服务器。
主页:AnyProxy.io,访问可能需要稳定的国际网络环境
image.png

ice

https://github.com/alibaba/ice

form表单可视化

https://github.com/alibaba/x-render
image.png

https://github.com/alibaba/formily
image.png

https://github.com/alibaba/designable
https://designable.netlify.app/
image.png

海量数据高性能序列化方案

https://github.com/alibaba/dimbin
序列化方案选型对比

  1. npm install --save dimbin
  2. import DIMBIN from 'dimbin'

koa框架 https://github.com/ploverjs/guides

工程化的重要性

  • 避免技术选型纠结,初始化配置复杂
  • 有规范的开发调试和部署方案
  • 有国际化
  • 数据流管理最佳实践
  • 统一的项目结构和代码质量保证规范
  • 工程&框架聚合多种技术的最佳实践
    • TypeScript
    • React
    • Antd
    • AntdPro
    • ReactRouter
    • Webpack
    • Babel
    • AntV
    • Dva
  • 构建一套最佳模式库

中台模板

  • 内置 antd 中台最佳实践
  • antd静态站点模板
  • H5移动端模板,适用于移动端
  • 中台全栈应用, egg + antd + mysql,提供服务端调用能力

工程化总结

  • create-react-app工程化
  • dva工程化
  • typescript工程化
  • react-skeleton骨架屏