個人先後端架子搭建

前言

做爲一名前端開發者，瞭解一些後端語言，成爲半個全棧工程師也是最基本的（23333），就本篇文章，給你們介紹一下個人先後端目錄結構，不喜勿噴，也但願各位給我一些意見，哈哈哈。

開發語言

前端

前端這裏使用react.js，打包工具是parcel

後端

後端使用的語言依舊是熟悉的node.js，使用express搭建後端框架。

數據庫

數據庫使用的是mongodb

目錄結構

• db 數據庫有關文件

  • schemas 數據庫的各個collection的映射

    • user.js 數據庫的user collection的映射
    • ... ... 其餘collection的映射
  • connect.js 鏈接數據庫
  • mongoose-db.js 導出可操做數據庫的映射對象

• tool

  • 通用工具類（如發郵件等通用操做） ...

• public 前端開發文件夾

  • dist 打包build生成的文件

  • public 存放入口文件- index.html、網站圖標、生成pwa網站的manifest文件

    • index.html
    • xxx.ico
    • manifest.json
    • ... 其餘

  • src 源代碼文件夾

    • actions 存放全部actions

      • index.js 導出全部actions
      • action_1.js 相關業務的action，名字隨便取的~~
      • ... ....

    • asset 存放全部靜態文件

      • xxx.png
      • xxx.json
      • ... ...

    • components 存放全部自定義通用組件

      • index.js 導出全部自定義通用組件
      • ... ... 一系列本身寫的通用組件

    • constants存放全部action type

      • index.js 導出全部action type
      • ActionTypes_1.js
      • ... ...

    • container 存放主渲染、包含router等配置的js文件

      • app.js
      • index.scss

    • lib 存放全部通用類、http請求類、配置文件

      • index.js 導出須要的js文件
      • config.js 配置文件，例如開發模式下的後端接口url，cookie的有效時間等......
      • cookie.js 自定義cookie的增刪改查操做類
      • userServer.js 有關用戶業務的http請求類
      • ...其餘http請求類的封裝
    • pages 全部頁面

    • reducers 全部的reducer

      • index.js 導出一個包含全部reducer的rootReducer
      • reducer_1 名字在這裏是舉例...
      • ... ...
    • main.js 入口js文件
  • .babelrc babel的配置文件
  • package.json

• routes express的全部router

  • route_1.js
  • route_2.js
  • ......

• service 有關邏輯處理與數據庫的交互

  • service_1.js
  • service_2.js
  • ... ...
• config.js 有關後端的配置文件，通常包含數據庫鏈接地址，token認證的祕鑰，token的有效時間，服務運行的端口號等......
• index.js node.js 的入口文件
• package.json

結語

node.js 的後端結構，主要仍是採用mvc的模式，可是這裏沒有view層，routes即爲Controller， schemas 即爲Model層，service爲服務層（Service），但願能給一些不明白的同行帶來一點靈感，若是有不合理的地方，也但願各位大神指點迷津，哈哈，ok，不說了。

---

附上項目地址：https://github.com/justwiner/...