workflow

前后端的交互 & 全栈需要知道的工作流

在以前可能是启一个 Java 项目，里面有 jsp 页面做前台展示，后端“也能做前端的活”。前后端是耦合在一起的。但这是很早很早之前的事了~ 现在基本都是前后端分离。大多数情况也是各自的项目分离。

现在发现一个现象是，很多前端不清楚后端的工作流程，后端也不清楚前端的工作流。前后端对彼此都有较重的依赖~

这里做一个澄清，让前端知道后端是怎么运作的，后端清楚前端是怎么调用的。

前端

必备环境

• node 下载

  node 里面包含 npm 包管理工具，后端可以对标理解为 maven 工具。node 的安装可以无脑点下一步就行，MAC 用户 brew 安装也许。

• UI 框架(可能这么描述不够准确，但为了方便后端理解，暂时就这样说)。目前比较主流的三大框架分别为

  • React
  • Vue
  • Angular

具体的优劣势不在此赘述，都有其各种的适用场景。 这三种框架，以及古早的Jquery,我都用过。但是对 React 最为熟悉。这里就以 React 举例。

创建应用

安装完 node 以后，使用以下指令创建前端应用。

npx create-react-app my-app --template typescript

后端

必备环境

• jdk(windows 的话，再自己再配置一下 JAVA_HOME 路径，就到 jdk 那层就行，目的是给其他程序使用 JDK 的权限，你可以把它理解成一个指针，你要用 JDK 的时候，系统就会读取这个路径，找到 jdk)
• mySql
• mySql workbench(数据库可视化管理工具, 也可以根据自己的情况下其他的，不过这个是免费的)
• maven(后端项目包管理工具,前端可以理解为 npm 的作用,但它的作用其实不止包管理,还有很多其他的功能)
• spring-boot(前端理解成类似 React 之类的，是后端专用的框架)

note

windows: maven 下载下来后，放到你自己平时的安装目录解压，复制到 bin 的目录，并且配置到环境变量里(PATH 或啥的，随便)。 在 terminal 中使用以下指令查看 maven 是否安装成功

mvn -v

创建应用

spring boot 在这里，我选择了三个依赖，最后生成一个后端初始项目

REST API

联调