1. 程式人生 > >react後臺開發框架搭建

react後臺開發框架搭建

out blog project Redux 下載 命令行 apple reac cti

最近整理了一下自己在用的react框架,主要涉及到的技術有react react-router redux Es6 webpack less ant-design等技術,可用於快速開發後臺類系統。

主要實現功能:

  • webpack生成首頁
  • 熱更新
  • 路由分割
  • 打包壓縮
  • 報錯信息指向源文件
  • Es6裝換
  • less轉換
  • 封裝富文本


開發步驟:

  • 在src/containers 文件下添加頁面
  • 在src/router.js 文件裏添加路由
  • 在src/actions 文件下添加頁面對應的.js 文件(主要作用是發起dispatch,改變redux)
  • 在src/reducers 文件下添加頁面對應的.js 文件(設置redux初始值,並根據不同情況進行相應改變)
  • 在src/reducers/index.js 文件將現有的reduces合並為一個大的狀態機

待改進問題

  • 打包代碼壓縮
  • webpack添加環境變量,為快發環境和線上環境定制深度定制不同打包邏輯
  • 登錄頁面加入打包,不單獨列出
  • 與後端進行接口標準制定,並統一改進接口反饋(包括成功提示,失敗提示,404處理,錯誤處理等)

設想

  • 構建自己的node.js服務器
  • 進行服務器端渲染

使用:

1 。從github上clone代碼,代碼見 我的github,希望搭建能幫我點個星

2. 下載我編寫的npm包,可用命令行直接生成基礎框架,npm包代碼見我的github,

$ npm install -g yq-fontend-cli
$ yqbegin init 
<project-name>

react後臺開發框架搭建