七年以上专业前端开发及三年以上架构经验，带过团队，责任心强能专研攻坚；熟练掌握React\Vue技术栈、移动端H5及小程序开发；主攻前端也略涉后端node和linux服务运维。


能力描述
- 熟练掌握HTML5\CSS3等PC和H5页面开发技术，能够解决各种浏览器兼容性问题；
- 熟练掌握JavaScript原生开发，熟悉NodeJS\Express\Koa\Mongodb开发后端服务；
- 熟练掌握React\Vue框架开发，及ElementUI\Ant Design\Vuex\Redux\Mobx\SSR等技术栈应用；
- 熟练使用Webpack对前端项目工程化及组件化应用，充分理解前后端分离技术；
- 熟***开发，熟悉React Native编写原生应用；
- 熟练掌握NodeJS挖掘数据开发爬虫服务；


自由职业者，远程办公优先，可接受短期驻场


提供的服务
web网站开发，移动端H5及小程序开发，网络爬虫开发等。


项目经验
远程项目：
1. LoMoStar3.0   [2020.1-至今] 
项目描述：LoMoStart是一款基于区块链技术的游戏社交和分发平台APP，用户在平台的任意游戏资金可互转变现、购买装备或游戏点卡等。
项目职责：我负责游戏点卡的前端开发，技术栈React/Mobx/Ant-mobile/ReactNative。
webview中加载点卡服务和native通信获取状态。
选择不同币种下单支付购买点卡，数字货币的精准计算和展示使用decimail库。 
缓存点卡响应数据避免不必要的重复并发请求，tab标签切换和分页加载处理。 
使用react-intl-universal 国际化处理5国语言。
项目成果：点卡服务准时上线，安全稳定运行。
项目链接: https://lomostar.com/
2. Offer多多     [2019.12-2020.1]
项目描述：Offer多多是基于一亩三分地论坛多年积累的申请背景和录取汇报数据，为你量身打造的一站式留学选校申请工具。
项目职责：我负责个人主页、名校讨论等模块的前端开发，技术栈基于React服务端渲染框架Next.js和Mobx/AntDesign。
仿写spectrum.chat聊天室开发名校讨论页面，响应式布局适配PC和Mobile端。
开发订阅提醒功能，基于OneSignal跨平台消息推送。
原论坛BBCode标签的解析转义。
项目成果：完成迭代更新，安全稳定运行。
项目链接: https://offer.1point3acres.com/


个人项目：
小程序：房价十年，收集整理过去十年房价趋势变化，数据爬取自各大房产网站。
小程序：专心时刻，番茄工作法，专注当下时间，记录自己的任务，数据本地存储，隐私安全。
小程序：人气***气排行榜，圈子排名，数据***


过往项目：
1. 落地页管理系统 [2019.9-2019.11]
项目描述：落地页管理系统是提供给运营与设计人员使用的营销活动管理平台，通过拖拽UI组件生成可维护的落地页面在小程序及H5端实时展现；项目包含后台Node服务与前台管理系统。
项目职责：我负责整个项目的前后端开发，后端技术栈node+Koa+mongodb，提供落地页的更删改查API服务、素材的上传更新及有效期定时检测等。
前端技术栈Vue+Vuex+Vue-route+EmenetUI+Axios，开发实现组成页面所需的基础组件及业务营销组件。
通过可视化的拖拉新建多个组件操作组装成页面，可编辑修改组件的属性、层级及排序等。
项目成果：运营可自主搭建及维护所需活动页面，封装及复用常用业务组件，减少开发成本，提高生产效率。
项目链接: https://github.com/YuniorZen/landpage

2. 剪刀石头布智选商城-小程序 [2019.7-2019.11]
项目描述：剪刀石头布智选商城是剪刀新零售部门从实体售卖转型电子商务的小程序产品；集浏览、咨询、预约、购买为一体的线上服务。
项目职责：我主要负责通用组件封装及架构调整，参与开发小程序端的业务实现及页面优化。
对小程序通用业务处理及方法抽离统一成通用模块调用。
提取相似布局和功能到自定义组件，如：tab切换，顶部导航等。
配合产品及设计调整优化页面交互和细节问题。
项目成果：交互体检上更加友好，代码可维护性更高。

3. 享选车-斯柯达车辆配置器 [2019.1-2019.3]
项目描述：享选车是为上汽斯柯达开发的实时3D渲染，实时配置的数字化选车，配车产品。包括与unity3d集成的ipad客户端，与ue4集成的surface和led大屏幕pc端。
项目职责：我参与并负责整个项目的前端开发，前端架构采用的是vue + vue-router + vuex。
实现前端UI层的页面交互开发，和Unity3D、UE4层的混合开发及通信封装。
ESLint规范开发协作，基于webpack构建打包，后续的ota升级的机制设计和开发。
项目成果：完美与unity3d集成到ipad客户端，实现高还原度的实时3D选车产品。

4. 上汽斯柯达商城 [2018.11-2019.1]
项目描述：上汽斯柯达商城项目是上汽斯柯达对外为用户提供的集购车、选车、养车、保险等服务的购物商城，包括PC和移动两个终端平台的实现。
项目职责：我负责参与PC和移动商城的前端开发，主要涉及首页\详情页\下单页\个人中心的前端开发。
使用 React + react-router + react-redux 实现组件化的单页面应用。
使用less编写预处理样式，基于ant构建pc端页面交互，ant-mobile实现移动端页面交互。
项目成果：项目提前上线并运行稳定，得到客户的肯定和赞许。
项目链接: https://www.saicskoda.com.cn/

5. 云息数据 -小程序营销流程自动化 [2018.7-2018.9]
项目描述：云息数据是面向小程序端用户进行主动营销的toB平台，通过对营销节点拖拽和编辑来实现营销流程可视化配置。
项目职责：我负责整个项目的前端开发，基于webpack+vue+router技术栈构建。
采用构造函数+原型的形式将这整个流程的初始化和绘制逻辑封装成对象； 基于html5的drop事件对dom进行拖拽开发。
通过event坐标判断节点的碰撞和上下级关系，绘制后将数据存储到对应节点数组中。
引入svgsnap绘制矢量曲线满足多节点的链接和更多自定义的交互布局。
项目成果：实现了可视化的营销配置，减轻运营人员的重复操作，提高运营效率和转化率。自主研发实现流程控制，可满足日后的自定义和易拓展需求。
项目链接: https://yuniorzen.github.io/ProcessConrol-SVG/dist/

6. 智橙移动DSP系统 [2016.11-2017.3]
项目描述：该项目是面向广告主和代理方的移动广告竞价投放系统，新建投放项目，上传素材，设置定向策略包，然后投放广告查看数据报表。
项目职责：我负责主导前端项目的开发，基于vue+gulp构建开发。
前后端分离开发，ajax获取数据，登录获取用户权限列表，动态生成菜单，页面权限按钮通过自定义指令显示隐藏。
页面路由通过location.hash实现，onhashchange监听路径变化并展现对应视图。
对定向区域人群等常用穿梭框、级联选择交互抽离成组件，通过props和event bus实现数据下发上传及组件通信等。
项目成果：完善公司的程序化广告产品，业内较高口碑的dsp系统，为公司赢得行业内不少奖项。
项目链接: https://www.zcdsp.com

7. 百橙ADX平台广告JS脚本 [2015.11-2016.3]
项目描述：该项目是给媒体方加载广告的脚本，类似google\百度广告引入脚本，负责请求和展现广告，并针对客户端和用户的行为进行收集上报分析等。
项目职责：我负责整个脚本的开发和维护并与后台人员沟通解决方案。
通过postMessage+window.name的方式解决跨域通信的问题和兼容ie8以下浏览器。
使用闭包设计为单例模式，保证同一个页面广告脚本只初始化一次且收集的客户端参数和请求结果作为实例参数共用。
获取引入标签及参数并根据返回的广告模板和数据编译后在对应位置生成广告内容。
wap端广告按比例伸缩，广告模板写入iframe，rem布局，动态设置body font-size值。
对响应的广告内容crc32校验并收集客户端信息和触发的事件，通过image或form提交上报。
项目成果：稳定运行在上百主流媒体站点，日执行量千万次以上，且兼容低浏览器，月报错上传基本为0。为公司结算和媒体提供可靠数据分析。
项目链接：https://ssp.bcadx.com/

8. 新华网广告系统 [2016.3-2016.9]
项目描述：该项目是为新华网定制的广告刊例排期管理和投放系统，用来管理媒体站点上的广告位和素材更新等。
项目职责：我负责主导系统的广告位管理和报表模块开发及广告加载脚本开发，协助和跟进前端部门同事开发。
技术框架采用Angular+Jquery实现dom数据渲染和视图交互效果。
开发实现广告排期日历，显示对应日期的广告位数量、广告位详情展示和新建。
使用webuploader上传广告素材，设置广告参数，实时预览广告位效果。
项目成果：项目提前上线并稳定运行，提高对页面中广告位替换和更新的效率。

9. 米其林腾讯朋友圈H5广告 [2015.12-2015.12]
项目描述：为客户米其林做的一个圣诞节活动H5，用来投放腾讯朋友圈广告进行品牌宣传。
项目职责：我负责整个H5活动的开发***架wxmoment开发。
通过rem布局和js动态设置body fontsize适配不动的分辨率。
设置data-img属性预加载图片资源，首屏百分比显示资源加载进度。
css3动画实现活动的交互和趣味性，不断调整animation使动画更加的协调。
项目成果：提前上线并按时投放朋友圈，投放期间稳定运行，得到客户认可。
项目链接：https://yunior.gitee.io/website/mql/

10. 银橙传媒官网 [2014.12-2015.02]
项目描述：银橙传媒的官方网站，主要展现银橙的业务平台、客户案例以及更新公司相关信息等。
项目职责：我负责整个项目的前端开发，基于jquery+fullpage实现横竖屏滚动切换效果。
使用rem响应不同分辨率的内容大小，媒体查询适配pad端或特殊比例屏幕下的页面布局。
项目成果：高保真还原设计图到web浏览器，提升自己的专业技能。
项目链接: https://yunior.gitee.io/website/ycmedia/