前后端分离实践

发表于   |  

后端 MVC 时代

描述：

MVC 在后台，服务器负责路由跳转，所有页面的渲染

存在问题：

前端写Demo，后端套页面

  • 后端需要写HTML
  • 前端仍然确认后端写的HTML

前端写View层，后端只管数据

  • 前端需要熟悉后端语言
  • 前端需要了解后端架构

前端 MVC 时代

描述：

  • 提供数据
  • 处理业务逻辑
  • Server-side MVC架构
  • 代码跑在服务器上

    前端：

  • 接收数据，返回数据
  • 处理渲染逻辑
  • Client-side MV* 架构
  • 代码跑在浏览器上

存在问题：

  • 无法统一协作模式，代码充满了约定
  • JS跟CSS，依賴於後端產出的HTML
  • 有的数据來自AJAX，有的数据印在DOM上
  • 有的业务邏輯在前端，有的在Model层，更多的是在View层
  • 前端依赖服务端开发环境
  • 在服务端View层高度耦合
  • 沟通成本高
  • 职责不清晰

前端 MV* 时代

描述：

引入 nodejs 作为前端范畴，优化前端相关行为。

JAVA

  • 服务层
  • 提供数据接口
  • 维持数据稳定
  • 封装业务逻辑

NodeJS

  • 跑在服務器上的JS
  • 转发数据，串接服务
  • 路由设计，控制逻辑
  • 渲染页面，体验优化
  • 更多的可能

HTML + CSS

  • 跑在浏览器上的JS
  • CSS、JS加載與運行
  • DOM操作
  • 任何的前端框架與工具
  • 共用模版、路由