不想加班開(kāi)發(fā)管理后臺(tái)了,試試這個(gè) Java 開(kāi)源項(xiàng)目吧!
這里是 HelloGitHub 推出的《講解開(kāi)源項(xiàng)目》系列,今天給大家?guī)?lái)一款開(kāi)源的 Java 后臺(tái)管理框架——EL-ADMIN
它是一個(gè)基于 Spring Boot、Spring Data JPA、JWT、Spring Security、Redis、Vue、Element-UI 的前后端分離的后臺(tái)管理系統(tǒng)。如果你想要學(xué)習(xí)上面這些框架的使用、增加實(shí)戰(zhàn)經(jīng)驗(yàn)、學(xué)習(xí)代碼規(guī)范,又或者找接私活開(kāi)發(fā)的腳手架,提高賺錢(qián)的效率,EL-ADMIN 都能滿(mǎn)足你的需求。
項(xiàng)目地址:https://github.com/elunez/eladmin
簡(jiǎn)單配置后可直接運(yùn)行,極大地提高了你在開(kāi)發(fā)管理后臺(tái)的效率,從而有更多時(shí)間逛 HelloGitHub。不信?跟著本文,讓你 5 分鐘 跑起來(lái)一個(gè)功能豐富的管理后臺(tái)項(xiàng)目。
一、快速開(kāi)始
1.1 環(huán)境準(zhǔn)備
后端環(huán)境:
- JDK 1.8+
- Maven 3.0+
- MYSQL 5.5+
- Redis 3.0+
前端環(huán)境:
- Node v10+
開(kāi)發(fā)工具
- IDE:IDEA
- MySQL 可視化:Navicat
1.2 快速開(kāi)始
(1)clone 項(xiàng)目
- GitHub:
- # 后端項(xiàng)目
- git clone https://github.com/elunez/eladmin.git
- # 前端項(xiàng)目
- git clone https://github.com/elunez/eladmin-web.git
- Gitee(國(guó)內(nèi)訪(fǎng)問(wèn)網(wǎng)速較快):
- # 后端項(xiàng)目
- git clone https://gitee.com/elunez/eladmin.git
- # 前端項(xiàng)目
- git clone https://gitee.com/elunez/eladmin-web.git
(2)導(dǎo)入 MySQL 數(shù)據(jù)庫(kù)
打開(kāi) Navicat,連接 MySQL,新建數(shù)據(jù)庫(kù) eladmin,設(shè)置字符集和排序規(guī)則如下圖所示:
右鍵你新建的數(shù)據(jù)庫(kù),選擇「運(yùn)行 SQL 文件」,選擇 clone 的下來(lái)的 eladmin/sql/eladmin.sql 文件。
導(dǎo)入 SQL 數(shù)據(jù)成功,一共有 27 張表。
(3)運(yùn)行后端項(xiàng)目
配置文件:使用 IDEA 打開(kāi)后端項(xiàng)目 eladmin,等待 maven 下載結(jié)束后,打開(kāi)配置文件 yml 配置數(shù)據(jù)庫(kù),改成你機(jī)器上的 MySQL 或者 Redis 的 IP、端口和密碼。
- MySQL 默認(rèn):
- url:localhost:3306
- 密碼:123456
- Redis 默認(rèn):
- url:localhost:6379
- 密碼:無(wú)
運(yùn)行后端項(xiàng)目:
(4)運(yùn)行前端項(xiàng)目
在 clone 的前端項(xiàng)目「eladmin-web」文件夾下打開(kāi) cmd 命令行窗口。
- # 安裝
- npm install
- # 運(yùn)行
- npm run dev
1.3 效果預(yù)覽
運(yùn)行成功會(huì)自動(dòng)彈出下面界面:
二、可能遇到的坑
2.1 端口占用
報(bào)錯(cuò)信息:
我們這里使用其他端口,修改配置文件 application.yml 端口為 8001:
- server:
- port: 8001
注意:修改后端端口后,需要修改前端對(duì)應(yīng)的請(qǐng)求接口。
2.2 npm install 安裝緩慢或者安裝失敗
設(shè)置淘寶鏡像源來(lái)解決
- npm config set registry https://registry.npm.taobao.org
檢查是否設(shè)置成功
- npm config get registry
三、如何學(xué)習(xí)這個(gè)項(xiàng)目
3.1 基本用途
EL-ADMIN 是一個(gè)簡(jiǎn)單且易上手的 Spring boot 后臺(tái)管理框架,你可以通過(guò)它學(xué)習(xí)到:
- Spring Boot、Spring Data JPA、JWT、Spring Security、Redis、Vue、Element-UI 等框架的使用
- 增加項(xiàng)目經(jīng)驗(yàn)
- 學(xué)習(xí)代碼規(guī)范
- 作為接私活開(kāi)發(fā)的「腳手架」,提高賺錢(qián)效率(比如 項(xiàng)目代碼生成模塊 可以直接生成前后端代碼)
3.2 深入學(xué)習(xí)
了解完基本用途和快速開(kāi)始之后,你想要更深層的學(xué)習(xí)這個(gè)開(kāi)源項(xiàng)目的話(huà),可以:
- 了解技術(shù)框架:如果你沒(méi)有了解 Spring Boot、Spring Data JPA、JWT、Spring Security、Redis、Vue、Element-UI 這些技術(shù)框架你應(yīng)該先去了解它們,這是項(xiàng)目基石,不會(huì)的請(qǐng)網(wǎng)上搜索,因?yàn)?搜索是基本技能
- 了解項(xiàng)目結(jié)構(gòu):了解各個(gè)模塊和文件的主要作用
- 了解項(xiàng)目功能:了解項(xiàng)目實(shí)現(xiàn)的功能(比如說(shuō) 權(quán)限驗(yàn)證 ),這個(gè)項(xiàng)目使用了什么技術(shù)來(lái)實(shí)現(xiàn)「權(quán)限驗(yàn)證」(JWT 和 Spring Security),你需要在源代碼里面將這個(gè)功能實(shí)現(xiàn)的大致流程看懂(你可以找到功能入口一層一層點(diǎn)進(jìn)去或者 Debug 或者 自己寫(xiě)一個(gè)類(lèi)似功能)
3.3 怎么學(xué)習(xí)
學(xué)習(xí)一個(gè)開(kāi)源項(xiàng)目,你應(yīng)該首先要明確的是 你學(xué)習(xí)開(kāi)源項(xiàng)目的目的,因?yàn)楹芏嚅_(kāi)源項(xiàng)目(比如 EL-ADMIN)代碼量還是比較大的,不同學(xué)習(xí)目的應(yīng)該有不同的學(xué)習(xí)深度,而不是僅限于快速開(kāi)始然后無(wú)從下手。
四、最后
很多同學(xué)學(xué)習(xí) SpringBoot 的相關(guān)課程之后并不知道應(yīng)該繼續(xù)學(xué)習(xí)什么、做些什么實(shí)戰(zhàn)項(xiàng)目。因?yàn)槲揖陀蓄?lèi)似的經(jīng)歷 ,這里我的個(gè)人建議:學(xué)習(xí)不是目的,使用起來(lái)才是,學(xué)了就要用,學(xué)了卻不去用,還不如不學(xué),因?yàn)椴痪镁蜁?huì)忘的一干二凈。如果只是學(xué)習(xí)卻不鞏固你的大腦就會(huì)將其忘記,而「實(shí)踐」就是鞏固的最佳方法,希望你能在實(shí)踐中體驗(yàn)設(shè)計(jì)程序的快樂(lè)!
至此,感謝您的閱讀。項(xiàng)目涉及到的知識(shí)點(diǎn)比較多,如果你時(shí)間不夠充裕,建議選擇感興趣或者合適的功能去學(xué)習(xí),有基礎(chǔ)建議直接閱讀 官方文檔。