基于React的前端广告组件库的设计与实现

发布时间：2021-06-11 03:44

　　近年来,随着前端技术的迅速发展,web前端的工程化和组件化逐渐成为一种趋势和共识,而广告包括类广告形式已经成为前端项目不可或缺的部分。随着前端项目的复杂度越来越高,传统的网络广告的前端制作方式存在着一定的弊端。为了提高前端开发人员的开发效率,实现网络广告表现形式的艺术化以及网络广告的合理化、精细化,进一步对网络广告效果进行合理的归纳分类,需要开发一套包含多种广告效果且易于前端开发人员调用的广告组件及其辅助平台。本文对现今的网络广告的前端表现形式进行了调研、扩展、总结,从广告艺术设计角度和动效表现形式的不同归纳了五大类别的网络广告,包括横幅类广告、悬浮类广告、收缩类广告、纯文本类广告和交互类广告。本文描述了每类广告具体的表现形式,给出了每类广告组件提供给前端开发人员的API,并详细阐述了每类广告组件的内部编程组织逻辑和关键广告效果的实现方法;网络广告相对于传统广告的一个显著区别是,网络广告具有互动性。其互动性需要动效的支持。平台设计并封装了能满足项目需求的底层基本动画库,分析了底层动效组件的种类,以及每一类底层动效提供的功能,分别给出了对应的API并详细阐述了每类动效组件的内部编程组织逻... 

【文章来源】：山东大学山东省 211工程院校 985工程院校 教育部直属院校

【文章页数】：82 页

【学位级别】：硕士

【部分图文】：

图３－１工程的文件结构图??女口上图戶斤示，ｄｅｖＳｅｒｖｅｒ．ｊｓ、Ｐａｃｋａｇｅ．ｊｓｏｎ、Ｗｅｂｐａｃｋ．ｃｏｎｆｉｇ．ｊｓｏｎ、ｎｏｄｅ—ｍｏｄｕｌｅｓ??

图３－２平台的组织逻辑图??组件库的逻辑架构设计本质就是该网络广告组件库的组件设计

?Ｓｉｒｎｐｌｃｌ＇ｉｍｃ?１?ｉｒｉｃ．?ｊｓ?编程’、火：．现??图３－２平台的组织逻辑图??组件库的逻辑架构设计本质就是该网络广告组件库的组件设计。按功能封装??组件，－个组件做出一些变化，ｒｅａｃｔ的单向数据流原则会把这个变化得到的数??据传递给另一个组件，另一个组件就可以自动做出相应的变化，并且各个组件之??间是低耦合的，按逻辑组合组件，由小组件构建大组件，实现组件的分层Ｍ。??每一类广告组件，根据需求又可以继续对该组件进行拆分，直到拆分出粒度??比较细的组件，即可进行编写对外封闭独立的组件，每个组件需要对外提供属性??配置的接口。最后再按照逻辑将所有的组件组装起来。??动效组件以样式表设计为基础，每一类广告静态的表现效果，主要依赖样式??表的设计。利用ｒｅａｃｔ的数据驱动特性，使用ｒｅａｃｔ函数式编程实现动态样式表??的设计

【参考文献】：
期刊论文
[1]提高用户体验的CSS3技术应用研究[J]. 陈梅.  电脑知识与技术. 2015(13)
[2]MVVM设计模式及其应用研究[J]. 陈涛.  计算机与数字工程. 2014(10)

硕士论文
[1]儿童益智网站网络广告的计算机制作与应用[D]. 张娴.山东大学 2009
[2]企业网络广告设计研究[D]. 宋翠君.合肥工业大学 2006
[3]网络广告形式及研究[D]. 沈蕾.东华大学 2005



本文编号：3223741