中文 | EN
MIAO ( ”Miao Is A web demO generator”的缩写,读音为/mjɑʊ/) 是一个非侵入式的网页演示生成器,能够快捷地将某个函数或者某段代码转化为网页界面,用以临时的演示或者测试,开箱即用而无需复杂的配置过程。
MIAO 并不是一个 Web 框架,其关注点与Web框架有着很大差异,MIAO 主要是用于制作一些临时性的小 Demo 或者小的在线工具,而不是被应用在生产环境中,也不建议被用于正式的项目中。
MIAO 在灵活性与易用性之间作了取舍,主要着眼于提供便捷的,开箱即用的临时网页小 Demo 生成功能,而不提供过多的配置与自定义界面/交互的功能,也不像Web框架那样,提供诸如「权限控制」、「路由」、「模板渲染」、「Session」等功能。
只需三步即可快速创建一个临时小 Demo:
引入库->加注解->启动服务
MIAO目前仅支持 Java 和 Python,后续会加入对其他语言(如Golang,JavaScript,Haskell)的支持,敬请期待。
Gitee 上为自动同步的镜像页,如果您想 Star / 贡献代码 / 提Issue 等操作,请移步 Github-MIAO。
本工具尚未全部开发完成,目前仅能使用部分主要功能,其余功能的实现计划详见后文「规划路线图」章节
(Python 版见:https://gitee.com/TheColdVoid/MIAO-python )
MIAO 仅支持在Java 1.8及以上的版本中运行
pom.xml(Maven)中加入:
<dependencies>
<dependency>
<groupId>cn.voidnet</groupId>
<artifactId>MIAO</artifactId>
<version>0.0.10</version>
</dependency>
</dependencies>
或者,您也可以去 Release 中下载 jar 并将其加入您项目的外部库依赖目录中
然后只需引入库,并在想要生成界面的函数(显然,只能是静态函数)上,打上@WebDemo 注解,
@WebDemo
public static int getRandomNumber(int min, int max) {
return new Random().nextInt(max - min + 1) + min;
}
最后在 main 函数(或者其他您想要启动服务的地方)中,启动本工具的服务器端即可
public static void main(String[] args) {
MIAO.start();
}
( start()函数将在执行时阻塞,因此您需将此行代码放在 main 中您的其他代码的后面,或者开一个新的线程供本工具提供服务。)
就可以自动生成这样的临时 Demo:
输入参数后,点击「执行」即可执行,并获得返回值:
执行结果可以以「表格」的形式进行可视化(后续会增加其他的可视化形式选项,如「图表」「图片」「树」等): 存储返回结果的类:
class Cat {
String name;
String color;
Integer age;
Integer length;
}
为函数加上注解( visualization 为选择可视化形式的注解参数):
@WebDemo(visualization = VisualizationType.TABLE)
public static List<Cat> getCatInfo() {
return Arrays.asList(
new Cat("花花", "花", 8, 46),
new Cat("空空", "空", 17, 184),
new Cat("黑黑", "黑", 7, 73)
);
}
即可得到这样的「表格」形式的可视化结果: (需要注意的是,返回值的类中必须具有要显示的属性 Getter 方法(可以用 lombok 等工具自动生成,或者手动编写),否则返回结果将无法正确地被序列化)
您也可以返回 List<Map<K,V>> 类型的结果,也一样可以获得和上面一样的可视化形式的返回结果,例如:
@WebDemo(visualization = VisualizationType.TABLE)
public static List<Map<String, String>> getCatInfo() {
Map<String, String> map0 = new LinkedHashMap<>();
map0.put("name", "花花");
map0.put("color", "花");
map0.put("age", "8");
map0.put("length", "46");
Map<String, String> map1 = new LinkedHashMap<>();
map1.put("name", "空空");
map1.put("color", "空");
map1.put("age", "17");
map1.put("length", "184");
Map<String, String> map2 = new LinkedHashMap<>();
map2.put("name", "黑黑");
map2.put("color", "黑");
map2.put("age", "7");
map2.put("length", "73");
return Arrays.asList(map0, map1, map2);
}
您如果只是想简单地将一个列表作为返回结果,MIAO 也是支持的, 例如:
@WebDemo(visualization = VisualizationType.TABLE)
public static List<String> voice() {
return Arrays.asList("喵", "汪", "嗷");
}
可以生成如下的界面:
对于上述几种情况,您都可以手动指定表格中每行的元素类型,使 MIAO 在函数返回值为空表时,能正确地显示表头:
@WebDemo(
visualization = VisualizationType.TABLE,
tableRowType = Cat.class
)
public static List<Cat> getCatInfo() {
return Arrays.asList();
}
(由于 Java 中的泛型类型擦除机制,MIAO 无法在通过运行期反射来获取返回值类型的泛型参数,因此无法根据返回值类型来自动推断表头,只能用这种方式来实现这个功能)
您也可以手动指定表头中的列名:
@WebDemo(
visualization = VisualizationType.TABLE,
tableHeaders = {"name","color","age"}
)
public static List<Map> getCatInfo() {
这个功能也一样可以被用来限制或筛选表格中要被显示的列:
当然,本工具也提供了一些简单的定制化选项,例如您可以修改函数名、函数简介、参数名等:
@WebDemo(
value = "两数相加",
description = "返回两个数相加的结果"
)
public static double add(
@Parameter("操作数1") double opr1,
@Parameter("操作数2") double opr2
) {
return opr1 + opr2;
}
上方的标题也可以通过参数来进行修改:
MIAO.start("Cat Ear Switch Controller");
将来会增加更多的定制项(例如参数的选择方式、配色等等)
PS:如果您使用的是 Gradle,请在 repositories 中加入 mavenCentral(),再引入本库
PPS:请您将要生成网页 Demo 的函数及其所在的类 设为 public,以规避 Java 反射限制
PPPS:如果您没有手动指定参数的名称而是希望界面自动获取参数的名字的话,您需要在编译参数中加入-parameters
参数,否则javac在编译代码时会自动抹除参数名称,本工具就无法读取参数名称以在界面中显示了(只能显示 arg0,arg1,arg2….)
以IDEA为例:
PPPPS:由于本工具尚未全部开发完成,现在暂时函数参数和返回值只支持基本数据类型,可视化形式只支持「表格」,后续将会加入对「图片」「图表」「复杂对象」「文件」「视频」「函数图像」等的支持,详见「规划路线图」章节
MIAO 是”Miao Is A web demO generator”的缩写,同时也是汉语中用来形容猫叫声的音节(喵,读作miāo),类似「meow」和「にゃ」(≧∇≦)。
平时提到这个工具的名字的时候,也可以称之为 MiaoLib,以避免产生歧义或者和猫叫声混淆。
MIAO 并不是一个Web框架,其关注点与Web框架有着很大差异,两者之间更多的是互补的关系。MIAO 主要关注的是如下场景下的应用:
示例的代码请点击链接查看。
示例演示了一些可能的使用场景,
如果您有更好的使用示例,欢迎提 PR 或直接联系我,我将会将其加入本章节,谢谢。
以下功能将逐步被加进本工具中。如果您对本项目有兴趣,也欢迎您通过fork和PR来为本项目贡献代码。
在设计框架的功能的时候,比起灵活性和可定制性,本框架更注重易用性,并追求零配置和开箱即用的特性,本框架主要应对的是需要生成临时 Demo 和简易的界面的场景,所以本框架中将不会增加修改界面结构或者样式的 API。如果有复杂的界面需求,Web 框架或许是更好的选择。
当然,不排除后续我们增加一些简易的界面主题设置项,用以更换界面的风格或者配色,但是不会提供「修改界面端的网页结构、布局 CSS 样式」这种复杂的定制 API。
不过,界面代码也是开源的,也欢迎您直接 fork 界面的代码(这里贴代码仓库地址)来直接进行修改,后续我们会加入更改界面网页(前端)的API。
如果您对本项目有兴趣,也欢迎您通过 fork 和 PR 来为本项目贡献代码喵。
如果代码运行中遇到了什么问题,或者您发现了 Bug,也欢迎您通过 Issue 或者直接联系我来进行反馈,我会尽快给予答复喵。
联系方式:
thevoid2333@gmail.com
或者直接提 Issue 喵~
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。
1. 开源生态
2. 协作、人、软件
3. 评估模型