SpringBoot + Vueに基づいて開発されたバックエンド管理システムのテンプレート
Zoey フレームワークで説明されているように、私は常に独自のバックエンド管理システム テンプレートを開発したいと考えていましたが、最初はフロントエンドとバックエンドを分離したシステムに触れたことはありませんでした。さまざまなスタイルやメニューのダイナミックなレンダリングに圧倒され、この間、バックエンドの開発中に、一連の優れたオープンソース フレームワークを使用することを何度も考えましたが、あまりにも衝動的でした。学ばなければならないという精神を持っていたにもかかわらず、最終的には、さまざまな優れたオープンソース フレームワークによって再び抑圧されることになりました...
この経験を経て、私は落ち着いて、地に足のついた技術を学ぶ必要があると痛感しました。しばらくして、最終的に、以前の問題を 1 つずつ解決し、いくつかの優れたオープンソース フレームワークを理解することができました。アイデアがあれば、一連のバックグラウンド管理システム テンプレートを開発したいという私の内なる欲求がますます強くなりました。最後に、私は独自のバックエンド管理システム テンプレートのセットを開発しました。
開発が完了した後、開発を完了し、対応する基本機能を実装するだけでは十分ではないことを深く認識し、高い同時実行性やマルチユーザー アクセスが発生したときのさまざまな状況へのシステムの対応を理解することができました。長い行軍の第一歩。今後も最適化と反復を続けます。あなたのスターが私のモチベーションです❤️
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
開発ツール | 機能的な役割 |
---|---|
アイデア | Java開発ツール |
ナビキャット | MySQL接続ツール |
VSコード | Vue開発ツール |
メディス | Redis接続ツール |
開発環境 | バージョン |
---|---|
JDK | 1.8 |
MySQL | 8.0.13 |
ヴュー | 2.6.11 |
レディス | 6.0.5 |
私が開発した最初の完全に開発された Web プロジェクトは、2 年生のときに学校向けに開発された賞と優秀性の管理システムであったことを常に覚えています。Layui の公式 Web サイトはまだオフラインではなく、jQuery がまだ空を占めていたことを今でも覚えています。 Mybatis-Plus コードジェネレーターを統合すると、初心者にとってバックエンド管理システムのテンプレートは比較的使いやすくなり、初心者が開発と再現を学ぶのに適していると個人的には思います。フロントエンドのスタイルとビルドを手動で実装します。プロジェクトに不備があった場合は申し訳ありませんが、ご質問やご提案がございましたら、個人的にメッセージをお送りください。また、グループ チャットへの参加も歓迎します。お互いに励まし合い、一緒に議論し、共に前進していきましょう。他の!