先进的React GUI编辑器 — Structor

Structor

它的项目地址是：https://github.com/ipselon/structor

口头描述已经无法形容它的强大了，赶紧看它的视频演示吧！

Structor 是 ReactJS 的用户界面构建器，也就是 Node.js Web 应用 React UI 的可视化开发环境，支持编辑和可视化预览两个模式。

Structor可以通过预先构建好的组件，来使你快速开发用户界面。它自带了React Bootstrap，React Material UI等组件库，你可以通过拖拽轻松完成页面设计。

使用 Structor 的时候不需要安装额外的热重载基础设施 (webpack-dev-middleware, webpack-hot-reloading, react-transform-hmr) ，因为所有的都已经嵌入到 builder 中。

简介

• Structor as playground for React Applications

视频

• Videos on Structor Market
• Structor - 先进的React GUI编辑器 - 腾讯视频

Github上现存项目

• material-ui-prepack
• bootstrap-prepack
• structor-starter-prepack

文章

• 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

这个命令运行。

本地安装

npm install structor

在 package.json 中的 scripts 添加如下行：

"structor": "structor"

可以通过

npm run structor

这个命令运行。

小锦囊

• 使用其他端口运行: structor -p
• 指定不同项目的目录: structor -d
• 详情输出: structor -v

NEXT

如果你的SPA决定使用React，强烈建议试一下这个工具！
如果不想用React全家桶，使用Vue 2.0也是不错的选择！
如果你很hard-core且喜欢挑战，也可以试试FP的Elm！