男,1994/01/25, 前端开发工程师;
现就职于上海汉得信息技术股份有限公司——研发中心,负责Choerodon猪齿鱼平台的框架开发和维护。
2017年毕业于西南财经大学,本科学历,计算机科学与技术(金融信息化)专业。
邮箱: qihuang@ghy.cn | 电话: 18018514285 | QQ: 598260403 | 微信:598260403@qq.com
- 能熟练地编写可复用、优雅的HTML、CSS和JS代码,构建用户体验较好的Web系统
- 熟练掌握ES6
- 熟悉Sass、Less等CSS预处理语言
- 对JS有较为深入地理解
- 熟悉React,有两年开发经验,深入理解生命周期及其组件化开发理念,了解部分高级特性,熟悉配套的“全家桶”
- 熟悉React Native,有过APP开发和文档翻译的经历
- 对数据流有深刻的认识,对MobX,Redux等状态管理工具有较深入的使用和理解,也能熟练使用全局context和React Hooks结合开发
- 熟练使用Ant Design等UI库,有开发UI库的经验
- 了解Vue及其部分重要思想原理,有过自我开发项目
- 熟练掌握jQuery,能够根据jQuery开发简单的状态同步机制来简化开发
- 能够使用NodeJS进行简单开发完成脚手架相关开发,简单的服务器启动等
- 熟练掌握Git,理解GitFlow工作流,熟悉SVN工具管理代码,有较好的开发习惯
- 熟悉webpack,Parcel,Rollup,Gulp等打包工具,能够开发webpack loader和plugin,熟悉webpack编译的流程和原理,能够进行配置和优化
- 熟悉Babel原理,能够开发Babel插件,对AST有所了解,能够进行简单使用
- 能够根据需求开发脚手架项目,如@choerodon/boot
- 熟悉敏捷开发流程
- 熟悉devops思想
- 对持续集成、持续发布(CI/CD)有所了解
研发中心于2018年5月开源Choerodon猪齿鱼项目。Choerodon猪齿鱼是一个开源企业服务平台,是基于Kubernetes的容器编排和管理能力,整合DevOps工具链、微服务和移动应用框架,来帮助企业实现敏捷化的应用交付和自动化的运营管理,并提供IoT、支付、数据、智能洞察、企业应用市场等业务组件,来帮助企业聚焦于业务,加速数字化转型。
框架组主要负责从前端框架层面提供支持,包括项目脚手架的维护和优化、部分技术选型、规范制定、方案探索、UI库的维护和优化、新技术的甄选和推进等。
-
开发@choerodon/boot脚手架
通过Nunjucks模板进行多模块整合打包,整合单体应用和微服务两种开发模式,提供了包括发布,编译等一系列钩子方便开发 -
设计并实现基于npm形式的发布和依赖模块方式
由传统的所有模块都在一个总项目下,进行统一编译转为各个模块编译后进行单独模块发布,在总项目中进行模块选择依赖,使各团队维护自己的模块时更加简单,责任更加清晰,而且使总前端的打包时长从30分钟缩短至12分钟(无需再对各个模块进行编译) -
优化原有环境变量注入方案,设计并实现前端环境变量注入方案
通过JS全局对象特性,使用Shell脚本和Node模拟合并用户自定义变量与内置变量,并且提供在镜像部署时根据不同环境进行变量替换的途径,增加了环境变量注入的灵活性,便于排错;避免了原来增加变量需要框架层做出修改,不利于维护和协调的困难 -
设计并实现了前端运行时主题色替换的方案
为了满足客户要求运行时的主题色替换的需求,原先的Less变量注入方案(只能满足编译时替换)已经不再满足。根据webpack打包流程,对输出文件前的样式文件进行处理,收集出所有相关颜色值进行单独管理,提供运行时替换的方案。 -
设计和优化了平台的权限体系和多语言结构,提供了如ws和文件服务统一处理的方式
基于约定先行的方式,设计了权限统一收集判断然后分发处理的机制。提供了外层WebSocket处理,使调用WebSocket更加简单和符合编程方式 -
Low-Code低代码平台开发
通过高度场景化的假设和数据库关系的抽象,开发了Low-Code平台,平台包括数据库管理、模型管理、模型设计、模型发布、菜单管理、模型预览和模型反向等部分。
主要负责数据库管理、模型管理、模型发布、菜单管理和模型反向等部分,打通整条线路,通过组件封装的思想实现模型反向展现的封装(通过结构化数据展示成具有逻辑和动作的页面),实现一对一、一对多、多对多等基础场景反向,已被公司Hzero框架集成并进行二次开发。 -
适合于Choerodon平台的快速开发平台方案探索和设计
以Fusion Design为参照,融合把设计引入整个开发流程并且起先行作用、以token来管理变量和物料化组件的独特思想,独立设计了适应于Choerodon平台的快速开发平台方案,并且对Fusion Design提供的脚手架项目进行阅读和个性化改造。 -
制定了Choerodon平台前端开发规范
初步制定了大家都普遍接受的前端开发规范,强调lint的必须性,推行React Hooks和函数式开发方式,规约开发习惯,使大家的代码更规范和“相似”,解决“优化代码不如自己重写,各有各的习惯”的问题。 -
日常Choerodon平台维护和开发
包括但不限于菜单管理,组织管理,项目管理,全局管理(多层级),用户管理,角色管理等企业级场景化的日常开发和维护。
敏捷开发组是Choerodon平台敏捷思维的一个体现,可以简单地概括为线上看板和配套平台,参考和汲取了JIRA,ONES Project等团队协作开发竞品的思想,主要包括故事地图、待办事项、活跃冲刺、问题管理和统计报告等几个部分。
-
使用React实现敏捷相关页面(故事管理,故事地图,报表,系统设置,模块管理)
使用Choerodon-ui为组件库,以MobX作为状态管理库进行复杂业务场景的开发,包括列表展示,表单提交,富文本编辑器,附件上传,拖拽等多种前端场景。在一个月的时间内完成快速交付,经过不停迭代后成为Choerodon平台体现敏捷思想的主要载体。 -
实现故事管理接收多页面参数并高可查询化开发
-
对项目进行性能优化,尤其是优化故事地图布局,提高组件渲染性能,整理拖拽情况,使页面可用性提升
通过更细粒度的组件拆分、PureComponent和shouldComponentUpdate的使用、逻辑和呈现分离、懒加载的分离和场景的抽离优化,使得原本在200张卡片就会比较卡顿和占用超大内存的情况得到解决,使用流畅且内存占用合理。
汉得应用开发平台(HAND Application Platform)是汉得公司为了应对移动互联网化、应用云端化、海量数据化和数字化服务转型的应用开发平台,是中台化产品和应用开发的基础平台。
随着前端技术的快速发展,HAP框架也由原来的jQuery向React,由Kendo UI向自研UI框架进行升级,升级过程中对原先页面仍提供支持,达到逐步迭代升级、提升开发效率的目的。
-
动态模块加载探索,高度场景化的表格和表单组件调研和探索
在绝大部分企业级应用中,表格和表单都是具有场景化的,以表格展示,表单修改、添加为展现方式,在表格上有多种操作,所以提取出公用的逻辑,以定义数据形式的方式来组织组件 -
开发choerodon-front-hap-boot作为新版HAP4.0的启动器,实现单模块和多模块的开发和发布
为了优化目录结构、简化开发和方便版本的管理,将启动器抽出为npm包发布并持续迭代至今。提供了启动器,HAP前端原有页面的兼容,新页面(React)的支持,通用部分如tab页,菜单和用户管理,首选项设置等角色。其中tab页组件在React Router的基础上进行扩展实现页面缓存的功能(最后迁移至开源库react-router-cache-route) -
为了便于后端人员开发,设计和简化两版模式模板,并规范了目录结构,调用方式等
-
组件开发
改造和封装了Modal(弹窗,包括抽屉和confirm类型),校对并修改了绝大部分组件的样式。开发树形组件,同时接受DataSet和原数据形式两种数据形式。修复部分组件库的问题。
该项目以React Native为开发语言进行移动端的微服务探索,通过CI生成镜像包,制定更新规则进行在线更新。通过提供安卓和iOS双平台的“壳子应用”,由“壳子应用”提供一些基本逻辑(如登录、角色验证)处理,通过本地存储的本地版本模板信息与远端的进行对比,实现模块的独立更新和管理。
主要包括:
- Android、iOS原生盒子应用的开发
- React Native的主应用开发
- React Native的各模块开发(数据统模块,各种基础功能的验证模块,包括地图、相机、通讯录等)
-
查找并解决日常开发中遇到的问题
当时React Native为0.46+版本,部分问题和解决方案还不是非常完善,通过探索完成了chunk的打包处理和本地文件的模块对比进行处理。还在React Native中文官网进行部分翻译纠错。 -
探究并实现了RN端与原生端的信息通信,和互相调用打开关闭,实现完整的移动端外壳应用。
-
学习并实现了Swift端外壳应用,采用drawer布局,支持一个常驻的RN chunk,即主菜单界面,根据主菜单界面的操作和事件调用原生端的事件,完成模块的下载,更新。
-
封装了多个独立模块
如调用原生的权限模块(摄像头,短信,地图权限),UI模块(按钮,条状信息栏,选择框),功能模块(图表展示监控信息模块monitor)等,基本调通开发中可能遇到的问题。
- 语言: 英语(6级)
- 技能: PPT(熟练制作,尤其是动画)、Photoshop/Sketch(简单使用)
- 兴趣爱好: 游泳、旅游、阅读(翻译一些简单的文档)、记录分享
- GitHub: https://github.com/HuangQiii