到底是什么是前端工程化 模块化 组件化 - 网页设计实例教程 网页特效教程.docx

上传人:安*** 文档编号:19271885 上传时间:2022-06-05 格式:DOCX 页数:5 大小:17.74KB
返回 下载 相关 举报
到底是什么是前端工程化 模块化 组件化 - 网页设计实例教程 网页特效教程.docx_第1页
第1页 / 共5页
到底是什么是前端工程化 模块化 组件化 - 网页设计实例教程 网页特效教程.docx_第2页
第2页 / 共5页
点击查看更多>>
资源描述

《到底是什么是前端工程化 模块化 组件化 - 网页设计实例教程 网页特效教程.docx》由会员分享,可在线阅读,更多相关《到底是什么是前端工程化 模块化 组件化 - 网页设计实例教程 网页特效教程.docx(5页珍藏版)》请在taowenge.com淘文阁网|工程机械CAD图纸|机械工程制图|CAD装配图下载|SolidWorks_CaTia_CAD_UG_PROE_设计图分享下载上搜索。

1、到底是什么是前端工程化模块化组件化-网页设计实例教程网页特效教程-最新IT资讯_电脑知识大全_网络安全教程-次元立方网提到前端往往很多人的映像就是入门简单,HTML、CSS加一起一个星期基本上就能大概上手,JS难一点但也能很快写一些简单的小效果,在网上随意一搜索各种特效代码随意用,一个新手前端也能在很短的时间里写出炫酷的页面效果,然而入门简单并不意味着前端这碗饭很好吃,做惯了切图、布局、扣特效的前端新同学在向前发展的路上越来越觉得吃力,而没有任何编程思想和软件开发基础很多人对前端工程化、组件化、模块化、MVC这些高大上的词汇云里雾里。本文用最简单的语言介绍一下我对工程化、组件化、模块化的理解,

2、面向的对象是前端新手,所以我用最好理解的方式去讲,难免会有很多幼稚的表述,请大神们轻喷。本文重点介绍思想不涉及太多直接的技术,假如新手同学们理解了思想以后能够多多百度、谷歌去学习详细的技术,我也会在后续的文章中做一些介绍和大家一起学习。前端工程化还记得我在最早期写前端代码时,往往一个页面就是一个文件搞定,HTML/CSS/JS全部写在一起,后来知道应该把构造、样式和动作分离,我想这是我接触到最早的前端工程化的思想了,所谓前端工程化我以为就是将前端项目当成一项系统工程进行分析、组织和构建进而到达项目构造明晰、分工明确、团队配合默契、开发效率提高的目的.工程化是一种思想而不是某种技术当然为了实现工

3、程化我们会用一些技术,这样讲还不够详细,举个例子来讲:要盖一栋大楼,假设我们不进行工程化的考量那就是一上来掂起瓦刀、砖块就开干,直到把大楼垒起来,这样做往往意味着中间会出现错误,要推倒重来或是盖好以后构造有问题但又不知道出如今哪谁的责任甚至会在某一天轰然倒塌,那我们假如用工程化的思想去做,就会先画图纸、确定构造、确定用料和预算以及工期,另外需要用到什么工种多少人等等,我们会先打地基再建框架再填充墙体这样最后建立起来的高楼才是稳固的合规的,什么地方出了问题我们也能找到源头和负责人。前面我讲接触最早的工程化思维就是构造、样式和动作分离,在只要若干个页面的小型项目我们只需要用这些简单的做法就能把项目

4、很好的组织起来,但是在一个大型web项目中往往有愈加复杂的构造和非常多的页面需要很多人甚至是多个团队配合才能把项目做完,我们需要有愈加严谨和复杂的工程化思维去组织构造。从更高层面的项目组织来看我们要做项目的各种规范、技术选型、项目构建优化等等,在代码层面我们还需要用到JS/CSS模块机、UI组件化等开发方式。再用一句通俗的话来概括前端工程化:前端工程化就是用做工程的思维看待和开发本人的项目,而不再是直接撸起袖子一个页面一个页面开写前端模块化前面我们提到在组织代码的时候会用到模块化和组件化,大家应该理解到,前端工程化是一个高层次的思想,而模块化和组件化是为工程化思想下相对较详细的开发方式,因而能

5、够简单的以为模块化和组件化是工程化的表现形式。那详细什么是模块化呢,还是举简单的例子,我们要写一个实现A功能的JS代码,这个功能在项目其他位置也需要用到,那么我们就能够把这个功能看成一个模块采用一定的方式进行模块化编写,既能实现复用还能够分而治之,同理在写样式的时候,假如我们需要某种特殊的样式,会在很多地方应用,那么我们可以以采用一定的方式进行CSS的模块化,详细讲来,JS模块化方案很多有AMD/CommonJS/UMD/ES6Module等,CSS模块化开发大多是在less、sass、stylus等预处理器的import/mixin特性支持下实现的,详细技术大家自行学习。总体而言,模块化不难

6、理解,重点是要学习相关的技术并且灵敏运用。前端组件化前文中我们提到过,组件化也是工程化的表现形式,那么到底什么是前端组件化呢页面上的每个独立的、可视/可交互区域视为一个组件;每个组件对应一个工程目录,组件所需的各种资源都在这个目录下就近维护;由于组件具有独立性,因而组件与组件之间能够自由组合;页面只不过是组件的容器,负责组合组件构成功能完好的界面;当不需要某个组件,或者想要替换组件时,能够整个目录删除/替换。组件化将页面视为一个容器,页面上各个独立部分例如:头部、导航、焦点图、侧边栏、底部等视为独立组件,不同的页面根据内容的需要,去盛放相关组件即可组成完好的页面。PS:模块化和组件化一个最直接的好处就是复用,同时我们也应该有一个理念,模块化和组件化除了复用之外还有就是分治,我们能够在不影响其他代码的情况下按需修改某一独立的模块或是组件,因而很多地方我们及时没有很强烈的复用需要可以以根据分治需求进行模块化或组件化开发。

展开阅读全文
相关资源
相关搜索

当前位置:首页 > 应用文书 > 策划方案

本站为文档C TO C交易模式,本站只提供存储空间、用户上传的文档直接被用户下载,本站只是中间服务平台,本站所有文档下载所得的收益归上传人(含作者)所有。本站仅对用户上传内容的表现方式做保护处理,对上载内容本身不做任何修改或编辑。若文档所含内容侵犯了您的版权或隐私,请立即通知淘文阁网,我们立即给予删除!客服QQ:136780468 微信:18945177775 电话:18904686070

工信部备案号:黑ICP备15003705号© 2020-2023 www.taowenge.com 淘文阁