Structor
它的項(xiàng)目地址是:https://github.com/ipselon/structor
口頭描述已經(jīng)無法形容它的強(qiáng)大了,趕緊看它的視頻演示吧靴姿!
Structor 是 ReactJS 的用戶界面構(gòu)建器磁滚,也就是 Node.js Web 應(yīng)用 React UI 的可視化開發(fā)環(huán)境,支持編輯和可視化預(yù)覽兩個(gè)模式恨旱。
Structor可以通過預(yù)先構(gòu)建好的組件搜贤,來使你快速開發(fā)用戶界面。它自帶了React Bootstrap仪芒,React Material UI等組件庫,你可以通過拖拽輕松完成頁面設(shè)計(jì)据沈。
使用 Structor 的時(shí)候不需要安裝額外的熱重載基礎(chǔ)設(shè)施 (webpack-dev-middleware, webpack-hot-reloading, react-transform-hmr) 饺蔑,因?yàn)樗械亩家呀?jīng)嵌入到 builder 中。
簡(jiǎn)介
視頻
Github上現(xiàn)存項(xiàng)目
文章
- Using React Router inside of components
- Structor's component model representation
- Shortcuts
- Troubleshooting
需求
- node.js 5.x
- npm 3.8.x
全局安裝
npm install structor -g
全局安裝后可以通過
structor
這個(gè)命令運(yùn)行孔祸。
本地安裝
npm install structor
在 package.json 中的 scripts 添加如下行:
"structor": "structor"
可以通過
npm run structor
這個(gè)命令運(yùn)行发皿。
小錦囊
- 使用其他端口運(yùn)行: structor -p <port>
- 指定不同項(xiàng)目的目錄: structor -d <path_to_project_dir>
- 詳情輸出: structor -v
NEXT
如果你的SPA決定使用React,強(qiáng)烈建議試一下這個(gè)工具惶室!
如果不想用React全家桶玄货,使用Vue 2.0也是不錯(cuò)的選擇!
如果你很hard-core且喜歡挑戰(zhàn)誉结,也可以試試FP的Elm!