【文章後臺管理系統】開發工具+項目模塊+開發流程

（一）URL設計與建模分析+項目源碼+運行界面

（二）開發工具+項目模塊+開發流程

一、工具

前端

• Hbuilder/VSCode
• Vue-Element-Admin框架
• node-v12.13.0-x64.msi
• 淘寶鏡像
• git

後端

• Eclipse/Idea

• git

• Springboot

  • Swagger-ui配置文件

    • controller代碼生成網頁接口文件

  • dev-tools

  • spring + springmvc + mybatis (ssm)

  • mybatis-generator

  • fastdfs（附件管理）

    • 1.搭建fastdfs服務（基於Linux）

    • 2.Java（SpringMVC接受用戶二進制流）

      • 通過API調用fashdfs服務

        • 返回附件詳細信息

    • 3.訪問圖片

      • nginx

  • sercurty

  • excel (poi)

建模

• StarUML-v2.8.0.msi

服務器

• tomcat

二、項目開發前期準備

1.項目初始化：創建Springboot項目

2.mvn spring-boot:run

3.集成swagger-ui

• 1.導入依賴pom.xml
• 2.配置swagger

4.mybatis-generator

• 1.導入依賴

  • plugins

• 2.編寫配置文件

  • 1.驅動類

    • url
    • username
    • password

  • 2.test測試

• 3.調用

  • mvn spring-boot:run
  • mvn mybatis-generator:generate

三、模塊

欄目管理

• 對欄目進行操作，可以添加欄目及刪除欄目，還可以進行批量刪除的操作。

文章管理

• 對文章進行管理，發佈文章及刪除文章，可對文章內容進行修改，還可以批量管理。

用戶管理

• 登錄

  • user(認證授權)

    • /user/login
    • /user/info
    • /user/logout

  • 前端

    • 1.username，password

    • 2.維護token到瀏覽器緩存中

      • cookie
      • sessionStorage
      • localStorage

  • 後端

    • 1.token
    • 2.請求頭中“X-Token” 授權

• info

• 讀者管理

  • 註冊

    • telephone->阿里大魚
    • code

• 添加用戶

  • 角色綁定

角色管理

• 新增角色
• 編輯
• 授權

附件管理

• spring MVC接受二進制流（阿里雲）

• fastdfs

  • 1.搭建fastdfs服務（基於Linux）

  • 2.Java

    • SpringMVC接受用戶二進制流->通過API調用fastdfs服務->返回附件的詳細信息

  • 3.訪問圖片

    • nginx

權限管理

• 1.用戶保存或修改
• 2.用戶設置角色
• 3.角色授權
• 4.權限攔截
• 5.前端處理

四、流程

後端

• 1.創建Springboot項目

  • 選擇依賴

    • devtools
    • springweb
    • mysql driver
    • mybatis

  • 關聯maven倉庫

    • File->settings->Builder、Exception…->Maven

• 2.創建數據庫

  • 創建用戶並授權

• 3.修改配置文件

  • application.properties

    • spring.datasource.driverClassName
    • spring.datasource.url
    • spring.datasource.username
    • spring.datasource.password
    • server.port
    • mybatis.mapper-locations

  • pom.xml

    • 添加dependency：swagger-api文檔
    • 添加plugin：mybatis-generator

• 4.啓動項目

  • mvn spring-boot:run

• 5.搭建三層架構

  • bean

  • dao

  • service

  • web

    • controller

  • config

  • utils

• 6.導入generator配置文件

  • 修改tableName
  • maybatis-generator:generate命令自動生成
  • mvn -Dmybatis.generator.overwrite=true mybatis-generator:generate命令覆蓋生成

• 7.添加工具和配置

  • config包

    • CustomerExceptionHandler
    • MybatisConfig
    • Swagger2
    • WebConfig

  • utils包

    • CustomerException
    • Message
    • MessageUtil

  • 配置主方法

• 8.編寫service層和controller代碼

前端

• 1.下載Vue-Element-admin框架

• 2.通過VSCode/HBuilder打開項目

• 3.cnpm install命令下載依賴

• 4.npm run dev運行項目

• 5.完善src包下編碼

• 6.修改文件

  • .env.development和production修改URL
  • request.js

XMind: ZEN - Trial Version