vaadin_Vaadin和DukeScript中的Hello World

vaadin

从表面上看 , Vaadin和GWT通常与DukeScript有很多共同点。 两者都致力于为Java开发人员提供面向浏览器的解决方案,并且由于其对Maven的原生支持,因此与IDE集成良好。 但是,这些方面实际上是它们共有的全部。 从编程模型到框架如何处理代码,再到应用程序如何部署,Vaadin和DukeScript完全不同。

为了使这些观点真正成为现实,让我们开始研究Vaadin和DukeScript的编程模型。 尽管您使用Java编程的方式明显不同,但是每个人都有一个非常好的动机,这对适用的目标开发人员群体来说是非常有意义的。 从这个意义上讲,在这个故事中没有“更好”或“更糟”,只有两种不同的方法使Java开发人员能够访问各种设备上基于浏览器的平台。

在Vaadin中,对于开发人员群体而言,主要的人群是Java Swing开发人员,他们希望将其Java桌面业务应用程序移至Web和移动设备。 因此,Vaadin提供了与Swing相当的组件模型。 提供了一系列的GUI组件,例如“标签”和“按钮”,以及大量更复杂的组件,包括各种图形和其他令人印象深刻的与UI相关的功能,以及“布局”和“事件”,这再次让人想起Swing。

这就是Vaadin中典型的“ Hello World”场景。 注意GUI组件,“ VerticalLayout”和“ ClickEvent”:

瓦丁的Hello World

import com.vaadin.annotations.Theme;
import com.vaadin.annotations.VaadinServletConfiguration;
import com.vaadin.annotations.Widgetset;
import com.vaadin.server.VaadinRequest;
import com.vaadin.server.VaadinServlet;
import com.vaadin.ui.Button;
import com.vaadin.ui.Button.ClickEvent;
import com.vaadin.ui.Label;
import com.vaadin.ui.UI;
import com.vaadin.ui.VerticalLayout;@Theme("mytheme")
@Widgetset("org.hw.vaadin.MyAppWidgetset")
public class MyUI extends UI {@Overrideprotected void init(VaadinRequest vaadinRequest) {final VerticalLayout layout = new VerticalLayout();layout.setMargin(true);setContent(layout);Button button = new Button("Click Me");button.addClickListener(new Button.ClickListener() {@Overridepublic void buttonClick(ClickEvent event) {layout.addComponent(new Label("Thank you for clicking"));}});layout.addComponent(button);}@WebServlet(urlPatterns = "/*", name = "MyUIServlet", asyncSupported = true)@VaadinServletConfiguration(ui = MyUI.class, productionMode = false)public static class MyUIServlet extends VaadinServlet {}
}

在上面,还请注意用于与浏览器相关的功能(即主题和窗口小部件集)的注释,以及与Servlet容器集成的Java EE相关的注释,指出Vaadin是与客户端/服务器相关的框架。

与Vaadin专注于类似Swing的开发模型相反,DukeScript具有KnockoutJS开发模型 ,DukeScript团队认为该模型是更高级的现代方法。 KnockoutJS开发模型将视图与逻辑完全分开。 如此处所讨论的 ,甚至可以在创建视图之前开发和测试逻辑。 尽管Vaadin应用程序也可以进行单元测试,但使用Vaadin可以测试视图(例如,“ clickButton”),而使用DukeScript可以测试逻辑(例如,“ addUser”)。 使用DukeScript,开发人员不再负责应用程序的布局和可用性方面,而专家可以代替。

就像Swing知识对使用Vaadin有所帮助(虽然不是必需的)一样,KnockoutJS知识对DukeScript的使用尽管不是必需的也是有用的。 但是,由于Java开发人员可能比KnockoutJS更熟悉Swing,因此Java开发人员可能需要花更多的时间来熟悉KnockoutJS,然后再开始DukeScript。

另一方面,DukeScript编程模型使应用程序前端的开发可以委托给前端特定的编码器,即委托给使用KnockoutJS进行前端开发的开发人员。 为了证明这一点,请阅读 DukeScript团队的Anton Epple 撰写的有关JavaCodeGeeks的最新文章 。 另一方面,在这种完全分离的场景中,可以将绑定本身视为Java编程任务的一部分,即Java开发人员会将这些绑定添加到从已经将视图提交给前端开发人员的标记中一起。

现在,让我们转到DukeScript中的典型“ Hello World”场景。 如上所述,视图和业务逻辑被拆分为单独的文件,一个使用HTML,另一个使用Java。 这是HTML端,与KnockoutJS.com的“ Hello World”场景相同:

DukeScript中的“ Hello World”视图

<p>First name: <input data-bind="value: firstName" /></p>
<p>Last name: <input data-bind="value: lastName" /></p>
<h2>Hello, <span data-bind="text: fullName"> </span>!</h2>

这是提供上述属性的双向数据绑定的业务逻辑,通常使用KnockoutJS开发模型中JavaScript,但由于DukeScript,它是用Java表示的:

DukeScript中“ Hello World”的业务逻辑

import net.java.html.json.ComputedProperty;
import net.java.html.json.Model;
import net.java.html.json.Property;@Model(className = "Data", targetId = "", properties = {@Property(name = "firstName", type = String.class),@Property(name = "lastName", type = String.class)
})
final class DataModel {@ComputedPropertystatic String fullName(String firstName, String lastName) {return firstName + " " + lastName;}private static Data ui;static void onPageLoad() throws Exception {ui = new Data();ui.setFirstName("Planet");ui.setLastName("Earth");ui.applyBindings();}
}

与Vaadin一样,DukeScript“ Hello World”场景也使用了注释。 每当在开发过程中保存Java源文件时,这些批注就会使用上面引用的所有getter和setter生成POJO。

这两个“ Hello World”场景都针对浏览器。 他们如何做到这一点,即如何处理上面的代码并使之可在浏览器中使用,是本系列下一篇文章的主题。 但是,目前,通过阅读本文,您应该对这两个框架的编程模型之间的差异有一个很好的了解。

通过使用Vaadin,您可以访问一系列用Java表示的GUI组件,这些GUI组件排列在与Swing相类似的组件树中。 借助DukeScript,您可以完全访问JavaScript生态系统为业务逻辑提供的前端和整个Java生态系统所提供的所有功能,并且特别关注KnockoutJS的双向数据绑定功能,以将视图连接至业务逻辑。

感谢Vaadin的Matti Tahvonen和DukeScript的Anton Epple对本文进行了评论并做出了贡献。

翻译自: https://www.javacodegeeks.com/2015/08/hello-world-in-vaadin-dukescript.html

vaadin

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/337460.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【C语言】指针进阶第三站,数组指针!

点击蓝字关注我们数组指针整型指针&#xff1a;指向整型的指针字符指针&#xff1a;指向字符的指针数组指针&#xff1a;指向数组的指针基本概念下面哪个是数组指针呢&#xff1f;指针数组和数组指针的概念很容易混淆&#xff0c;一定要分清楚哦&#xff01;int *p1[10]; int (…

Python3判断是否为回文数

Python3判断是否为回文数原题 https://leetcode-cn.com/problems/palindrome-number/ 题目&#xff1a; 不允许用str的方法&#xff01; 判断一个整数是否是回文数。回文数是指正序&#xff08;从左向右&#xff09;和倒序&#xff08;从右向左&#xff09;读都是一样的整数。…

lambda 序列化_如何以及为什么要序列化Lambda

lambda 序列化总览 lambda序列化在许多用例中很有用&#xff0c;例如持久配置或作为远程资源的访客模式 。 远程访客 例如&#xff0c;因此我想访问远程Map上的资源&#xff0c;可以使用get / put&#xff0c;但是说我只想从Map的值中返回一个字段&#xff0c;我可以将lambda作…

python进行数据查询_如何进行python数据库查询?(实例解析)

在这篇文章之中我们来了解一下关于python数据库的相关知识&#xff0c;有些朋友可能是刚刚接触到python这一编程语言&#xff0c;对这一方面不是特别的了解&#xff0c;在接下来这篇文章将会来带大家来了解关于python查询数据库中数据的相关知识。 数据库的查询操作 Python查询…

【C语言】指针进阶第四站:数组/指针的传参问题!

点击蓝字关注我们朋友们&#xff0c;到站啦&#xff01;指针进阶第四站&#xff1a;传参问题0.引例自定义函数里形参的类型&#xff0c;要和函数调用中传过去的实参类型相对应test函数里的是int类型&#xff0c;我们传过去的参数a也是int类型void test(int n) {} int main() {i…

python做自动化控制postman_python自动化测试入门篇-postman

接口测试基础-postman 常用的接口有两种&#xff1a;webservice接口和http api接口。 Webservice接口是走soap协议通过http传输&#xff0c;请求报文和返回报文都是xml格式。 http api接口是走http协议&#xff0c;通过路径来区分调用的方法&#xff0c;请求报文都是key-value形…

Python3实现红黑树[上篇]

Python3实现红黑树[上篇]由于时间有限&#xff0c;这次只写了红黑树添加节点&#xff0c;关于节点的删除放在下一讲 https://blog.csdn.net/qq_18138105/article/details/105324025。 关于红黑树的介绍&#xff0c;来由&#xff0c;性质和定义&#xff0c;可以看这篇文章&…

web应用程序并发测试_测试并发应用

web应用程序并发测试本文是我们名为Java Concurrency Essentials的学院课程的一部分。 在本课程中&#xff0c;您将深入探讨并发的魔力。 将向您介绍并发和并发代码的基础知识&#xff0c;并学习诸如原子性&#xff0c;同步和线程安全性的概念。 在这里查看 &#xff01; 目录…

深入理解存储器层次结构

点击蓝字关注我们1概述对于一个简单的计算机系统模型&#xff0c;我们可以将存储器系统看做是一个线性的字节数组&#xff0c;而 CPU 能够在一个常数时间内访问每个存储器的位置。实际上&#xff0c;存储器系统&#xff08;memory system&#xff09;是一个具有不同容量、成本和…

python中可选参数是什么意思_Python如何定义有可选参数的元类

问题 你想定义一个元类&#xff0c;允许类定义时提供可选参数&#xff0c;这样可以控制或配置类型的创建过程。 解决方案 在定义类的时候&#xff0c;Python允许我们使用 metaclass关键字参数来指定特定的元类。 例如使用抽象基类&#xff1a; from abc import ABCMeta, abstra…

C++的一个指针占内存几个字节?

C的一个指针占内存几个字节&#xff1f;结论&#xff1a; 取决于是64位编译模式还是32位编译模式&#xff08;注意&#xff0c;和机器位数没有直接关系&#xff09; 在64位编译模式下&#xff0c;指针的占用内存大小是8字节在32位编译模式下&#xff0c;指针占用内存大小是4字…

jmc线程转储_使线程转储智能化

jmc线程转储很久以前&#xff0c;我了解了一个称为Log MDC的东西&#xff0c;我对此非常感兴趣。 我突然意识到日志文件中发生的一切&#xff0c;并指出了特定的日志条目&#xff0c;并找到了对错&#xff0c;特别是在调试生产中的错误时。 2013年&#xff0c;我受委托从事一个…

【C语言】指针进阶第五站:函数指针!

点击蓝字关注我们函数指针函数也有自己的地址&#xff0c;函数名/&函数名 就是函数的地址1.1基本形式在 数组指针的学习中我们了解到int arr[5]; int (*pa)[5] &arr;//pa是数组指针指针变量pa的类型是int(*)[5]那么函数指针的形式是怎样的呢&#xff1f;void test(cha…

jsp 体检信息查询 绕过用户名验证_一篇彻底搞懂jsp

jsp 实栗 jsp jdbc 实现登录实现思路一个表单页&#xff0c;输入用户登录和密码&#xff0c;然后信息提交到jsp页面进行验证&#xff0c;如果可以服务器跳转到登录成功页&#xff0c;失败&#xff0c;跳转到错误页跳转的时候窗口的URL地址会发生变化代码如下编写登录代码登录&…

Python3求解找到小镇的法官问题

Python3求解找到小镇的法官问题原题 https://leetcode-cn.com/problems/find-the-town-judge/题目&#xff1a; 在一个小镇里&#xff0c;按从 1 到 N 标记了 N 个人。传言称&#xff0c;这些人中有一个是小镇上的秘密法官。 如果小镇的法官真的存在&#xff0c;那么&#xff…

couchbase_具有Rx-Java的Couchbase Java SDK

couchbase关于Couchbase Java SDK的一件整洁的事情是&#xff0c;它建立在出色的Rx-Java库的基础上&#xff0c;这为与Couchbase服务器实例进行交互提供了一种React性的方式&#xff0c;一旦掌握了它&#xff0c;它就非常直观。 考虑一个我打算存储在Couchbase中的非常简单的j…

C/C++与汇编混合编程有什么好处?

点击蓝字关注我们1 导语 当需要C/C与汇编混合编程时&#xff0c;可以有以下两种处理策略&#xff1a;若汇编代码较短&#xff0c;则可在C/C源文件中直接内嵌汇编语言实现混合编程。若汇编代码较长&#xff0c;可以单独写成汇编文件&#xff0c;最后以汇编文件的形式加入项目中&…

centos 7.6安装java_Hadoop的安装

为了方便后面使用Hadoop的shell命令&#xff0c;我先介绍Hadoop的安装。Hadoop有多种安装模式&#xff0c;这里介绍伪分布式的安装。我测试过Ubutun、Centos和WSL&#xff0c;都可以正常安装Hadoop的所有版本。所有一般不会出现版本对应的问题。Hadoop是基于Java语言进行编写的…

Python3 解题:字符串压缩

Python3 解题&#xff1a;字符串压缩原题 https://leetcode-cn.com/problems/compress-string-lcci/题目&#xff1a; 字符串压缩。利用字符重复出现的次数&#xff0c;编写一种方法&#xff0c;实现基本的字符串压缩功能。比如&#xff0c;字符串aabcccccaaa会变为a2b1c5a3。若…

C++软件分析师异常分析工作经验汇总

点击蓝字关注我们最近几年工作当中很大一部分内容是排查软件运行过程中遇到的各种异常&#xff0c;积累了一定的经验&#xff0c;在此给大家分享一下。本文将详细讲述Windows系统中软件异常的分类以及常用的排查方法&#xff0c;给大家提供一个借鉴与参考。1、软件异常的分类常…