Design And Realization Of AD Component Library Based On The React For Front-End

In recent years,with the rapid development of the front-end technology,engineering and component gradually become a trend and consensus,and advertising including something similar to advertising has become an integral part of the front end program.With the increasing complexity of front-end projects,the front-end development of traditional Internet advertising has certain disadvantages.In order to improve the development efficiency of the developers,to achieve an artistic expression of Internet advertising and the rationalization,and refinement of Internet advertising,to make a reasonable classification of Internet advertising effect,it is necessary to develop a set of advertisement component library that contain all advertising effect category and are easy to invoke for front-end developersThis thesis investigates,expands and summarizes the front-end representation of Internet advertising,summarizes that five categories of advertisement in terms of the advertising art design and different forms of dynamic performance.This thesis describes the specific manifestation of each type of advertisement,gives the API of each type of advertisement component to the front-end developer,and it also elaborates the organizational logic of each ad component and how it works.One significant difference between online advertising and traditional advertising is that online advertising is interactive.The interaction of online advertising requires dynamic support.The platform designed and encapsulated the underlying basic animation library which can meet the project requirements,analyzes the types and functions of the dynamic component,provides the API,and elaborates the organization and implementation method of the component.The front-end development and application of online advertising integrates graphics,image,text,video and animation,which is a form of ad expression combining technology and art.This thesis describes how to construct a development environment and develop components using the open source framework of React +ES6 + Webpack + Node.The MVVM front-end mode for this project is explained in detail.This thesis introduces how to use the front end animation technology such as GreenSock,Svg,Canvas,Html5,CSS3 and so on to design and realize the reasonable advertisement animation effect.This thesis introduces the implementation method of each kind of advertisement component in detail.Based on specific application examples,this thesis explains the usage methods of each category of advertising components,including Banner ads,PopUp ads,Scalable ads,Marquee ads and Interactive ads.The platform has been successfully applied on some websites and has achieved certain effects and improved the development efficiency.