For example, you can create a simple UI in Java as follows:
// Create a layout for other components VerticalLayout layout = new VerticalLayout(); // Use TextField for standard text input TextField textField = new TextField("Your name"); // Button click listeners can be defined as lambda expressions Button button = new Button("Say hello", e -> Notification.show("Hello!")); // Add the web components to the HTML element layout.add(textField, button);
With the above code, Vaadin creates the HTML DOM as follows (attributes and shadow DOM omitted):
<div> <vaadin-text-field></vaadin-text-field> <vaadin-button>Say hello</vaadin-button> </div>
You can actually write HTML templates like the snippet above to create UIs instead of using Java, and then add the UI logic with Java.
See Components, for a full set of available Vaadin components.
Using Vaadin, you can quickly create a modern and robust web application. All components are pre-tested and work in all major browsers. This allows you to spend your development time on your application, not testing with a large combination of different devices, browsers, and operating systems. When you do want to create tests, Vaadin has got you covered with a purpose-built tool, Vaadin TestBench.
Vaadin applications are often data-intensive; indeed, data is what we designed the framework around. Whether it is automatic server-client communication, lazy-loading millions of database rows, or building big, complex forms quickly, Vaadin has the necessary tools. By using Vaadin, you never have to think about how to transfer data from the server to the client or vice-versa; the framework takes care of that, leaving you to concentrate on your business logic.
|Watch the Vaadin 14: Intro free training video to learn more about the Vaadin framework, basic Vaadin application architecture and how Vaadin components work.|
A type-safe Java UI Component API on the server side that facilitates the use of the Web Components.
Automated bi-directional communication between the server and the browser, that:
Gives Java developers full access to all modern web enhancements.
Makes it easier to connect the UI to data via a robust Java backend, instead of using traditional REST-based communication.
Lets you choose either basic HTTP(S) or WebSocket communication protocol for building real-time applications.
Two-way data binding: when the UI changes on either the client or the server, the changes automatically reflect on the other side.
Vaadin allows you to access browser APIs, Web Components, and even simple DOM elements, directly from the server-side Java. It is not necessary to understand how the client-to-server communication or Web Components work. This leaves you free to focus on creating components that work at a higher-abstraction level.