【狂神说】分析前后端分离开源项目?
文章目錄
- 1.如何分析開源項目
- 項目簡介
- 項目源碼
- 2.觀察開源項目
- 3.開源項目下載
- 4.跑起來是第一步
- 5.前后端分離項目固定套路
- 6.如何找到一個開源項目
1.如何分析開源項目
學習的方式：
任何一個開源項目，都可以讓自己等到提升
代碼自動生成：我們平時會寫很多業務代碼，用Mybatis Plus去生成的，第三方的工具包去生成
開源項目：eladmin
項目簡介
一個基于 Spring Boot 2.1.0 、 Spring Boot Jpa、 JWT、Spring Security、Redis、Vue的前后端分離的后臺管理系統
開發文檔： https://el-admin.vip
體驗地址： https://el-admin.xin
賬號密碼： admin / 123456
項目源碼
| github | https://github.com/elunez/eladmin | https://github.com/elunez/eladmin-web |
| 碼云 | https://gitee.com/elunez/eladmin | https://gitee.com/elunez/eladmin-web |
2.觀察開源項目
后端：
前端：
3.開源項目下載
在碼云下載，因為GitHub下載太慢了，下載完畢進行解壓
解壓完不要著急運行
先去觀察項目：
1、用了哪些技術（Springboot、Vue、Redis、MQ…）
2、是否有數據庫
3、你的環境是否匹配(Maven、(npm、node.js)、redis…)
需要的環境匹配了再想辦法運行
4.跑起來是第一步
1、安裝數據庫，執行SQL（先創建數據庫，編碼默認utf8）
2、前端跑起來（在文件上全選文件名然后cmd）
3、后端項目導入跑起來（打開idea——import）
4、等待所以的項目跑成功
6、啟動后端項目（一般前后端分離項目，前端依賴于后端）
只要發現Swagger，就需要先把swagger跑起來，因為前后端分離的接口全部都在這里
進而查看配置文件，默認端口號，有哪些配置，需要改為自己的項目和環境地址！
（尤其是端口號和用戶名密碼）
前端：就是安裝依賴。啟動測試運行，看接口是否異常
打開Redis
開發環境重點需要去看端口號：server：port：8000（在總文件application.yml里面）前端也是調這個端口
第二個點需要去看Redis的端口號
開發環境dev.yml的JDBC沒有問題
跑起來
進入頁面：localhost://8000/swagger-ui.html
前端跑起來：（推薦VS Code打開文件夾）
5.前后端分離項目固定套路
1、從前端開始分拆，打開控制臺，點一個接口，分析一波調用關系
2、前后端端口調用不一致：前端：8013 后端：8000；研究怎么操作的
-
封裝了接口請求 ajax(前后端分離) axios(Vue) request(前端封裝)
-
找到配置（生產配置、開發環境配置）
-
前后端分離項目的重點：找到接口的調用關系
-
Springboot提供服務、前端調用接口數據、Vue負責渲染頁面
-
前端項目固定套路
-
通過抓取前端的請求，找到后端對應的接口
怎么去跟后端對接：
拿到接口的地址：
去后端找：
-
后端分析套路：Controller–Service–Dao
-
現在從前到后知道怎么分析了，但是如何渲染到視圖上的呢？看前端
- -
Vue標準套路
template：視圖層
script：js操作，接口的調用
style：頁面的樣式
- 如果你現在自己的項目或者要學習一個模塊，將這個模塊獨立抽取出來即可，刪除法
- 比如需要學習用戶模塊，除了了user模塊
如果你想測試這個接口成不成功，在這里測一下，能不能把他查出來就行了
6.如何找到一個開源項目
layui
Semantic UI
Grabient
Vue Element Admin
1、找分類（Java、python）
2、看收藏（star），大家都覺得不錯的，就是比較好的，有學習的價值
3、看具有價值
4、根據自身的理解情況：Java、SSM、Springboot…階段性成果、
5、如何學習Java：Java進階路線七個階段
后端開發去寫前端非常難看，可以使用第三方的：Ant Design Pro 或 Element
總結
以上是生活随笔為你收集整理的【狂神说】分析前后端分离开源项目?的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 多股回测（backtrader+quan
- 下一篇： @Pointcut的用法