推荐9个yyds前后端分离项目

author author     2023-03-17     391

关键词:

参考技术A

前后端分离是现在主流的架构设计模式,它初衷是用「单一职责」原则把代码质量提上去从而达到节省人力和减少沟通时的信息损失的目的。

本文推荐九个前后端分离的开源项目,都是采用最流行的技术栈。本文推荐的开源项目已经收录到 Awesome GitHub Repo。

Awesome GitHub Repo 是逛逛 GitHub 创建的开源项目,会收集整理 GitHub 上高质量、有趣的开源项目,并将他们进行归类。

该开源项目集不是简单的按照编程语言来分类,而是按照更有趣的分类方式,比如:有趣项目、沙雕项目、实战项目、学习项目、实用工具等等。

本期推荐的开源项目是:

1. 前后端分离博客系统

2. 前后端分离考试系统

3. 基于 TypeScript 的聊天室项目

4. 人力资源管理开源项目

5. 一个可以用来练手的前后端分离项目

6. 学之思开源考试系统

7. 前后端分离的后台管理系统

8. 前后端管理平台一站式脚手架

9. 一个系列项目:NiceFish(美人鱼)

01 前后端分离博客系统

这是一款基于 Spring Boot = Vue 的前后端分离的博客系统,后端采用技术栈:Spring Boot、Spring Security、jjwt、MyBatis、PageHelper、Redis、commonmark-java、ip2region、quartz、yauaa。

前端核心框架:Vue2.x、Vue Router、Vuex;Vue 项目基于 @vue/cli4.x 构建。JS 依赖及参考的 CSS:axios、moment、nprogress、v-viewer、prismjs、APlayer、MetingJS、lodash、mavonEditor、echarts、tocbot、iCSS

02 前后端分离考试系统

该项目是一个前后端分离的在线考试系统。后端使用 Spring Boot,前端使用 VUE 和 Element-UI 组件库配合完成开发。

03 基于 TypeScript 的聊天室项目

该项目是一个聊天室,采用全 TypeScript 开发,目前聊天室已经具备完整的聊天功能,有兴趣的朋友可以自行 fork 去开发。

技术选型:Typescript、Vue2.6.x、Socket/io、Vuex、Nestjs、Typeorm、ES6+、SASS(SCSS)。

04 人力资源管理系统

微人事是一个前后端分离的人力资源管理系统,项目采用 Spring Boot + Vue 开发。首先,不同的用户在登录成功之后,根据不同的角色,会看到不同的系统菜单,完整菜单如下:

每个用户的角色是由系统管理员进行分配的,系统管理员给用户分配角色的页面如下:

系统管理员也可以管理不同角色可以操作的资源,页面如下:

后端技术栈:Spring Boot、Spring Security、MyBatis、MySQL、Redis、RabbitMQ、Spring Cache、WebSocket

前端技术栈:Vue、ElementUI、axios、vue-router、Vuex、WebSocket、vue-cli4

05 前后端分离练手项目

一个基于 Spring Boot + Vue 开发的前后端分离博客项目,带有超级详细开发文档和讲解视频。还未接触过 Vue 开发或者前后端分离的同学可以学起来。

06 开源考试系统

学之思开源考试系统是一款 Java + Vue 的前后端分离的考试系统。主要优点是开发、部署简单快捷、界面设计友好、代码结构清晰。

支持 Web 端和微信小程序,能覆盖到 PC 机和手机等设备。支持多种部署方式:集成部署、前后端分离部署、Docker 部署。

07 后台管理系统

一个基于 Spring Boot 2.1.0 、 Spring Boot Jpa、 JWT、Spring Security、Redis、Vue 的前后端分离的后台管理系统。

项目采用分模块开发方式, 权限控制采用 RBAC,支持数据字典与数据权限管理,支持一键生成前后端代码,支持动态路由。

体验地址:https://el-admin.xin

账号密码:admin / 123456

08 前后端管理平台一站式脚手架

本项目基于Spring Cloud 和Ant Design Pro实现前后端管理平台一站式脚手架,便于快速开发企业级应用。我们的愿景是 基于Copy&Paste技术,实现面向Google&Baidu编程,让码农搬砖不累,做更好的良民。

预览地址:https://admin.awesome-coder.com;用户名和密码:admin

浏览器输入 localhost:8000 后会自动跳转到登录页

输入用户名和密码 admin/admin后,跳转到首页

Cookie中JWT Token

监控服务 localhost:8001效果(如果启动了monitor服务,用户名和密码为admin/admin)

移动端效果

09 美人鱼

NiceFish(美人鱼) 是一个系列项目,目标是示范前后端分离的开发模式:前端浏览器、移动端、Electron 环境中的各种开发模式;后端有两个版本:SpringBoot 版本和 SpringCloud 版本。

历史 推荐的开源项目已经收录到 GitHub 项目,欢迎 Star:

java精品前后端分离项目第11期推荐版医院管理系统

Java精品前后端分离项目第11期推荐版医院管理系统大家好,小辰今天给大家介绍一个基于SpringBoot+Vue实现的医院管理系统,演示视频文章末尾公众号(小辰哥的java)对号查询观看即可文章目录Java精品前后端分... 查看详情

八个开源的springboot前后端分离项目,一定要收藏!

八个开源的SpringBoot前后端分离项目最近前后端分离已经在慢慢走进各公司的技术栈,不少公司都已经切换到这个技术栈上面了。即使贵司目前没有切换到这个技术栈上面,我们也非常建议大家学习一下前后端分离开发,以免在... 查看详情

八个开源的springboot前后端分离项目,一定要收藏!

八个开源的SpringBoot前后端分离项目最近前后端分离已经在慢慢走进各公司的技术栈,不少公司都已经切换到这个技术栈上面了。即使贵司目前没有切换到这个技术栈上面,我们也非常建议大家学习一下前后端分离开发,以免在... 查看详情

七个开源的springboot前后端分离项目,一定要收藏!

前后端分离已经在慢慢走进各公司的技术栈,根据松哥了解到的消息,不少公司都已经切换到这个技术栈上面了。即使贵司目前没有切换到这个技术栈上面,松哥也非常建议大家学习一下前后端分离开发,以免在公司干了两三年... 查看详情

还在从零开始搭建项目?推荐一款高颜值的前后端分离脚手架!(代码片段)

...生成器,可一键生成前端、后端、API文档代码,推荐给大家!SpringBoot实战电商项目mall(50k+star)地址:https://github.com/m 查看详情

前后端分离:分离开发,一体发布(代码片段)

前后端分离开发实践了很久了,前两天需要把一个项目上线,准备SSL证书时发现,居然需要申请3个证书(1年期免费的证书只能对单个子域名申请),这3个域名是:sys.project.cn,Web应用前端api.project.cn,应用后端RESTfulAPIm.project.cn... 查看详情

b站32万播放量,这springboot+vue前后端分离项目教程!强烈推荐!!

花了一个月时间,我录制了一个SpringBoot+Vue的开源博客项目,并编写了详细的开发文档,包括前端和后端。现在免费分享给大家!项目:后端文档:前端文档:讲解视频:如何获取?1.识别并... 查看详情

前后端分离的项目,如何解决登陆问题

...正确后,生成一个token,并把token和userId,存在缓存里(推荐使用redis数据库),然后把token返回给前端。  3、前端每次的请求头中带有token,这样就能够轻松的实现。方案二:使用cookie  1、client发送username和password到server  查看详情

springboot项目一般选择前后端分离好还是整合freemarker?

...--xxx-web除非你自己编写了组件模块,这样干。否则,还是推荐springboot按照文件夹划分 参考技术B如果你自己编写,你可以使用springmvc+springboot+thymeleaf分开前端和后端 查看详情

推荐一个前后端分离.netcore+angular快速开发框架

今天给大家推荐一个开源项目,基于.NetCore开发的、前后端分离、前端有Vue、Angular、MVC多个版本的快速开发框架。项目简介这是一个基于.NetCore开发的快速开发框架,项目采用模块化架构、最新的技术栈、项目高度封装了... 查看详情

nginx反向代理前后端分离项目(后端多台)

目前软件架构都比较流行前后端分离,前后端的分离也实现了前后端架构的分离,带来的好处——整个项目的开发权重往前移,实现真正的前后端解耦,动态资源和静态资源分离,提高了性能和扩展性。通常SpringBoot与vue进... 查看详情

asp.net怎么实现前后端分离asp.net如何实现前后端分离

...page的中间件会造成性能的浪费,可以用ashx去做。当然最推荐的还是使用webapi。 查看详情

前后端分离之后添加验证码

...JS,后端SpringMVC以RESTful接口给前端调用。开发和部署都是前后端分离。项目简单部署图如下,因为后台同时采用微服务的方式,所以后台不止3个,画图示意。终极方案是采用Docker,在前端和后 查看详情

怎么理解前后端分离

对于前后端分离,认识上有个误区,那就是很多人自称:我们老早就分离了,全AJAX,使用Angular或者什么什么就可以了。这个说法是不合适的,打个比方,别人问的是逗如何解决家禽把蛋生在水草边的问题看地,但实际上人家养... 查看详情

9-3前后端分离与restful常见面试题(代码片段)

一、考点聚焦什么是前后端分离?什么是RESTful1.前后端分离的意义和方式2.什么是RESTful3.如何设计RESTful二、什么是前后端分离?有哪些优点?后端只负责提供数据接口,不再渲染模板,前端获取数据并呈现1.前... 查看详情

前后端分离框架

...ps://www.cnblogs.com/shanrengo/p/6397734.html前言:分离模式  对前后端分离研究了一段时间,恰逢公司有一个大项目决定尝试使用前后端分离模式进行,便参与其中。该项目从2016年初立项至今,平平稳稳得度过,但也涌现出越来越多... 查看详情

5_前后端分离

前后端分离属于软件架构的一种。其核心思想是把前端项目(Node.js实现的)和后端项目独立部署到不同的服务器上,前端项目在通过Ajax请求服务器端项目Restful接口实现数据交互。使用前后端分离架构的项目在项目组中往往配备... 查看详情

5_前后端分离

前后端分离属于软件架构的一种。其核心思想是把前端项目(Node.js实现的)和后端项目独立部署到不同的服务器上,前端项目在通过Ajax请求服务器端项目Restful接口实现数据交互。使用前后端分离架构的项目在项目组中往往配备... 查看详情