Vue.js+Egg.js+Mongodb 打造自己的個人部落格

ANT1994發表於2018-12-14

AntVueBlogFront

Vue.js+Egg.js+Mongodb的前後端分離的個人部落格。

部落格地址:ANT

主要技術棧

部落格功能

前臺頁面

  • 文件列表
  • 分類
  • 標籤
  • 評論

後臺管理

  • 釋出文章、存為草稿
  • 文章管理
  • 標籤管理
  • 分類管理
  • 登入驗證

Setup

執行環境

  • node.js
  • mongoDB

克隆遠端庫

git clone git@github.com:antbaobao/AntVueBlogFront.git
複製程式碼

安裝依賴

cd AntVueBlogFront
npm i
複製程式碼

執行

npm run dev
複製程式碼

效果展示

前端頁面

首頁

首頁

分類

分類

歸檔

歸檔

標籤

標籤

文章詳情

文章詳情

評論

評論

移動端

移動端

目錄

│  .babelrc             babel配置
│  .editorconfig        編輯器配置
│  .eslintignore        eslint忽略
│  .eslintrc.js         eslintrc配置
│  .gitignore           git上傳忽略
│  .postcssrc.js
│  Dockerfile           docker 配置
│  index.html           打包模板
│  package.json
│  README.md
│
├─build
├─src
│   │  main.js        專案入口
│   │  App.vue          根元件
│   │  index.css      全域性樣式
│   │
│   ├─api             api 請求介面
│   │
│   ├─assets          外部引用檔案
│   │  ├─css
│   │  └─js
│   │
│   ├─components      vue元件
│   │
│   ├─ layout         頁面公共結構
│   │
│   ├─store           vuex檔案
│   │
│   ├─utils           工具函式
│   │
│   └─views           頁面vue檔案
│
├─test
└─static            靜態檔案
複製程式碼

TODO

  • 服務端渲染(SSR)
  • 很多細節需要優化,有空再繼續擼
    (完)

相關文章