熟练使用HTML、CSS高度还原设计图;熟悉掌握CSS3常用的特性,简便完成布局;
熟练使用JavaScript中的基本对象及操作、闭包、DOM操作等;掌握ES6常用特性;
基本使用TypeScript进行类型定义,规范变量;
熟练掌握React框架、HOOK、结合状态管理Dva完成项目开发;使用UMI框架进行日常开发;
熟练使用Ant Design、Ant Design Mobile、ECharts、a hooks前端库;
使用MAKEAPIE记录图表作品,方便快速开发;
熟练使用Git,遵守分支命名规范、提交规范以及分支合并流程;
基本使用Webpack进行项目打包;
使用eslint进行代码检查,规范代码; Prettier插件进行统一代码风格;
洞察引擎 2020年7月 – 至今项目描述 : 洞察引擎是一款对品牌以及战役进行多角度、多平台的数据分析工具。极速洞察模块可以跨平台整合行业内大量品牌数据,对品牌的营销卖点、内容策略、媒介策略、传播效果深度洞察,支持品牌横向对比,进行数据分析;战役指数模块分析所在行业社交平台战役列表;同时对战役从传播表现、媒介表现、人群分布等维度进行深度分析,支持横向对比战役;数据摩天轮中提供品牌更需要的单品分析、关键词分析功能,支持任务横向对比;
项目技术栈 :React、Umi、ahooks、Es6、ECharts、Ant Design;
个人职责 :
参与项目需求沟通以及功能交互,组织前端小组成员进行分工、撰写设计文档;
洞察引擎首页主要完成了数据洞察平台等部分内容的重构以及新增竞争态势、行业研究等内容,竞争态势中加入了呼吸灯动画突出重点内容,同时也封装了scrollAnimation方法,使滚动条运动速度均匀;
极速洞察模块中热度趋势组件实现用户头像在折柱混合图上显示,重叠用户头像进行横向排版;品牌词云部分实现了动态词云的展示;
品牌工坊详情页中实现了模块一屏滚动的效果,使图表有更大的空间进行展示,也支持快速切换到某个图表,同时也封装了maxBalance方法,提供给前端同学进行计算数值的百分占比;
战役指数排行首页中的搜索功能实现了分流处理,可以使用户精准的进行搜索,封装了自定义Hook-useDebounce进行搜索性能优化,战役内容的展示分为列表模式、日历模式,列表模式下,封装了Table基础组件,在后期进行优化,使Table组件更加健壮,覆盖行更强,日历模式中使用了虚拟列表,使页面挂载Dom数减少,提升页面加载速度;
摩天轮任务对比详情中封装了锚点组件,在长页面中可以快速定位到具体某个模块,方便用户快速查看,整个页面实现了根据任务数量不同的动态布局;在关联话题模块中,根据真实数据返回的情况,各平台灵活的展示话题个数;
每一期开发中逐步熟练使用TypeScript;
洞察引擎-移动端H5
项目描述 : 主要引流洞察引擎PC端,方便用户进行快捷登录注册以及品牌认证等功能;
项目技术栈 :React、Umi、ahooks、Es6、Ant Design Mobile;
个人职责 :
独立负责整个项目以及项目架构的搭建,主要使用vw相对单位进行不同尺寸设备的适配;
主要完成的功能 : 用户登录注册、用户提交品牌方认证、用户提交营销项目;