介绍
GrapesJS是一个免费的开源Web Builder框架，它可以帮助你更快、更轻松地构建HTML模板，以便在网站、时事通讯或移动应用程序中交付。主要是，grapejs被设计用来在CMS中加速动态模板的创建！
Github
https://github.com/artf/grapesjs
概念
为了更好地理解grapejs的概念，请查看下面的图片
一般来说，任何“模板系统”，你会发现在各种应用程序，如CMS，是由结构（HTML）、样式（CSS）和变量组成的，然后在服务器端用其他模板和内容替换，并在客户端呈现。
特性
一般情况下都会为了能够实现基本无编码，有几个是无法省略的，分别是控件、样式管理、布局管理、代码预览、资产文件管理（如图片），grapejs都已经全部囊括进来了：
开发<link rel="stylesheet" href="path/to/grapes.min.css"><script src="path/to/grapes.min.js"></script><div id="gjs"></div><script type="text/javascript"> var editor = grapesjs.init({ container : '#gjs', components: '<div class="txt-red">Hello world!</div>', style: '.txt-red{color: red}', });</script>
或者这样
<div id="gjs"> <div class="txt-red">Hello world!</div> <style>.txt-red{color: red}</style></div><script type="text/javascript"> var editor = grapesjs.init({ container : '#gjs', fromElement: true, });</script>
直接看Demo，简单来说它就是一个网页设计器，demo已经很完整的展现了它：
类似产品
在很久之前，咱们的文章中介绍过一个VvvebJs也是一个类似的产品，
https://github.com/givanz/VvvebJs
同GrapesJS一样在Demo上都实现了很好的功能，并且已经加上了导出和下载功能，小伙伴们直接可以在Demo上尝试了
总结
笔者在很多地方都看到有无代码开发的需求，目前已经有很多这种做的很不错的产品模块，像这样开源免费的产品属实让人称赞，不管是VvvebJs还是GrapesJS都是属于开源中的精品，必须得感谢开发者无私的奉献！
| 
最新评论
查看全部评论(18)