Description
Idyll is an open-source markup language and toolkit for producing interactive web pagesYou give Idyll a markup file , and it compiles that file to a full bundle of HTML , Java Script , and CSS that can run in anyone‘ s web browserIdyll can be used to create explorable explanations , and to add interactivity to blog engines and content management systems . The tool can generate standalone webpages or be embedded inside of an existing page , and can be fully themed to match your stylegui大体意思:IDYLL是一种用于生成交互式网页的开源标记语言和工具箱。给I定dyll一个标记文件,可以将该文件编译成可以在任何人的Web浏览器中运行的HTML、Java脚本和CSS的完整包。IDYLL可以用来创建可探索的解释,并增加博客引擎和内容管理系统的交互性。该工具可以生成独立的网页或嵌入现有页面中,并且可以完全主题以匹配您的样式GUI。
Simple trial
npm install -g idyll
idyll create
Effect
Build && Run
idyll build
可以直接打开 build 目录或者idyll watch 构建同时使用dev server
- View Effects
- Publish to Idyll Pub server
HTTPS://IDYLL.PUB/POST/MY-IDYLL-POST-034CBD6689501A486899F265/Direct access to Demo
- Add a custom Component
Note the name of the component Custom--component components/directory
components/custom-apps-component.jsconst React = require(‘react‘);class CustomAppsComponent extends React.Component { render() { const { hasError, idyll, updateProps, ...props } = this.props; return ( <div {...props}>
Effect:
Descriptionidyll 使用起来比较简单,同时直接组件化开发(直接使用react 组件),对于图表的支持也是很不错的,默认demo就有集成d3的简单例子,同时还可以方便的集成到web app 中
ResourcesHttps://idyll-lang.org/docs
Https://github.com/rongfengliang/idyll-demo-project
Idyll Open Source build interactive Web Markup Language trial