前端

前端框架与类库

五迷三道 提交于 2020-01-04 00:37:23
一直不能分别前端框架和类库(我这个前端也是假的吧?),结合各位前辈的思想,整理了一下: 前端框架与前端类库的区别 使用框架前,我觉得很重要的一点是弄清类库(诸如JQuery)和框架(诸如angularJS)的区别在何处。 简单而言,类库,解决的是代码或者是模块级别的复用或者对复杂度的封装问题,例如将一个解决复杂问题的功能模块封装成一个函数,提供一个简单的接口。库它是一种工具,它提供了很多封装好的方法,用与不用取决于我们自身,即使用了也不会影响我们呢的代码结构。 而框架,更多的是对模式级别的复用和对程序组织的规范。这里的模式是指比如MVC,为了实现M和V的解耦,把复杂的耦合关系由经常变化的业务代码转移到不经常变化的框架内部消化。是面向一个领域来提供一套解决方案,提高开发效率,如果我们选择了使用某框架,就应该遵循该框架所规定的规则。 二者最主要的区别是 :JQuery以DOM操作为中心,框架,准确来说是MVC框架,是以模型(model)为中心,而DOM操作是附加的。所以,以模型为中心最终达到的目的是带来一整套工作流程的变更,使得后台工程师可以编写前端的模型代码,把后台与前端打通,交互设计师处理UI跟模型的互动关系,UI设计师可以专注、无障碍的处理HTML源码,把它们以界面模板的形式提交给交互工程师。这一整套协作机制能大大提高开发效率。使用MVC框架使得前端任务更好的被解耦。

Web前端框架与类库的思考

痞子三分冷 提交于 2020-01-04 00:37:15
说起前端框架,我也是醉了。现在去面试或者和同行聊天,动不动就这个框架碉堡了,那个框架好犀利。   当然不是贬低框架,只是有一种杀鸡焉用牛刀的感觉。网站技术是为业务而存在的,除此毫无意义,框架也是一样。在技术选型和架构设计 当中,脱离网站业务发展的实际,一味的追求时髦新技术,可能会适得其反,将网站发展引入崎岖小道。就好像一个日均pv只有几百的小型电商网站,却要大喊 “某宝就是这么搞的”,然后搭建应用服务器集群,使用分布式文件系统和分布式数据库系统...等巴拉巴拉的一堆用来处理高并发,海量数据访问的手段。我想 说,有意义吗? 顺带可以看看这个源码框架: http://www.jinhusns.com/Products/Download/?type=xcj   前端框架的理解误区   网站的价值在于它能为用户提供什么价值,在于网站能做什么,而不在于它是怎么做的,所以在网站还很小的时候就去追求网站的架构框架 是舍本逐末,得不偿失的。前端框架同理,如果是一个简单的页面型产品,应用只是依赖服务器来生成Web页面和视图,并且只需要使用一些简单的 Javascript或者JQuery来使应用更加具有互动性,那么一个JQuery前端类库就可以了,真的没必要用上一些高大上的框架。   当然,框架的确是很有用的,重点是我们要知道什么时候该用什么框架。大公司大项目的经验和成功模式固然重要,值得学习借鉴

Web前端框架与类库的思考

十年热恋 提交于 2020-01-04 00:36:59
说起前端框架,我也是醉了。现在去面试或者和同行聊天,动不动就这个框架碉堡了,那个框架好犀利。 当然不是贬低框架,只是有一种杀鸡焉用牛刀的感觉。网站技术是为业务而存在的,除此毫无意义,框架也是一样。在技术选型和架构设计当中,脱离网站业务发展的实际,一味的追求时髦新技术,可能会适得其反,将网站发展引入崎岖小道。就好像一个日均pv只有几百的小型电商网站,却要大喊“某宝就是这么搞的”,然后搭建应用服务器集群,使用分布式文件系统和分布式数据库系统…等巴拉巴拉的一堆用来处理高并发,海量数据访问的手段。我想说,有意义吗?   前端框架的理解误区 网站的价值在于它能为用户提供什么价值,在于网站能做什么,而不在于它是怎么做的,所以在网站还很小的时候就去追求网站的架构框架是舍本逐末,得不偿失的。前端框架同理,如果是一个简单的页面型产品,应用只是依赖服务器来生成Web页面和视图,并且只需要使用一些简单的Javascript或者JQuery来使应用更加具有互动性,那么一个JQuery前端类库就可以了,真的没必要用上一些高大上的框架。 当然,框架的确是很有用的,重点是我们要知道什么时候该用什么框架。大公司大项目的经验和成功模式固然重要,值得学习借鉴,但我们不能因此变得盲从。只有深刻去理解前端框架,知道什么时候该用什么什么框架解决什么问题,才能有的放矢,直击要害。   前端框架与前端类库的区别 使用框架前

Web前端框架与类库的思考

走远了吗. 提交于 2020-01-04 00:36:49
前端框架的理解误区 网站的价值在于它能为用户提供什么价值,在于网站能做什么,而不在于它是怎么做的,所以在网站还很小的时候就去追求网站的架构框架是舍本逐末,得不偿失的。前端框架同理,如果是一个简单的页面型产品,应用只是依赖服务器来生成Web页面和视图,并且只需要使用一些简单的Javascript或者JQuery来使应用更加具有互动性,那么一个JQuery前端类库就可以了,真的没必要用上一些高大上的框架。 当然,框架的确是很有用的,重点是我们要知道什么时候该用什么框架。大公司大项目的经验和成功模式固然重要,值得学习借鉴,但我们不能因此变得盲从。只有深刻去理解前端框架,知道什么时候该用什么什么框架解决什么问题,才能有的放矢,直击要害。 前端框架与前端类库的区别 使用框架前,我觉得很重要的一点是弄清类库(诸如JQuery)和框架(诸如angularJS)的区别在何处。 简单而言,类库,解决的是代码或者是模块级别的复用或者对复杂度的封装问题,例如将一个解决复杂问题的功能模块封装成一个函数,提供一个简单的接口。库它是一种工具,它提供了很多封装好的方法,用与不用取决于我们自身,即使用了也不会影响我们呢的代码结构。 而框架,更多的是对模式级别的复用和对程序组织的规范。这里的模式是指比如MVC,为了实现M和V的解耦,把复杂的耦合关系由经常变化的业务代码转移到不经常变化的框架内部消化

前后端分离demo

限于喜欢 提交于 2020-01-04 00:35:31
01 1.后端端口号和前端不同, 2.前端接收问题 3.@RequestBody @RequestBody主要用来接收前端传递给后端的json字符串中的数据的(请求体中的数据的); GET方式无请求体,所以使用@RequestBody接收数据时,前端不能使用GET方式提交数据,而是用POST方式进行提交。 在后端的同一个接收方法里,@RequestBody 与@RequestParam()可以同时使用,@RequestBody最多只能有一个,而@RequestParam()可以有多个。 注:一个请求,只有一个RequestBody;一个请求,可以有多个RequestParam 1 什么是跨域(理解) 跨域 就是跨域名来访问的数据 域名: www.baidu.com(ip 192.168.0.1) www.taobao.com(ip 192.168.0.2) – 属于跨域 ​ localhost:8080 — >localhost:80 --(属于跨域) ​ www.wenku.baidu.com www.tieba.baidu.com --二级域名 – 跨域 ​ 192.168.0.3 192.168.0.4 2. 跨域不一定存在跨域问题 什么情况下存在跨域问题: ​ 跨域问题: 浏览器 针对ajax请求的时候,如果不同的服务,存在跨域 浏览器机制: 同源策略拦截跨域的访问 3

前端工程化

余生颓废 提交于 2020-01-04 00:26:27
前段工程化可以分成四个块来说,分别为 模块化:将一个文件拆分成多个相互依赖的文件,最后进行统一的打包和加载,这样能够很好的保证高效的多人协作。其中包含 JS 模块化:CommonJS、AMD、CMD 以及 ES6 Module。 CSS 模块化:Sass、Less、Stylus、BEM、CSS Modules 等。其中预处理器和 BEM 都会有的一个问题就是样式覆盖。而 CSS Modules 则是通过 JS 来管理依赖,最大化的结合了 JS 模块化和 CSS 生态,比如 Vue 中的 style scoped。 资源模块化:任何资源都能以模块的形式进行加载,目前大部分项目中的文件、CSS、图片等都能直接通过 JS 做统一的依赖关系处理。 组件化:不同于模块化,模块化是对文件、对代码和资源拆分,而组件化则是对 UI 层面的拆分。 通常,我们会需要对页面进行拆分,将其拆分成一个一个的零件,然后分别去实现这一个个零件,最后再进行组装。 在我们的实际业务开发中,对于组件的拆分我们需要做不同程度的考量,其中主要包括细粒度和通用性这两块的考虑。 对于业务组件,你更多需要考量的是针对你负责业务线的一个适用度,即你设计的业务组件是否成为你当前业务的 “通用” 组件,比如我之前分析过的权限校验组件,它就是一个典型的业务组件。感兴趣的小伙伴可以点击 传送门 自行阅读。 规范化:正所谓无规矩不成方圆

前端工程化

拜拜、爱过 提交于 2020-01-04 00:26:10
一、定义   工程化即 系统化、模块化、规范化 的一个过程。 如果说计算机科学要解决的是系统的某个具体问题,或者更通俗点说是面向编码的,那么工程化要解决的是如何 提高整个系统生产效率 。 二、为什么需要前端工程化   前端越来越复杂,设计的问题和环节也越来越多,不采用工程化管理,就无法很好的实现团队协同和降低复杂性。 原因如下: 1. 前端范畴不断扩大    早期的前端只需要适配桌面浏览器,而现在的前端,需要适配不同类型和尺寸的设备,包括移动端网页,app应用等。 2. 前后端分离    早期的前端只是后端 MVC 框架的一层模块, 而现在的前端普遍是从后端接口获取数据,编写处理逻辑,各种前端mvc前端框架也层出不穷。 3. 模块化开发的出现    现在的前端开发不再是从零写起,重复造轮子,而是会引用大量内部和外部的组件和模块,这也导致前端必须进行模块管理。 4. 转码器的盛行    为了提高效率,前端工程往往不会直接写html,css,和js代码,而是改用其他格式书写,再用工具编译为目标格式。   比如用Jade 写HTML,用less、sass、stylus 编写CSS,用ES6、Typescript编写JavaScript。 5. 开发流程和团队    早期的前端团队往往只有几个人,而现在的前端团队可以扩展到几十人,甚至上百人。每个人只负责自己的一块内容。 所以

前端工程化

馋奶兔 提交于 2020-01-04 00:25:23
前端架构: 1.前端工程化 web应用复杂度的增加,特别是单页面应用的风靡。组件化,工程化,自动化成了前端发展的趋势。或者说一线的互联网公司就是这么做的。 每个前端团队都在打造自己的前端开发体系,这通常是一个东拼西凑,逐渐磨合的过程,在技术发展日新月异的今天,这样的过程真的是不可抽象和复制的么?本文希望能够通过系统的拆解前端开发体系为大家提供体系设计思路参考。 前端工程的3个阶段 第一阶段: 库/框架选型 Animate.css jQuery vue.js underscore.js React.js Backbone.js Bootstarp zepto.js jade normalize.css compass Angular.js 解决开发效率 第二阶段: 简单构建优化 选择构建工具,对代码进行压缩,校验,之后再以页面为单位进行简单的资源合并。 第三阶段: JS/CSS模块化开发 解决维护效率 js的模块化方案 ADM/CDM/UMD/ES6 Module css的模块化:less,sass。 第四阶段: 前端是一个技术问题较少,工程问题较多的开发领域 当我们要开发一款完整的Web应用时,前端将面临更多的工程问题,比如: - 大体量:多功能、多页面、多状态、多系统; - 大规模:多人甚至多团队合作开发; - 高性能:CDN部署、缓存控制、文件指纹、缓存复用、请求合并、按需加载

Vue.js 和 MVVM 的小细节

青春壹個敷衍的年華 提交于 2020-01-04 00:22:53
Vue.js 和 MVVM 的小细节 转载 作者:流云诸葛 链接:www.cnblogs.com/lyzg/p/6067766.html MVVM 是Model-View-ViewModel 的缩写,它是一种基于前端开发的架构模式,其核心是提供对View 和 ViewModel 的双向数据绑定,这使得ViewModel 的状态改变可以自动传递给 View,即所谓的 数据双向绑定 。 Vue.js 是一个提供了 MVVM 风格的双向数据绑定的 Javascript 库,专注于View 层。它的核心是 MVVM 中的 VM,也就是 ViewModel。 ViewModel负责连接 View 和 Model,保证视图和数据的一致性,这种轻量级的架构让前端开发更加高效、便捷。 为什么会出现 MVVM 呢? 我接触MVVM 是在2015年,可以说2015年是MVVM 最火热的一年,而在这之前,我所知道的就是MVC, MVC 大约是在5年前,也就是2011年的时候接触的,那时候刚学编程语言,学的Java,而Java 中经典的 SSH 框架就用来构建一个标准的MVC 框架。说实话,MVC 用了这么多年,但始终没有很深刻的理解,只停留在用的层面, 一直到接触 Vue.js 之后,研究了MVVM 架构思想,然后再回头看 MVC ,才有一种豁然开朗的感觉~ MVC 即 Model-View

为什么推荐前端使用Vue.js

∥☆過路亽.° 提交于 2020-01-04 00:21:58
MVVM 是Model-View-ViewModel 的缩写,它是一种基于前端开发的架构模式,其核心是提供对View 和 ViewModel 的双向数据绑定,这使得ViewModel 的状态改变可以自动传递给 View,即所谓的 数据双向绑定 。 Vue.js 是一个提供了 MVVM 风格的双向数据绑定的 Javascript 库,专注于View 层。它的核心是 MVVM 中的 VM,也就是 ViewModel。 ViewModel负责连接 View 和 Model,保证视图和数据的一致性,这种轻量级的架构让前端开发更加高效、便捷。 强调前端为什么要用vue.js 为什么要用工程化 相对 HTML4 , HTML5 最大的亮点是 它为移动设备提供了一些非常有用的功能 ,使得 HTML5 具备了开发App的能力, HTML5开发App 最大的好处就是 跨平台、快速迭代和上线,节省人力成本和提高效率 ,因此很多企业开始对传统的App进行改造,逐渐用H5代替Native,到2015年的时候,市面上大多数App 或多或少嵌入都了H5 的页面。 Vue.js 和 jquery的区别 强调没有最好的,只有最适合的 jQuery是使用选择器($)选取DOM对象,对其进行赋值、取值、事件绑定等操作,其实和原生的HTML的区别只在于可以更方便的选取和操作DOM对象,而数据和界面是在一起的