Current location - Music Encyclopedia - Today in History - Recommend 9 yyds front-end and back-end separation projects
Recommend 9 yyds front-end and back-end separation projects
Front-end separation is the mainstream architecture design mode at present. Its original intention is to improve the code quality with the principle of "single responsibility" in order to save manpower and reduce the loss of information in the communication process.

This paper recommends 9 open source projects with front-end separation, all of which adopt the most popular technology stack. The open source project recommended in this article has been included in Awesome GitHub Repo.

Awesome GitHub Repo is an open source project created by visiting GitHub. It will collect and sort out high-quality and interesting open source projects in GitHub and classify them.

Open source project set is not simply classified by programming language, but by more interesting classification methods, such as interesting projects, sand sculpture projects, actual combat projects, learning projects, practical tools and so on.

The open source projects recommended in this issue are:

1. Blog system with front and back separated.

2. Front-end and back-end separate examination system

3. Chat room project based on TypeScript

4. Open source project of human resource management

5. Front-end separation project that can be used to practice hands.

6. Open source examination system for learning thinking.

7. Back-end management system with front-end and back-end separation

8. One-stop construction of front-end and back-end management platforms

9. A series of projects: Nice Fish (Mermaid)

0 1 front-end separation blog system

This is a blog system based on Spring Boot = Vue, and the back-end uses technology stack: Spring Boot, Spring Security, jjwt, MyBatis, PageHelper, Redis, commonmark-java, ip2region, quartz, yauaa.

Front-end core framework: Vue2.x, Vue router, Vuex;; The Vue project is built on the basis of @ vue/cli4.x, and JS relies on and references CSS:axios, moment, nprogress, v-viewer, prismjs, APlayer, MetingJS, lodash, mavonEditor, echarts, tocbot, iCSS.

02 front-end and back-end separated examination system

This project is an online examination system with front-end separation. The back-end uses Spring Boot, and the front-end uses VUE and Element-UI component libraries to complete the development.

Chat room project based on TypeScript

This project is a chat room, which is developed with all typed manuscripts. At present, the chat room has a complete chat function, and interested friends can develop it themselves.

Technical selection: Typescript, Vue2.6.x, Socket/io, Vuex, Nestjs, Typeorm, ES6+, SASS(SCSS).

04 human resource management system

Micro-personnel is a human resource management system with front-end separation, and the project is developed by Spring Boot+Vue. First of all, after successful login, different users will see different system menus according to different roles. The complete menu is as follows:

Each user's role is assigned by the system administrator. The page where the system administrator assigns roles to users is as follows:

System administrators can also manage resources operated by different roles. The page is as follows:

Back-end technology stack: Spring Boot, Spring Security, MyBatis, MySQL, Redis, RabbitMQ, Spring Cache, WebSocket.

Front-end technology stack: Vue, ElementUI, axios, vue-router, Vuex, WebSocket, vue-cli4.

Hand training program with front and rear ends separated.

Blog project based on Spring Boot+Vue, with super detailed development documents and explanation videos. Students who have not been exposed to Vue development or front-end separation can learn.

06 open source examination system

The open source examination system for learning is a Java+Vue examination system with separated front and back. The main advantages are simple and quick development and deployment, friendly interface design and clear code structure.

Support Web and WeChat applets, covering PC, mobile phone and other devices. Support multiple deployment methods: integrated deployment, front-end separation deployment and Docker deployment.

07 background management system

A background management system based on Spring Boot 2. 1.0, Spring Boot Jpa, JWT, Spring Security, Redis and Vue.

The project adopts modular development mode, adopts RBAC for permission control, supports data dictionary and data permission management, supports one-click generation of front-end and back-end codes, and supports dynamic routing.

Experience address:; User name and password: admin

After entering localhost:8000, the browser will automatically jump to the login page.

After entering the user name and password admin/admin, jump to the home page.

Jwtoken in Cookie

Monitoring service localhost:800 1 effect (if monitoring service is started, user name and password are admin/admin).

Mobile end effect

09 mermaid

NiceFish is a series of projects, the goal of which is to show the development mode of front-end separation: front-end browser, mobile terminal and various development modes in electronic environment; There are two versions of the backend: SpringBoot version and SpringCloud version.

Open source projects recommended by history have been included in GitHub projects. Welcome to Star: