熟练掌握Javascript、TypeScript、Vue2.x、React全家桶、微前端Qiankun、小程序Taro、全景VR、Node、Koa、CSS3动画、Create.js、HTML5、Webpack、Git、Ajax、ECharts.js、Three.js、Antd、ElementUI、Vant、BMap、Mock.js
可以通过React/Vue+Node完成全栈项目搭建、开发以及上线的全链路闭环操作;
代码模块化开发,有代码洁癖,开发的项目类型有PC端项目、web-app、H5小游戏和微信小程序,项目使用Webpack进行打包压缩,用Git 进行代码版本管理以及提交上线。
TOne 一站式Devops平台
技术栈: Qiankun(微前端) + React全家桶 + ECharts + Antd
项目描述: 该项目运用Qiankun这款微前端框架实现了将部门中现在的工具和后续将要开发的工具都聚合到一个平台进行访问,汇总了流量和数据。
工作职责: 我作为该项目的前端owner负责此项目开发前期的技术方案调研和技术选型,带领组内几个同事以及外包同事完成此项目的搭建开发部署上线一整套流程;考虑到多平台融合到一个主平台并由主平台统一分发用户权限和访问相关平台的数据,最后选用微前端的思想所提供的Qiankun作为技术方案选型;其中主工程和部分子工程使用React全家桶配合Echarts和Antd完成项目复杂交互的开发,高效保质保量的交付给产品团队。
Sponge商业化平台
技术栈: Qiankun(微前端) + React全家桶 + Vue + Node + ECharts + Antd
项目描述: 该项目运用qiankun这款微前端框架实现了将各个商业化工具整合到一个平台,统一入口,集中流量访问。
工作职责: 此次项目我作为整体项目owner带领该项目组负责项目方案的选型以及负责主工程和部分子工程的项目搭建与开发,其中使用qiankun实现了主子工程通信和多环境切换,使用React全家桶和Vue实现了部分子工程的技术点和交互功能,此外主工程中还是用了Node.js进行的外层包裹,用作请求转发和对数据进行封装和整合、同时也实现了本地数据mock,大大减少了前后端耦合,提升了开发联调效率。
组队盘
技术栈: React全家桶 + BMap + Antd
项目描述: 该项目运用React全家桶实现了帮助区域总监和总经理进行对全国各个范围的楼盘的业务划分。
工作职责: 这里面通过对BMap的封装实现了在地图上区域划分、编辑区域和删除区域的功能,还实现了切换城市定位到当前城市并在地图上渲染该城市所有楼盘的功能,为大区总监等提供了操作作业范围的便利。
店东视图PC/APP
技术栈: React全家桶 + BMap + Antd + Vue + Vant
项目描述: 该项目帮助店东经纪人实现了查看各个时间段的各项业绩指标、自己所负责的片区楼盘的各种数据以及每天通过签到领取贝壳币并在内部商场购买商品。
工作职责: 使用React全家桶开发PC端平台,使用Vue开发H5端的App页面交互功能,在PC端实现了登陆、打点监控以及每个店东用户所负责的片区楼盘的数据查看,编辑等各种复杂的交互功能,在H5端实现了店东商城的商品购买以及用户浏览商品、添加商品到购物车等功能。
图灵APP
技术栈: React全家桶 + Antd-Mobile
项目描述: 该项目为城市总和区总监提供了查看各个房源、各个时间段的成交业绩和不同职级不同部门下的业绩总额和各种环比等复杂交互功能。
工作职责: 该项目是一个Web App,其中使用了React全家桶搭配Antd-Mobile组件库实现了对复杂报表的封装,使其能在滑到总业绩最大值时固定到页面的某个位置,滑到总业绩最小值时放开固定位置的功能。
抽奖活动配置后台
技术栈: Umi + Dva + Antd
项目描述: 该项目是为了公司运营同学开发的根据活动需求,可配置生成相应的抽奖页面,抽奖模版具有通用型,目前已开发完成《集五福》《刮刮卡》《老虎机》三个抽奖模版的开发,大大节省后期技术同事的开发时间成本,同时也可以脱离第三方兑吧的付费服务,为部门节省了很大一部分开支。
工作职责: 作为该项目的前端owner,负责前期的技术选型和项目搭建和需求划分,带领项目组使用了Umi + Dva完成了项目结构的搭建以及业务的开发,搭配Antd实现了多种抽奖模版的复杂交互功能以及抽奖信息的配置渲染数据功能。
手机卫士十周年全景H5
技术栈: Three.js + Canvas+Orienter.js + CSS3Rendererd
项目描述: 该项目以VR全景环视图的形式展现,使用场景+交互+功能跳转的形式为360手机卫士十周年活动带来全新的体验,可通过手机中的重力感应来体验全景的观感。
工作职责: 作为该项目的前端owner,使用Three.js等工具库独立完成了3D全景VR动画交互,其中还使用了CSS3搭配Antd实现了多种抽奖模版的复杂2D复杂动画交互以及抽奖、猜灯谜、领红包等功能。
链接: https://pop.shouji.360.cn/sw_ten_years/view_3d/index.html
360垃圾分类小程序
技术栈: Taro + React
项目描述: 该项目实现手机卫士首个支持多端访问的多元化小程序,满足微信、头条、支付宝、百度等主流多端小程序的访问,后续还支持在手机卫士客户端中访问小程序,扩大手机卫士品牌影响力;跟热点策略性抢位、打通多平台小程序、逐步创建360小程序矩阵。
工作职责: 作为该项目的前端owner,负责前期小程序实现的技术选型以及项目的搭建,带领其他同事一起使用Taro + React全家桶完成小程序业务需求的开发并push到各个应用App的开发者工具上实现多端访问的需求。
车联网
技术栈: Vue + Element-UI
项目描述: 该项目录入瓜子二手车车辆GPS数据、车况数据和车主驾驶行为数据、实现车辆定位、展示车辆轨迹、车辆行驶里程分析、车辆异常报警等数据并上报给数据平台进行实时数据分析。
工作职责: 使用Vue + Element-UI完成了车辆GPS数据、车况数据和车主驾驶行为数据、实现车辆定位、展示车辆轨迹、车辆行驶里程分析、车辆异常报警等图表展示和数据分析等功能以及复杂的表单交互。
H5跑酷类小游戏
技术栈: jQuery + Create.js
项目描述: 该项目是一个H5小游戏页面,在用户进入页面后,页面会自动滚动,用户通过点击页面完成一个躲避随机出现的障碍物以及左右跑动和领红包的一个复杂交互功能。
工作职责: 使用jQuery和Create.js来实现页面中各种障碍物随机出现的时间间隔、人物的跑动以及通过左右滑动实现人物左右移动的效果。
网易房产数据中心
http://data.house.163.com/bj/index.html
网易房产数据中心网站主要是用于统计各城市房屋成交数据,其中首页运用了Echarts插件实现了页面各种图表的多种效果需求,同时自己开发了城市选择的数据查询插件房产用户查询相关数据
网易楼盘库
http://xf.house.163.com/sh/nearby/BMKP.html
完成了详情、快讯、户型、相册、地图找房、计算器、反馈页面以及首页的计算器和地图找房功能运用jQuery和百度地图API实现地图找房以及查看楼盘周围环境的功能;实现了房贷计算器功能包括公积金贷款计算器、商贷计算器和组合贷款计算器三种计算方式,并运用ECharts.js图表向用户展示等额本息和等额本金两种计算结果。
Sponge商业化平台 角色:项目owner 技术栈: Qiankun(微前端) + React全家桶 + Vue + Node + ECharts + Antd 项目描述: 该项目运用qiankun这款微前端框架实现了将各个商业化工具整合到一个平台,统一入口,集中流量访问
TOne一站式Devops平台 角色:项目owner 技术栈: Qiankun(微前端) + React全家桶 + ECharts + Antd 项目描述: 该项目运用Qiankun这款微前端框架实现了将部门中现在的工具和后续将要开发的工具都聚合到一个平台进行访问,汇总了流