- Fang Blog 顧名思義是一個「部落格網站」,使用者可以在這裡建立自己的帳號、發表文章,並查閱其他人已發佈的文章。
- 本專案採前後端分離模式開發,詳細說明如下:
- 後端:
- 使用
MySQL
創建與管理資料庫。 - 使用
MyBatis
連結與操作資料庫。 - 使用
SpringBoot 3
完成後端業務邏輯,包括:(1)使用者基本資料的增刪改查、頭像上傳;(2)文章的增刪改查;(3)文章類別的增刪改查。 - 使用
JWT
(Json Web Token)儲存目前登入的使用者。 - 使用
md5
對使用者的密碼進行加密。 - 使用
Redis
存儲有效的 JWT,若 JWT 過期則會要求使用者重新登入。 - 連結
AWS S3
中的 bucket 以儲存使用者上傳的頭像與文章封面。
- 使用
- 前端:
- 使用
Vue 3
作為前端開發框架。 - 使用
Element Plus
作為 UI 框架。 - 使用
Axios
發送 Ajax 請求。
- 使用
- 後端:






- 下載本專案
- 開啟 mysql,執行 ./fang-blog-sql.sql。
- 開啟 redis-server,port 設為 6379。
- 修改 fang-blog-backend/src/main/java/com/ivanfang/fangblog/utils/AwsS3Util.java 檔案,將 aws s3 bucket 的名稱、地區、密鑰修改為自己的。
- 啟動後端
cd ./fang-blog-backend mvn spring-boot:run
- 啟動前端。
cd ./fang-blog-frontend npm install npm run dev
- 開啟以下網址。
http://localhost:5173/login