前后端分離是現(xiàn)在主流的架構(gòu)設(shè)計模式旺芽,它初衷是用「單一職責(zé)」原則把代碼質(zhì)量提上去從而達(dá)到節(jié)省人力和減少溝通時的信息損失的目的采章。
本文推薦九個前后端分離的開源項目悯舟,都是采用最流行的技術(shù)棧抵怎。本文推薦的開源項目已經(jīng)收錄到 Awesome GitHub Repo反惕。
Awesome GitHub Repo 是逛逛 GitHub 創(chuàng)建的開源項目姿染,會收集整理 GitHub 上高質(zhì)量悬赏、有趣的開源項目,并將他們進(jìn)行歸類盾戴。
該開源項目集不是簡單的按照編程語言來分類尖啡,而是按照更有趣的分類方式,比如:有趣項目援雇、沙雕項目惫搏、實戰(zhàn)項目筐赔、學(xué)習(xí)項目茴丰、實用工具等等贿肩。
本期推薦的開源項目是:
1. 前后端分離博客系統(tǒng)
2. 前后端分離考試系統(tǒng)
3. 基于?TypeScript 的聊天室項目
4. 人力資源管理開源項目
5. 一個可以用來練手的前后端分離項目
6. 學(xué)之思開源考試系統(tǒng)
7.?前后端分離的后臺管理系統(tǒng)
8.?前后端管理平臺一站式腳手架
9.?一個系列項目:NiceFish(美人魚)
01
前后端分離博客系統(tǒng)
這是一款基于 Spring Boot = Vue 的前后端分離的博客系統(tǒng)汰规,后端采用技術(shù)棧:Spring Boot溜哮、Spring Security茂嗓、jjwt在抛、MyBatis刚梭、PageHelper朴读、Redis、commonmark-java噪伊、ip2region鉴吹、quartz、yauaa。
前端核心框架:Vue2.x技扼、Vue Router剿吻、Vuex丽旅;Vue 項目基于 @vue/cli4.x 構(gòu)建魔招。JS 依賴及參考的 CSS:axios办斑、moment乡翅、nprogress蠕蚜、v-viewer靶累、prismjs挣柬、APlayer邪蛔、MetingJS侧到、lodash匠抗、mavonEditor汞贸、echarts著蛙、tocbot踏堡、iCSS
02
前后端分離考試系統(tǒng)
該項目是一個前后端分離的在線考試系統(tǒng)。后端使用 Spring Boot帐偎,前端使用 VUE 和 Element-UI 組件庫配合完成開發(fā)削樊。
03
基于 TypeScript 的聊天室項目
該項目是一個聊天室,采用全 TypeScript 開發(fā)谴蔑,目前聊天室已經(jīng)具備完整的聊天功能隐锭,有興趣的朋友可以自行 fork 去開發(fā)成榜。
技術(shù)選型:Typescript赎婚、Vue2.6.x挣输、Socket/io撩嚼、Vuex完丽、Nestjs逻族、Typeorm聘鳞、ES6+抠璃、SASS(SCSS)搏嗡。
04
人力資源管理系統(tǒng)
微人事是一個前后端分離的人力資源管理系統(tǒng)谁尸,項目采用 Spring Boot + Vue 開發(fā)。首先纽甘,不同的用戶在登錄成功之后良蛮,根據(jù)不同的角色,會看到不同的系統(tǒng)菜單悍赢,完整菜單如下:
每個用戶的角色是由系統(tǒng)管理員進(jìn)行分配的决瞳,系統(tǒng)管理員給用戶分配角色的頁面如下:
系統(tǒng)管理員也可以管理不同角色可以操作的資源,頁面如下:
后端技術(shù)棧:Spring Boot左权、Spring Security、MyBatis赏迟、MySQL屡贺、Redis、RabbitMQ锌杀、Spring Cache甩栈、WebSocket
前端技術(shù)棧:Vue、ElementUI糕再、axios量没、vue-router、Vuex突想、WebSocket殴蹄、vue-cli4
05
前后端分離練手項目
一個基于 Spring Boot + Vue 開發(fā)的前后端分離博客項目究抓,帶有超級詳細(xì)開發(fā)文檔和講解視頻。還未接觸過 Vue 開發(fā)或者前后端分離的同學(xué)可以學(xué)起來袭灯。
06
開源考試系統(tǒng)
學(xué)之思開源考試系統(tǒng)是一款 Java + Vue 的前后端分離的考試系統(tǒng)刺下。主要優(yōu)點是開發(fā)、部署簡單快捷稽荧、界面設(shè)計友好怠李、代碼結(jié)構(gòu)清晰。
支持 Web 端和微信小程序蛤克,能覆蓋到 PC 機和手機等設(shè)備。支持多種部署方式:集成部署夷蚊、前后端分離部署构挤、Docker 部署。
07
后臺管理系統(tǒng)
一個基于 Spring Boot 2.1.0 惕鼓、 Spring Boot Jpa筋现、 JWT、Spring Security箱歧、Redis矾飞、Vue 的前后端分離的后臺管理系統(tǒng)。
項目采用分模塊開發(fā)方式呀邢, 權(quán)限控制采用 RBAC洒沦,支持?jǐn)?shù)據(jù)字典與數(shù)據(jù)權(quán)限管理,支持一鍵生成前后端代碼价淌,支持動態(tài)路由申眼。
體驗地址:https://el-admin.xin
賬號密碼:admin / 123456
08
前后端管理平臺一站式腳手架
本項目基于Spring Cloud 和Ant Design Pro實現(xiàn)前后端管理平臺一站式腳手架,便于快速開發(fā)企業(yè)級應(yīng)用蝉衣。我們的愿景是 基于Copy&Paste技術(shù)括尸,實現(xiàn)面向Google&Baidu編程,讓碼農(nóng)搬磚不累病毡,做更好的良民濒翻。
預(yù)覽地址:https://admin.awesome-coder.com;用戶名和密碼:admin
瀏覽器輸入 localhost:8000 后會自動跳轉(zhuǎn)到登錄頁?
輸入用戶名和密碼 admin/admin后,跳轉(zhuǎn)到首頁?
Cookie中JWT Token?
監(jiān)控服務(wù) localhost:8001效果(如果啟動了monitor服務(wù)啦膜,用戶名和密碼為admin/admin)?
移動端效果
09
美人魚
NiceFish(美人魚) 是一個系列項目有送,目標(biāo)是示范前后端分離的開發(fā)模式:前端瀏覽器、移動端僧家、Electron 環(huán)境中的各種開發(fā)模式娶眷;后端有兩個版本:SpringBoot 版本和 SpringCloud 版本。
歡迎關(guān)注公眾號 逛逛GitHub啸臀,后臺回復(fù)「經(jīng)典」獲取本期推薦項目地址届宠。歷史推薦的開源項目已經(jīng)收錄到 GitHub 項目烁落,歡迎 Star:
開源地址:https://github.com/Wechat-ggGitHub/Awesome-GitHub-Repo