大多数人,都低估了编程学习的难度,而高估了自己的学习能力和毅力。
当前系列: 框架&架构 修改讲义

复习:动态页面……

Web开发模式

以下内容,对小白而言略有抽象,既可以作为预习,也可以作为复习。

没有模式

HTML标签和和(验证、跳转、运算、if...else等等的)逻辑代码都全部直接写在(.jsp/.php/.asp)页面上。

演示:jsp页面代码

Page-Model

这是飞哥自己取的名字(毕竟在那个年代,也没有谁想到过“模式”),其特点是:请求直接到达页面(Page),但表现和逻辑相分离:

  • (.jsp/.php/.asp)页面上只有和呈现相关的简单逻辑,比如:循环的展现列表内容,哪部分内容显示哪部分不显示……
  • 复杂的逻辑,比如:验证、运算、连接数据库等,由页面相应的、单独的类/对象处理

演示:JSP+JavaBean 或 ASP.NET WebForm/RazorPages

MVC

在Page-Model的基础上,将Model进一步拆分:

  • Model:模型,只作为数据容器(Data Transfer Object)使用
  • Controller:负责逻辑预算。

另外一个区别:请求不再直接到达Page,而是Controller,所有这时候Controller居于中心地位,而不是页面,页面也被称之为View(视图)。

但从url到controller,比如:/Code/261需要由CodeController处理,这中间一般都需要一个转换/映射,这个工作被称之为:route(路由)或者dispatch(分发)

演示:SpringMVC(Java)和ASP.NET MVC(C#)

更详细/常见的示意图:


MVVM

Model View ViewModel,其实就是用ViewModel替代了Controller。

ViewModel相比Controller最大的不同,就是能够在View和Model之间自动同步更新!即:

  • 如果Model发生了改变,自动更新View;
  • 如果View上Model绑定的元素发生了变化,自动的更新Model

在传统的B/S架构中,这其实是很难实现的,因为View在客户端浏览器上,Model在服务器端,相距过于遥远。直到Ajax问世,前后端分离……

所以是前端框架,比如:vue.js、react.js等采用了这种模式。

其他

组件(component)化:把页面切分成一个一个的组件(部分),甚至页面本身,也可以看做一个组件。

组件必然就有一个从无到有,再从有到无的过程,这个过程就被称之为组件的生命周期(life-cycle)

管道(pipeline)中间件(middleware:将HTTP请求从到达到服务器,到响应生成的整个过程想象成穿越一个管道,管道中可以预置/自定义配置一个一个的中间件。

开发人员可以:

  • 使用组件,实现最大限度的重用;
  • 利用生命周期中暴露的“可插拔事件/方法”等为组件添加逻辑,更进一步的重用组件。比如,在组件初始化(init)的时候自定义的获取数据,在组件销毁时自动更新数据。
  • 在管道中自定义引入/自定义添加中间件,控制框架对HTTP请求的处理,比如:在请求到达时新开一个数据库连接打开事务,在请求结束时自动的关闭数据库连接,提交事务。


前后端分离

复习

在学习完MVC之后,就很容易想到:把View放到前端,后端只需要Controller和Model,就可以前后端分离了。

事实也确实如此。

Swagger

可用于自动生成后端API的文档,解释:

  1. 为什么需要文档?不然前端咋知道一个一个的uri究竟是干什么的?
  2. 为什么要用swagger,把文档写在代码里?同步集中……

它遵循 OpenAPI Specification(OpenAPI 规范,也简称 OAS)


备忘

还可以抽取共同的原理:

MVC:route/View的生成(变量分支循环)/(配合Form表单的)Model绑定和验证/filter

Restful:CORS/




学习笔记
源栈学历
大多数人,都低估了编程学习的难度,而高估了自己的学习能力和毅力。

作业

觉得很 ,不要忘记分享哟!

任何问题,都可以直接加 QQ群:273534701

在当前系列 框架&架构 中继续学习:

上一课: 已经是第一课了……

多快好省!前端后端,线上线下,名师精讲

  • 先学习,后付费;
  • 不满意,不要钱。
  • 编程培训班,我就选源栈

更多了解 加:

QQ群:273534701

答疑解惑,远程debug……

B站 源栈-小九 的直播间

写代码要保持微笑 (๑•̀ㅂ•́)و✧

公众号:源栈一起帮

二维码