Idyll Open Source build interactive Web Markup Language trial

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

• Installation

npm install -g idyll

• Basic use

idyll create

Effect

Build && Run

• Build

idyll build

• Run

可以直接打开 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:


Description

idyll 使用起来比较简单，同时直接组件化开发（直接使用react 组件），对于图表的支持也是很不错的，默认demo就有集成d3的简单例子，同时还可以方便的集成到web app 中

Resources

Https://idyll-lang.org/docs
Https://github.com/rongfengliang/idyll-demo-project

Idyll Open Source build interactive Web Markup Language trial