陈智鹏
高级前端开发工程师
- 男 / 1996.05
- 湖南工业大学 · 计算机科学与技术
- 本科 / 2017年毕业
- 工作年限：7年
经历
历达信息技术（广州）有限公司
2021.06 - 至今负责PC端系统研发以及重构主要模块，包括：
- 负责PC端系统研发与重构，主导技术选型、难点攻克及公用组件开发
- 基于Vue3.x + TS，完成新系统研发，优化开发效率和代码质量
- 使用React18 + TS重构系统核心模块，同时将部分模块升级到Vue3
- 开发自定义Google Map和拖拽表单组件，提升业务灵活性
- 负责响应式页面适配与性能优化，提升跨设备兼容性
广州找原料网
2018.04 - 2021.04参与 美业大数据服务平台 的前端开发，包括：
- 负责团队基础技术支撑，包含构建流程、工具包、新技术探索实践等
- 基础UI组件与业务组件开发，支撑业务快速迭代、统一视觉规范
- 主要参与PC端大数据项目从0到1开发，微信小程序项目开发
- 参与公司内部后台管理系统以及官网开发
- 使用Vue全家桶和ES6+语法开发h5页面
全思科技
2016.09 - 2018.03参与技术团队前端开发，包括：
- 高度还原设计稿，并实现客户和UI设计师的想法
- 桌面端、移动端、微信公众号、H5页的开发与优化
- 实现PC端、移动端、响应式页面的适配与优化
- 完善项目构建流程与开发规范，解决前端项目混乱与效率低的问题
- 研究新技术，学习并掌握了Vue、Fis3等前端前沿技术
技能
- 理解JS原理，包括事件循环、闭包、原型链，熟练掌握ES6+新特性
- 精通TypeScript，具备大型项目类型系统设计经验，构建可靠约束
- 深入掌握Vue生态，能独立架构大型应用，擅长性能优化与状态管理
- 深入理解浏览器原理，包括渲染流水线、网络优化、安全机制
- 精通前端工程化，包括模块化、构建优化、CI/CD
- 具备中大型复杂应用开发经验，熟悉Vue和React生态技术栈
- 熟练掌握Vue3.x，并在项目中应用Composition API等新特性
- 深入理解React技术体系，熟练使用Hooks进行组件开发
- 熟悉Element UI、iView、Ant Design等主流UI组件库
- 掌握Vue和React的性能优化技巧，如懒加载、代码分割等
- 掌握小程序调试、性能优化扩展技能
- 掌握小程序开发框架Taro3.x、Mpvue、WePY，了解uni-app
- 熟悉Vite、Webpack等构建工具，了解基本原理和模块依赖分析
- 了解脚手架工具原理，掌握命令行交互和模板渲染
- 能根据项目需求配置构建流程，进行资源优化和热更新
- 熟练使用Git进行代码版本管理和团队协作，掌握分支管理和代码评审
- 善用ChatGPT等AI工具辅助开发，提升编码效率和代码质量
最近项目
项目概述：
基于Salesforce系统开发的房地产后台管理系统
工作职责：
负责项目进度的管理，技术方案选型，难点攻克，公用组件开发和业务开发
技术选型：
- 使用Vue3生态及最新Composition API、Setup语法编写代码
- 使用Element Plus作为组件库，使用TypeScript语法编写代码，使代码更有鲁棒性
- 使用Eslint、Prettier、Husky等工具制定编码规范与提交规范
- 基于Element Form二次封装数据驱动表单组件，实现可拖拽生成表单
- 在系统1.x使用vue/composition-api、unplugin-vue2-script-setup实现类vue3语法编写代码
项目难点：
- 无任何文档情况下基于现有代码逻辑重构大量表单及业务逻辑，前期在考虑到升级Vue3工作量巨大的情况下，引入vue/composition-api、unplugin-vue2-script-setup实现类vue3语法编写代码，为后期全面升级Vue3.x做好铺垫
- 基于Element form二次封装数据驱动表单组件，可简单使用类JSON配置来实现大型复杂表单，包含表单联动显示/隐藏、启用/禁用、获取 options 值， 可以通过插槽自定义表单项, 轻松实现任意自定义表单项,表单内还封装大量通用表单控件以供快速使用
- 基于封装的表单组件实现可拖拽自定义表单功能，用户可自定义表单布局、控件等，自定义Google Map开发
项目概述：
基于Salesforce系统开发的游艇租赁管理系统
工作职责：
负责技术方案选型，难点攻克，公用组件开发和业务开发
技术选型：
- 使用React 18及最新Hooks API编写代码，采用函数式组件提升性能
- 使用TypeScript进行类型检查，提高代码可维护性
- 使用Ant Design Pro作为基础框架，快速搭建企业级应用
- 使用Redux Toolkit管理全局状态，优化状态管理方案
项目难点：
- 基于RBAC模型设计权限系统，使用React Router 6结合动态路由实现细粒度的权限控制
- 封装动态表单引擎，支持JSON配置生成复杂表单，并实现表单验证、联动等高级特性
- 使用React.lazy和Suspense实现代码分割，优化首屏加载性能
- 实现响应式布局，采用CSS Grid和Flex完美适配多端显示
项目概述：
美业颜究院”是美业大数据定制服务平台，美业大数据分析工具。
工作职责：
参与技术选型及开发
技术选型：
- Vue生态技术链做基础支撑，使用Axios作为HTTP库，使用easy-mock模拟数据
- 基于iView-admin开发, 考虑项目为公司业务转型的重要项目，前期投入必须达到快速开发及试错
- 使用 v-charts 生成与设计稿一致的图表，完成图表交互，使开发图表更贴近Vue开发体验
项目难点：
- 项目从0-1开发，前期没有大数据团队，需要协助后端做数据抓爬技术攻关
- 项目前期试错，设计经历多次推倒重来，开发周期不变，对开发人员开发效率是个很大的考验
- 根据UI设计需求，基于ECharts实现各式各样的图表样式及交互
- 防止账号共享问题，难点在于web上没有办法获取到Mac地址，前期考虑使用 浏览器指纹技术但是生成的指纹无法100%一致，后面使用微信小程序扫码方式登录，小程序上获取地理位置，限制在指定范围内登录，登录成功后端会在Cookie写入一个Mac地址来绑定用户浏览器，缺点是只能绑定一个浏览器，但是能解决业务上的问题
项目概述：
美业颜究院功能简化后的小程序版
工作职责：
参与技术选型及开发
技术选型：
- 使用 Taro3.x 框架开发
- 使用 Vant Weapp 作为第三方组件库，解决在taro上使用的一些 问题
- 使用 ECharts小程序版 进行图表绘制
- 使用 Painter 绘制分享图片，类css的方式绘制图片,有效加快开发效率
项目难点：
- 自定义tabBar
- 生成各类样式的分享图片，由于是通过Canvas绘图，很多元素需要计算位置，是否换行等
- 图表使用Canvas绘制，属于原生组件，普通元素无法覆盖在上面，需要覆盖在上面的元素全部使用cover-view