以前主要做的是 Android 和 Java 的开发对前端知识了解 JQuery 以及基础的一些个知识，现在假如用 Java 来做后台，采用类似 themleaf 前端模板技术结合前端三大框架如何构建传统单体架构，开发流程是什么（首先用前端三大框架开发前端之后嵌入到后端的前端模板中吗），那如果是前后端分离同样用 Java 做为后台，又该如何与前端三大框架进行组合呢，最终部署又需要那些环境呢？
Java 与前端三大框架构建前后端分离正确的结合方式是什么？
本贴最后更新于 2270 天前，其中的信息可能已经水流花落
-
Java
3192 引用 • 8214 回帖 • 2 关注
Java 是一种可以撰写跨平台应用软件的面向对象的程序设计语言，是由 Sun Microsystems 公司于 1995 年 5 月推出的。Java 技术具有卓越的通用性、高效性、平台移植性和安全性。
-
前端
245 引用 • 1338 回帖
前端技术一般分为前端设计和前端开发，前端设计可以理解为网站的视觉设计，前端开发则是网站的前台代码实现，包括 HTML、CSS 以及 JavaScript 等。
-
框架
46 引用 • 346 回帖 • 1 关注
-
Q&A
9095 引用 • 41352 回帖 • 125 关注
提问之前请先看《提问的智慧》，好的问题比好的答案更有价值。
相关帖子
-
xiaopo •
你这个是属于依赖了后端模板的，不过依赖也好， thymeleaf 并不会侵入式的处理前端代码。这个过程中，实际上不需要你后端去处理过多的东西，因为前端框架的存在是因为降低后端处理模板渲染的压力，只需要给数据，前端去处理，一切就 OK 了，后端不要对 HTML 过多去进行渲染处理。
趋势
了解下现在的前端趋势.
-
组件。开发封装好，随时调用，并不是传统的 jQuery 组件，而是完全的组件，不提供具体逻辑上的功能，可以从页面精细到每个功能组件，通过各种自己指令到达各种模板的行为。
-
数据驱动。数据双向绑定驱动开发，降低渲染数据的压力。
-
（从这里开始是工程化的好处了，你也可以说是单页面应用）项目的工程化，同时页面只有一个入口，就是 index.html。通过工程规矩前端项目，从而诞生出以下的东西。
-
前端包管理。包开始被管理工具作为依赖导入打包，而不是传统的 jQuery 形式。
-
单页面组件。封装拆分组件，变得可以更加清晰的逻辑。
-
前端路由。前端完全掌握路由，同等于 Android 掌控 Activity 的跳转一样，此后后端不好参与路由相关的。
-
前端组件状态管理。如果我没有理解错误的话应该是同等于 Android 的广播机制，通过数据改变去通知所有的组件改变数据，减少耦合的依赖。
不分离
以 Vue 为例，其实只需要了解开发流程就可以了。开发过程和普通的 HTML 没什么区别。
过程
在前端里面，也有个模板，用于处理我们自己的各种事件。以下就是一个组件的创建过程了。
<script src="https://cdn.jsdelivr.net/npm/Vue"></script> <div id="app"> {{ message }} </div> var app = new Vue({ el: '#app', data: { message: 'Hello Vue!' } })以上的话只要修改
app.data.message的数据就可以修改{{ message }}的数据了，那么你可以感受的到的是其中并没有后端模板插手的空间，可以插手，显得多余。这些步骤和传统的开发只是看起来方便了，实际上并没有跳出传统的开发模式。了解更多请看 官网。
分离
这个话题就有点的讲了，因为重要的内容就在这个地方。所以到了这个时候，各家框架开始了自己的各种道路，这个道路不谈，你的问题是开发和部署上。
-
开发中，不接触后端，前端单独就可以开始开发，有 API 的定义的情况下，那么我们前端可以自己模拟数据进行访问测试开发（这个称之为 mock）。
-
联调，开发的时候前端工程化框架有个好处是我们可以去进行随时更新，这个是因为现在的框架提供一个开发服务器去跑前端项目，检测到变化则直接更新。注意了，这个时候调用后端 API 会出现跨域问题，但是这个问题可以用 webpack 的 proxyTable 反向代理解决。
-
部署，部署有个问题存在，那么就是路由，在这个过程中看每个框架的处理模式了。具体的都可以查到。这个涉及每个框架路由的不同，Vue 和 Angular 都是在 nginx 上用
try_files $uri $uri/ /index.html;处理的，这个问题建议多搜索，因为以及到了开发部署了大部分的问题都已经解决了。
至于 spring MVC 的话，我看过配置是通过优先级低的通配符方式去处理的，强行跳转 index.html.
@SpringBootApplication @RestController class YourSpringBootApp { // Match everything without a suffix (so not a static resource) @RequestMapping(value = "/\*\*/{\[path:\[^\\\\.\]\*}") public String redirect() { // Forward to home page so that route is preserved. return "forward:/"; } } -
欢迎来到这里！
我们正在构建一个小众社区，大家在这里相互信任，以平等 • 自由 • 奔放的价值观进行分享交流。最终，希望大家能够找到与自己志同道合的伙伴，共同成长。
注册 关于