精华内容
下载资源
问答
  • 前端工程化

    热门讨论 2017-10-08 17:38:01
    【为什么出现了前端工程化?】 09年之前,我们学习的css,div,js只是对页面设计进行一个打辅助的功能,当时只能勉强的成为页面设计师,为什么会出现前端工程师: 1.突然间前端的需求逐渐增多,用户对界面的要求...

    【为什么出现了前端工程化?】

         09年之前,我们学习的css,div,js只是对页面设计进行一个打辅助的功能,当时只能勉强的成为页面设计师,为什么会出现前端工程师:

    1.突然间前端的需求逐渐增多,用户对界面的要求越来越高,前端范畴越来越大。

    2.前后端总是保持一致才能进行开发,不能分开开发,提出前端工程化,也可以引用后端开发中的优点儿,放到前端,多么高大上的一门技术。

    3.前端就是把控件有艺术性的摆放到窗体或者页面上,我们想到了控件,为什么我们不取模块化开发呢,将组件和模块作为中心,用css,div,js进行辅助,实现组件的复用。

    4.开发团队的人数不断增大,如果不能保证前端工程化,协调合作问题怎么解决。

    【前端工程化又是什么?】

         从开发到部署一系列操作,选择什么样的框架,搭建什么样的目录,其中就包括了引用什么样的组件,开始在软件里面写代码,最后实现构建和部署。

    【前端工程化-angular】

             下次再扯。

     

      

     

     

    展开全文
  • 前端工程化开发

    2019-09-20 22:46:46
    前段时间对于前端工程化的理解尚停留在用gulp或者webpack自动构建的层次,但其实包括自己在做项目的过程中早就在践行「工程化」开发,以下结合一些博客以及自己的理解详述前端工程化开发的含义。 文章目录前端工程...

    前段时间对于前端工程化的理解尚停留在用gulp或者webpack自动构建的层次,但其实包括自己在做项目的过程中早就在践行「工程化」开发,以下结合一些博客以及自己的理解详述前端工程化开发的含义。

    前端工程化开发

    references:

    浅析前端工程化

    个人对前端工程化的理解

    对前端工程化的理解

    概念

    前端工程化是使用软件工程的技术和方法来进行前端项目的开发、维护和管理。
    这里顺带说下软件工程的概念:应用计算机科学理论和技术以及工程管理原则和方法,按预算和进度,实现满足用户要求的软件产品的定义、开发、和维护的工程或进行研究的学科.

    软件开发的整个流程我在我的博客:前端开发工作流程中做过更新。

    内容

    技术选型

    在开始前端工程时,根据项目特征进行技术选型,节省项目开发时间。

    代码规范

    保证团队所有成员以同样的规范开发代码。
    不同的开发人员开发不同的功能或组件,按照统一的流程合并到主干。

    推荐airbnb javascript style

    模块化开发,组件化开发

    模块是在文件层面上,对代码和资源的拆分,比如js模块,css模块。组件是在UI层面上的拆分,比如页头,页脚,评论区等

    模块管理

    一方面,团队引用的模块应该是规范的;另一方面,必须保证这些模块可以正确的加入到最终编译好的包文件中。(以上两点可以总结为模块化或者组件化开发。)

    自动化测试

    为了保证和并进主干的代码达到质量标准,必须有测试,而且测试应该是自动化的,可以回归的。

    构建

    主干更新以后,自动将代码编译为最终的目标格式,并且准备好各种静态资源,

    部署

    将构建好的代码部署到生产环境。

    一点思考

    一般在做迭代的时候会有一定的概率影响之前一些公共或者非公共的组件,如何实现自动化的回归测试,是一个值得探讨的地方。

    tips: 寻找webpack的依赖树?

    展开全文
  • vue前端工程化

    2018-08-22 23:41:28
    前端工程化,如何利用weback构建前端项目,从零开始。
  • VUE进阶 笔记贰章 前端工程化
  • 前端工程化包含一系列规范和流程,其可提升前端工程师的工作效率,加快Web开发迭代速度,是现在前端开发领域中非常重要的一环。本书系统、全面地介绍了前端工程体系的各个环节,包括设计要点和实践经验。全书分为7章...
  • 前端工程化研究

    千次阅读 2020-08-25 17:51:11
    前端工程化研究 前言 随着互联网的迅速发展,这几年进化速度之快让人咂舌,很多前端工程师都不禁吐槽“学不动了”。如今前端可谓包罗万象,产品形态五花八门,涉猎极广,各种各样的框架和库,随着web业务日益复杂化...

    前端工程化研究

    前言

    随着互联网的迅速发展,这几年进化速度之快让人咂舌,很多前端工程师都不禁吐槽“学不动了”。如今前端可谓包罗万象,产品形态五花八门,涉猎极广,各种各样的框架和库,随着web业务日益复杂化和多元化,UI的要求变高,从WebPage模式为主转变为WebApp模式,也从有混合模式开发到分离式开发的转变,对前端工程师的能力越来越来高,能力和层次已经不是 HTML、CSS、JS 前端三剑客仗剑那个时代了,我记得在15年的时候我在上海,当时JS 框架以 jQuery 为主,less 基本都不用,而我现在说在的公司前端的开发框架以 Vue 为主,使用 Webpack 解决接口 mock、代码检查、代码编译、构建、压缩、添加版本号、部署等全流程的工作。涉及到的技术点有 Vue、Vuex、ESlint、stylelint、Mock、Webpack、Sass、PostCSS 等。对前端的要求相比几年前已经从单纯的 JS、CSS 问题变成了更多工程化为主的问题。

    个人理解

    前端工程化是一个很大的话题,甚至到现在都没有一个准确的定义,无论是蚂蚁金服前端团队或者淘宝前端团队等大厂的前端团队,都没有一个完善的概括,归纳,定义。但是我在的理解,前端工程化,就是以提升能提升前端开发效率、前端应用质量的手段、工具和组件的通用能力,快速开发和构建一个项目为中心,来解决项目开发周期长、成本高、维护难等能力。

    前端工程化的好处

    • 进行高效的多人协作
    • 保证项目的可维护性
    • 保证项目的开发质量
    • 降低项目生产的风险
    • 提高快速生产的能力

    前端工程化构建

    • 代码规范化

    我们都知道,每个程序员的代码风格都不一样,就像每个人都有独特的特性,如果没有合理的规范,那么代码的工程越来越难以维护,离职交接也就越来越难,增加新人学习成本、维护、开发等成本。每个人都有入职的经历,你在入职的时候,不可能让你做新项目,都是让你看老项目,看代码、维护等,看到不理解的或者奇葩风格,就会吐槽“日了狗,这代码真TMD的牛逼”等等,各种不爽和污秽的言语脱口而出。特别前端,灵活性更高,所以风格变化多端,所以一套的规范化,是团队的基础,也是共同维护的根本,新老交替,快、准、狠,对团队,对公司都有极大的好处,也增加了团队的凝聚力!团队内部也变得很和谐,沟通成本也变得很低;

    tips:

    代码规范
    前端开发规范[html篇]
    前端开发规范[js篇]
    前端开发规范[css篇]
    前端开发规范[项目工程篇]

    提交规范
    vue-cli 加入lint-staged 半自动提升项目代码质量
    git 加入钩子和提交信息规范化
    Commit message 的格式说明

    接口规范
    前后端分离研究,以及接口规范

    其他
    漫谈CodeReview:团队内壁代码审查和学习
    vscode中的插件Settings Sync(设置和插件同步)基本用法:开发工具和配置统一化

    脱离后端,前端能够独立运行,展示无异常,大大节约了开发的时间成本,前端和后端能够同步进行开发。mock工具有easymock、jMock、Mockito、Unitils Mock、PowerMock、JMockit等等
    mock的选型

    由于公司内部项目开发,处于隐私保护的需要,不想将自己封的包推到npm社区,,但又急需要一套完整的包管理工具来管理越来越多的组件,模块,项目;还有经常下载一些npm包,有时候下载不下来,有时候下载,下来运行报错,各种坑,还有内部git 环境ci/cd 自动部署耗时过程,就把公司使用频繁的一些包弄到内部环境,有内部环境下载,会更快,也不会出现下载不下来的情况。

    未完,补充中…

    展开全文
  • 前端工程化入门

    2017-07-09 22:04:51
    前言  小编最近加入了前端工程化的研究工作,前端工程化是软件工程不断迭代的必然趋势,用工程化的思想去管理前端。 正文  未完待续。

    前言

          小编最近加入了前端工程化的研究工作,前端工程化是软件工程不断迭代的必然趋势,用工程化的思想去管理前端。

    正文

    一 、为什么会有前端工程化?  

      目前前端开发存在的问题

            1.  同时存在多端,造成开发效率不高
    2.  项目没有模块化,组件化的概念,代码复用率低
    3.  部署困难,没有自动生成版本号,每次都要手动修改js的版本号
    4.  面条式的代码,开发任务重,没有做很好的规划

      改进目标

            1. 解决多端统一的问题,一处修改,多端同时生效
            2. 模块化开发,使代码逻辑更加清晰,更好维护
            3. 组件化开发,增强扩展性
            4. 按需打包,以及自动构建
            5. 自动更新js版本号,实现线上自动更新缓存资源
            6. 紧跟发展趋势,使用ES6进行开发

      前端工程化应运而出

              前端工程化是一种思想,用工程化的思想解决前端问题,终极目标是:工程化,模块化,组件化。

    二 、为什么要进行前后端分离?

     什么是前端?

            前端负责浏览器端用户交互界面和逻辑等,显示数据,可以简单的理解为:html+js+css+ajax

     什么是后端?

             后端负责后端负责数据的处理和存储等,提供数据。

     为什么要进行前后端分离?

            1.   项目一开始制作前端页面的时候,我不再需要后台给我配置服务器环境了
    2.  项目的前端文件可以在需要调用后台接口的时候丢进服务器就好了,完全不需要事先放进去
            3.  增加一个项目页面需要配置路由的时候不再需要让后台同事给我加了,自己前端搞定
            4.  页面跳转比之前更加流畅了,局部渲染局部加载非常快速
            5.  页面模板可以重复使用了,前端组件化开发提高了开发效率
             ……

             前端采用了单页应用,当页面加载完后,每打开一个新的链接时,不再需要等网络返回给我结果;我也能快速的回到上一个页面,像一个 APP 一样的体现这样的应用。整个过程里,我们只是不断地从后台去获取数据,不需要重复地请求页面——因为这些页面的模板已经存在本地了,我们所缺少的只是实时的数据。

              前端负责显示,后端负责提供数据,前后端分离的目的是为了解耦。

     三、前后端如何实现分离?

           通过API接口,后端提供API,前端消费API。

    总结

          前端的工作刚刚开始,这篇博客借鉴于各位大神的著作,其中也有些自己的理解,希望路过的各位可以多多提意见~~

            

    展开全文
  • 前端工程化技术架构.pdf
  • Webpack前端工程化实践.pdf
  • 前端工程化的理解

    千次阅读 多人点赞 2021-02-02 20:28:11
    很久没写过博客沉淀下,最近看了几篇前端工程化的文章,结合自己实践所学,阐述下什么是前端工程化。 大前端其实分为很多种 移动应用开发的前端 web前端 本篇主要是说下web前端的工程化 什么是前端工程化 在...
  • Web前端工程化与组件化开发实践
  • 前端架构,前端工程化

    万次阅读 多人点赞 2018-01-31 10:49:28
    1.前端工程化 web应用复杂度的增加,特别是单页面应用的风靡。组件化,工程化,自动化成了前端发展的趋势。或者说一线的互联网公司就是这么做的。 每个前端团队都在打造自己的前端开发体系,这通常是一个东拼西凑,...
  • 前端工程化、模块化、组件化

    千次阅读 多人点赞 2019-04-28 12:31:53
        前端工程化是一种高层次思想而不是某种技术,所谓前端工程化就是将前端项目当成一项系统工程进行分析、组织和构建从而达到项目结构清晰、分工明确、团队配合默契、开发效率提高的目的。而模块化和组件化是为...
  • 前端工程化-Stylelint

    万次阅读 2020-08-15 10:27:58
    前端工程化当中,不仅仅是js可以lint,而且css/sass也可以被lint,接下来为大家揭晓怎么lint css/sass 准备 1、在命令行输入npm init -y 初始化项目 2、cnpm i stylelint-config-standard stylelint-config-sass-...
  • 前端工程化之gulp-webpack.pptx
  • 前端工程化-规范化篇

    万次阅读 2020-08-13 20:24:40
    这一篇文章主要是关于前端规范化的内容,前端规范化是我们践行前端工程化过程中的重要的组成部分 有利于项目维护,以及二次开发,减低维护成本,便于后续人员接手 为什么要有规范化 1、软件开发需要多人协同 2、...
  • 四大维度解锁 Webpack 3(1).0 前端工程化 四大维度解锁 Webpack 3(1).0 前端工程化
  • 前端的小伙伴应该能够很明显地感觉到,在面试过程中,各大公司面试官已经非常注重前端工程化能力的考察了。 前端工程化的演进可以极大地提升开发效率。前端发展到现在,社区涌现出大量的优秀框架和工具,得以将...
  • 适读人群 :本书适合对前端工程化有一定理解和实践的中高级前端工程师阅读,同样适合对前端工程化感兴趣的服务器端开发者以及运维人员阅读。 1.本书由周爱民老师倾情作序,美团技术总监赵强、搜狐高级技术经理邵充、...
  • 主要介绍了webpack+vue.js构建前端工程化的方法,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
  • 前端工程化研究之数据mock化

    千次阅读 2020-09-07 16:07:05
    前端工程化研究之数据mock化 相信大家都知道,前后端分离最的好处就是各司其职,效率更高。我们都知道,在早些年,也就是”三剑客“时代,往往等待后端开发完成之后,前端才能完全介入开发工作,有冲淡测试数据的...
  • 前端工程化的理解

    千次阅读 2018-12-22 15:15:18
    前端工程化的理解 目录 前端-GUI 软件 构建工程化的几个阶段 工程化需要考虑的几大因素 一.GUI软件 现如今前端可谓包罗万象,产品形态五花八门,涉猎极广,什么高大上的基础库/框架,拽炫酷...
  • 一本关于使用grunt进行前端工程化的书,非常好!
  • 文章目录前言前后端分离核心对开发行为和职责的直接影响前端工程化本地代理与ngix反向代理node是什么,有什么特点,与前后端分离,前端工程化的关系node,npm,package.json与webpackvue,vue-cli,webpackES6,node和...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 145,926
精华内容 58,370
关键字:

前端工程化