SpringBoot + Vue를 기반으로 개발된 백엔드 관리 시스템 템플릿
Zoey 프레임워크에 설명된 대로 저는 항상 나만의 백엔드 관리 시스템 템플릿을 개발하고 싶었지만 처음에는 프론트엔드와 백엔드를 분리하는 시스템을 접한 적이 없었습니다. 결국 저는 다양한 스타일과 메뉴의 역동적인 렌더링에 압도당했습니다. 이 기간 동안 저는 훌륭한 오픈 소스 프레임워크 세트를 사용해볼까 수없이 생각했지만 너무 성급했습니다. 배우고자 하는 마음가짐으로 인해 나는 다시 한번 여러 우수한 오픈소스 프레임워크에 눌리게 되었습니다.
그 경험을 통해 배운 후에는 진정하고 현실적으로 기술을 배워야 한다는 것을 깊이 깨달았습니다. 마침내 일정 시간이 지난 후 이전 문제를 하나씩 해결하고 몇 가지 훌륭한 오픈 소스 프레임워크를 성공적으로 이해했습니다. 아이디어가 있다면 일련의 배경 관리 시스템 템플릿을 개발하려는 내적 욕구가 점점 더 강해졌습니다. 마침내 나는 나만의 백엔드 관리 시스템 템플릿 세트를 개발했습니다.
개발이 완료된 후에는 개발을 완료하고 해당 기본 기능을 구현하는 것만으로는 충분하지 않다는 것을 깊이 깨달았습니다. 높은 동시성 및 다중 사용자 액세스에 직면했을 때 시스템이 다양한 상황을 처리하는 것을 통해 이제 막 벗어났다는 것을 깨달았습니다. 긴 행진의 첫걸음. 앞으로도 계속 최적화하고 반복하겠습니다. 여러분의 별은 저의 원동력입니다❤️
Github 주소: https://github.com/Architect-Java/system-template
Gitee 주소: https://gitee.com/dream-flight/system--template
관리자 계정: admin 비밀번호: 123456
테스트 계정: test 비밀번호: 1234567
프런트엔드 프로젝트는 system-vue
디렉터리에 있습니다.
백엔드 프로젝트는 system-springboot
디렉터리에 있습니다.
SQL 파일은 루트 디렉터리에 있는 system-mysql8.sql
파일이며, 여기에는 MySQL8 이상이 필요합니다.
프런트엔드 프로젝트:
system-vue
├── public
├── api -- api请求接口目录
├── assets -- 静态资源
├── components -- 全局组件
├── constant -- 全局常量
├── filter -- 过滤器
├── icons -- svg图标
├── layout -- 布局目录
├── router -- 路由
├── store -- 全局缓存
├── styles -- scss样式目录
├── utils -- 工具目录
├── views -- 页面视图
├── App.vue -- App.vue
├── main.js -- main.js
└── permission.js -- 路由导航守卫
백엔드 프로젝트
system-springboot
├── annotation -- 自定义注解
├── aspect -- aop切面
├── config -- 配置模块
├── constant -- 静态常量模块
├── controller -- 控制器模块
├── dto -- dto模块
├── entity -- 实体类模块
├── enums -- 枚举模块
├── filters -- 过滤器模块
├── generator -- 逆向工程模块
├── handler -- 处理器模块(自定义JWT权限过滤器)
├── mapper -- 数据持久化模块
├── service -- 业务处理模块
├── util -- 工具类模块
└── vo -- vo模块
프로젝트를 로컬 영역으로 가져온 후 데이터베이스에서 직접 system-mysql8.sql
파일을 실행하면 데이터베이스가 자동으로 생성되고 데이터를 가져옵니다. 그런 다음 프로젝트 구성 클래스에서 해당 매개변수 정보를 수정해야 합니다. 그런 다음 프런트엔드 프로젝트에서 npm install
메서드를 실행하여 프런트엔드 프로젝트에 해당하는 종속성을 다운로드하면 프로젝트가 성공적으로 시작될 수 있습니다.
프로젝트가 성공적으로 시작된 후 관리자 계정: admin 및 비밀번호: 123456을 입력하여 로그인하고 시스템에 들어갑니다.
로컬 인터페이스 문서 주소: http://localhost:8090/doc.html
코드 생성기 작업: Mybatis-Plus
코드 생성기를 사용할 때 먼저 /src/main/java/com/zrkizzy/template/generator
디렉터리에 있는 CodeGentrator
파일의 데이터베이스 연결 매개변수와 데이터베이스 사용자 이름 및 비밀번호를 적절하게 수정해야 합니다. 다음 후에 성공적으로 실행될 수 있습니다.
참고: 백엔드 프로젝트를 먼저 시작한 다음 프런트엔드 프로젝트를 시작하세요. 프런트엔드 프로젝트의 많은 데이터와 구성은 백엔드에 의해 동적으로 로드됩니다.
프런트엔드: vue + vuex + vue-router + axios + element-ui + sass + vue-cropper + dayjs + nprogress
백엔드: SpringBoot + SpringSecurity + JWT + Swagger2 + MyBatisPlus + MySQL + Redis + Freemarker + FastJson + Kaptcha
개발 도구 | 기능적 역할 |
---|---|
아이디어 | 자바 개발 도구 |
네비캣 | MySQL 연결 도구 |
VSCode | Vue 개발 도구 |
메디스 | Redis 연결 도구 |
개발 환경 | 버전 |
---|---|
JDK | 1.8 |
MySQL | 8.0.13 |
뷰 | 2.6.11 |
레디스 | 6.0.5 |
제가 개발한 최초의 완전히 개발된 웹 프로젝트는 2학년 때 학교를 위해 개발된 수상 및 우수 관리 시스템이었으며 공식 Layui 웹사이트가 아직 오프라인이 아니었고 jQuery가 여전히 하늘을 점령했던 것을 기억합니다. 초보자의 경우 백엔드 관리 시스템 템플릿이 비교적 사용하기 쉽습니다. Mybatis-Plus 코드 생성기를 통합한 후에는 개발 및 재생산을 배우는 것이 초보자에게 적합합니다. 프런트 엔드 스타일 및 빌드의 수동 구현. 프로젝트에 부족한 점에 대해 사과드립니다. 질문이나 제안 사항이 있으면 개인적으로 메시지를 보내주십시오. 또한 그룹 채팅에 참여하여 서로를 격려하고 함께 토론하고 격려합니다. 다른!