Red de conocimiento informático - Aprendizaje de código fuente - Proyectos recomendados de separación de front-end y back-end de 9 años

Proyectos recomendados de separación de front-end y back-end de 9 años

La separación de front-end y back-end es el patrón de diseño arquitectónico principal actual. Su intención original es utilizar el principio de "responsabilidad única" para mejorar la calidad del código a fin de ahorrar mano de obra y reducir la pérdida de información. durante la comunicación.

Este artículo recomienda nueve proyectos de código abierto que separan el front-end y el back-end, y todos ellos utilizan las pilas de tecnología más populares. Los proyectos de código abierto recomendados en este artículo se han incluido en Awesome GitHub Repo.

Awesome GitHub Repo es un proyecto de código abierto creado navegando por GitHub. Recopila y clasifica proyectos de código abierto interesantes y de alta calidad en GitHub y los clasifica.

Esta colección de proyectos de código abierto no se clasifica simplemente según lenguajes de programación, sino según métodos de clasificación más interesantes, como: proyectos interesantes, proyectos de esculturas de arena, proyectos prácticos, proyectos de aprendizaje, herramientas prácticas, etc.

Los proyectos de código abierto recomendados en este número son:

1. Sistema de blogs de separación de front-end y back-end

2. Front-end y front -sistema de examen de separación final

3. Proyecto de sala de chat basado en TypeScript

4. Proyecto de código abierto de gestión de recursos humanos

5. Un front-end y un back-end proyecto de separación final que se puede utilizar para practicar

6. Sistema de examen de código abierto Xuezhisi

7. Sistema de gestión back-end con separación front-end y back-end

8. Andamiaje integral para plataformas de gestión front-end y back-end

9. Proyecto de una serie: NiceFish (Mermaid)

01 Front-end y back-end -sistema de blog separado de extremo

Este es un sistema de blog separado de front-end y front-end basado en Spring Boot = Vue. El back-end utiliza la pila de tecnología: Spring Boot, Spring Security, jjwt, MyBatis. , PageHelper, Redis, commonmark-java, ip2region, quartz, yauaa.

Marco central front-end: Vue2.x, Vue Router, proyecto Vue está construido en base a @vue/cli4.x. JS depende y hace referencia a CSS: axios, moment, nprogress, v-viewer, prismjs, APlayer, MetingJS, lodash, mavonEditor, echarts, tocbot, iCSS

02 Sistema de examen de separación de front-end y back-end

Este proyecto es un sistema de examen en línea con separación de front-end y back-end. El backend utiliza Spring Boot y el frontend utiliza bibliotecas de componentes VUE y Element-UI para completar el desarrollo.

03 Proyecto de sala de chat basado en TypeScript

Este proyecto es una sala de chat, desarrollada íntegramente en TypeScript. Actualmente, la sala de chat tiene funciones de chat completas. Los amigos interesados ​​pueden bifurcarlo ellos mismos. .para desarrollar.

Selección de tecnologías: Typecript, Vue2.6.x, Socket/io, Vuex, Nestjs, Typeorm, ES6, SASS (SCSS).

04 Sistema de gestión de recursos humanos

Micro HR es un sistema de gestión de recursos humanos con separación de front-end y back-end. El proyecto se desarrolla utilizando Spring Boot Vue.

En primer lugar, después de que diferentes usuarios inicien sesión correctamente, verán diferentes menús del sistema según las diferentes funciones. El menú completo es el siguiente:

La función de cada usuario la asigna el administrador del sistema. La página donde los administradores asignan roles a los usuarios es la siguiente:

Los administradores del sistema también pueden administrar los recursos que pueden operar diferentes roles. La página es la siguiente:

Pila de tecnología back-end. : Spring Boot, Spring Security, MyBatis, MySQL, Redis, RabbitMQ, Spring Cache, WebSocket

Pila de tecnología front-end: Vue, ElementUI, axios, vue-router, Vuex, WebSocket, vue-cli4

05 Proyecto de práctica de separación de front-end y back-end

Un proyecto de blog de separación de front-end y back-end desarrollado en base a Spring Boot Vue, con documentos de desarrollo súper detallados y videos explicativos. . Los estudiantes que aún no hayan estado expuestos al desarrollo de Vue o la separación del front-end y back-end pueden aprenderlo.

06 Sistema de examen de código abierto

El sistema de examen de código abierto Xuezhisi es un sistema de examen Java Vue que separa la parte frontal y posterior. Las principales ventajas son un desarrollo e implementación simples y rápidos, un diseño de interfaz amigable y una estructura de código clara.

Admite miniprogramas Web y WeChat y puede cubrir dispositivos como PC y teléfonos móviles. Admite múltiples métodos de implementación: implementación integrada, implementación separada de front-end y back-end e implementación de Docker.

07 Sistema de gestión backend

Un sistema de gestión backend basado en Spring Boot 2.1.0, Spring Boot Jpa, JWT, Spring Security, Redis y Vue que separa el front y el backend. .

El proyecto adopta un método de desarrollo modular, utiliza RBAC para el control de permisos, admite diccionario de datos y gestión de permisos de datos, admite la generación con un solo clic de código front-end y back-end y admite enrutamiento dinámico.

Dirección de la experiencia:; Nombre de usuario y contraseña: admin

Después de ingresar localhost: 8000 en el navegador, saltará automáticamente a la página de inicio de sesión

Ingrese el nombre de usuario y contraseña admin/ Después de admin, salte a la página de inicio

Token JWT en cookie

Servicio de monitoreo localhost: efecto 8001 (si se inicia el servicio de monitoreo, el nombre de usuario y la contraseña son admin/admin)

Efecto terminal móvil

09 Mermaid

NiceFish (Mermaid) es una serie de proyectos, el objetivo es demostrar el modelo de desarrollo del frente -Separación de final y back-end: navegador front-end, terminal móvil, entorno Electron. Hay dos versiones de backend en varios modos de desarrollo: versión SpringBoot y versión SpringCloud;

Historial Los proyectos de código abierto recomendados se han incluido en el proyecto GitHub, bienvenido a Star: