仿站定制优惠中 --更多类型选择联系-> 服务热线:13025755889
当前位置:网站首页 >> 新闻资讯 >> 互联网资讯 >> 查看详情
新闻资讯
互联网资讯

互联网资讯

学会web开发,你的前端道路将会通畅无比

来源:惠州网站建设  日期:2019-11-18 09:59:17  点击: 
前后分离结束后已经是由行业/部署模型开发了一个共识。前端和后端的所谓的分离,而不是由传统产业部门,有些人纯粹前端(HTML / CSS / JavaScript的/ Flex的),另一部分纯做后端,因为在这种方式不工作:比如,很多球队采取了模板技术(JSP,FreeMarker的,雇员再培训局等后端.),前端开发和调试支持后台需要一个Web容器,不能真正分开(更不用提在部署的时候,由于动态内容和混合静态内容,动态设计时的静态分流时的过程很繁琐)。对于前端和后端的发展的另一个讨论可以在这里找到。
 
  前后分离结束后已经是由行业/部署模型开发了一个共识。前端和后端的所谓的分离,而不是由传统产业部门,有些人纯粹前端(HTML / CSS / JavaScript的/ Flex的),另一部分纯做后端,因为在这种方式不工作:比如,很多球队采取了模板技术(JSP,FreeMarker的,雇员再培训局等后端.),前端开发和调试支持后台需要一个Web容器,不能真正分开(更不用提在部署的时候,由于动态内容和混合静态内容,动态设计时的静态分流时的过程很繁琐)。对于前端和后端的发展的另一个讨论可以在这里找到。
 
  API甚至前解耦问题,后通过前端和后端,动态和静态内容计算出最终结束的发展过程中,通信接口,分别是开发,部署,集成仍然是绕不开的一个 - 一个前端/后端应用程序可以独立运行,但不整合工作。我们需要花很多精力去调试,直到上线还不具备所有的接口都工作的信心。
 
  一点背景知识
 
  一个典型的Web应用程序的布局是这样的:
 
  前端和后端都各自有自己的发展过程中,构建工具,测试仪等.。前端和后端只是编程接口,这个接口可以是基于REST的JSON格式的接口外,还XML,重点是只提供后台数据和计算结果负责,但不处理展。前端负责获取数据,组织数据和目前的工作。清除这样的结构,的顾虑,前端和后端变得相对松散耦合和独立性分离。
 
  上述场景是相当不错的,其实我们是在一个真实的环境中有非常复杂的场景,比如异构网络,异构操作系统等:
 
  在真实的场景中,后端也可能更加复杂,比如用C语言做数据收集,然后集成到Java中,数据仓库的Web服务,然后另一层,最后几个这样的Web服务数据仓库已聚合服务的Ruby一起回到前端。在这样一个复杂的系统,任何背景端点的故障可能妨碍发展过程的前端,所以我们将使用模拟的方式来解决这个问题:
 
  此服务器可以发起一个简单的HTTP服务器,然后服务于一些静态的内容时,使用前端代码。许多这样的好处:
 
  发展独立前端和后端
 
  后端的时间表不会影响前端开发
 
  启动速度更快
 
  前端和后端可以使用他们熟悉的技术堆栈(让科学Maven的前端,背部有一大口到底会做出很顺利)
 
  但是,当积分仍然是一个令人头疼的问题。 我们经常在集成时发现初始协商的数据结构发生变化:字段可能是一个字符串数组现在变成(业务发生变化时,系统现在可以支持多个送货地址)一个;  现场变成一个字符串,当协商;  用户电子邮件地址等多个级别。这些变化是不可避免的发生,这会耗费大量时间的调试和集成时间,更不用说修改后的回归测试。
 
  所以仅使用一个静态的服务器,然后提供的数据是不够的。我们还需要完成:
 
  模拟前端依赖指定的数据格式UI开发
 
  前端开发和模拟测试基于这些数据
 
  生成指定的模拟后端数据格式
 
  后端需要进行测试,以确保所产生的模拟数据是前端需要
 
  总之,我们需要在一些合同,这些合同作为中间格式,可以进行测试的同意。然后,你需要测试前和测试使用这些合同结束后有。一旦合同被改变,其他的测试会失败,这将推动双方,减少时间积分的浪费。
 
  实际的情况是:合同的前端已经发现,缺少一个字段,所以他说在合同领域。然后,在这个领域来显示(右UI当然,设置字体,大小,颜色等.)。然而,后台渲染服务合同并没有意识到这种变化,运行生成合同时的测试(背景)的一部分,该测试将失败 - 因为它不会产生该场。因此,后端到前端工程师寻找,讨论,了解业务逻辑之后,他将修改代码,并确保通过测试。因此,在积分时,就不会显得不那么在UI的字段,但谁也不知道问题出在前面,后端问题,还是数据库的问题。
 
  而实际的项目中,往往是多个页面,多个API,多个版本,多个团队同时开发,这份合同将减少调试时间很多,使得集成相对平稳。
 
  在实践中,合同可以被定义为一个文件JSON或XML有效载荷。只要确保前端和后端共享同一组合同做了测试,它将从整合工作中受益。最简单的形式是:提供一些静态文件,并请求发回的所有前台将被拒绝某种机制,并转换成静态资源的请求。
 
  莫科,基于Java
 
  wiremock,基于Java
 
  西纳特拉,基于Ruby
 
  看到这里列出的可能是熟悉人会有异议:它不过是一个功能齐全的图书馆啊。为什么它被列出来,因为提供了一个简单而优雅,这种语言是很适合的原因,我无法找到一个更华丽的方式,使这个更具可读性,所以我们通过它。
 
  一个例子
 
  在本申请中,我们有作为一个例子,来说明如何,前分离的后端后,确保了代码的质量,降低集成的成本。该方案很简单:每个人都可以看到项目的列表,每个登录用户可以选择自己最喜爱的项目,而为之出演。之后,进入出演保存到用户自己的。用户界面看起来是这样的:
 
  然而,为了专注于我们的核心,我删除了诸如登陆,喜欢网页的个人中心,假设你是一个登录用户,然后我们看看如何编写测试。
 
  前端开发
 
  根据通常的实践中,前端和后端的分离之后,一些数据很容易测试自己:
 
  于是,一种可能的方式是通过请求JSON接待对此进行测试:
 
  所以,无论是工作,但这里的发送请求没有最终确定,我们需要修改的实时当整合。一个简单的方法是使用一个URL来执行转换:
 
  这样,当我们和实际的服务集成,只需要连接到服务器就可以了。
 
  请注意,我们现在这个文件的核心。该文件正处于合同的作用,至少对于前端是这样的。然后,我们需要渲染的功能,这就需要另一份合同中的应用:寻找当前用户的所有条目出演过,所以我们加入了一个新的合同:
 
  然后添加一个新的映射:
 
  通过这两个要求,我们会得到两个列表,然后绘制出所有基于这两个列表的交集的星号(部分是中空的,以及一些固体)的状态:
 
  剩下的问题是,当你点击的心,我们需要发送到后端的请求,然后更新心中的地位:
 
  在这里,除了请求出的,但我们仍然使用西纳特拉可以轻松地支持它:
 
  它可以在没有后端可以看出,我们一切顺利 - 甚至没有开始做后端,或正在使用的不是我们的开发团队进展较慢,但不要紧,就不会影响我们。
 
  不仅如此,当我们完成了前端代码,你可以做一个测试。由于使用模拟数据,省去了耗时的数据库和网络的需求,本次测试将运行速度非常快,而且它确实起到最终作用到结束。最终整合这些测试也可以用来当UI试运行。所谓一举多得。
 
  关于如何写这样一个测试,你可以写这篇文章的引用之前。
 
  后端开发
 
  我在这个例子中,后端使用作为一个例子,你应该能够很容易地应用了类似的想法,Ruby或其他语言。
 
  首先是高考的要求,将负责解析请求路径,检查数据库,并以JSON格式返回数据。
 
  询问我们不讨论,有兴趣的可以找到链接到代码库在文章的结尾的具体细节。一旦你有了这个然后,控制器,来测试我们如何做?或者说,如何使合同变成实际可用尚?
 
  提供了一个非常漂亮的DSL写一个测试,我们只需要一点点的代码可以与他们签订合同和实际修改监督的界面:
 
  建立mockmvc后,我们可以写控制器单元测试:
 
  发送请求,并期望后,返回状态是200,则内容。然后,我们希望返回的结果是一个长度为3的阵列,然后是阵列中的第一个元素的字段不为空。
 
  注意,这里依赖于一个事实,即它会载入文件 - 也就是用来模拟测试文件的前端:
 
  因此,当后端修改定义(添加/删除/修改字段),或修改的模拟数据等. ,将导致测试失败;  但前端修改后的模拟,将导致测试失败 - 而不是害怕失败的 - 这样的失败将促进协商,推动了服务的最终合同。
 
 

本文由惠州欣惠网络整理发布,转载请注明出处:http://www.web1998.com/itzx/1193.html

Copyright © 2013-2019 www.web1998.com 惠州网站建设 欣惠网络公司 版权所有 粤ICP备19023339号-1