Category: Tutorials
LitElement and PWA
In the first four tutorials in this series, we’ve built an app with LitElement, using Redux for state management, Vaadin Router for navigation and Webpack for building and code splitting. In this final tutorial, we turn the application into an offline-capable Progressive Web App. If you didn’t do ...
Navigation and code splitting in a LitElement project
So far in this tutorial series, we have built an app with LitElement and connected it to a Redux store for state management. In this tutorial, we add a new view for stats to learn how to navigate between views and how to split code for performance. If you didn’t do the previous steps of the ...
Using Redux in a LitElement app
In this third tutorial, you’ll learn how to use Redux for state management in a LitElement application. Check out the first two tutorials to learn how to set up a LitElement application and how to use lit-html for templating. If you aren’t interested in Redux, feel free to skip over this tutorial ...
LitElement templating, properties, and events
In this second tutorial in a series about building LitElement apps, we cover templating, events, and properties in a LitElement component. If you didn’t complete the first part, you can check out the source as a starting point: Step 1 source Video tutorial for this part Defining properties Before ...
Creating a LitElement project
In this tutorial, you'll learn how to build an application using Web Components and LitElement. The topics we cover are: Starting a LitElement project lit-html templating and events State management with Redux Navigation and code splitting PWA and offline Figure 1. The app we are building Video ...
Consuming rest services in Vaadin 8
Using REST services has really struck though during the last couple of years. They often act as a "public API" for third-party solutions like mobile apps or as a "persistence layer" for client-side web apps (GWT, Angular etc.). Java is probably the most common platform for providing REST services, ...
jUnit5 basics for testing Vaadin Flow apps
In this tutorial, we will learn a few basics about jUnit5 that are needed for testing web apps. Download base project You can find the latest version of the source code for this tutorial @github jUnit5 - project preparations jUnit5 has been available for a long time now and production ready. ...
How to use jUnit extensions to test Vaadin Flow apps
In this tutorial, you will learn how to implement a jUnit 5 extension that is used for testing a Vaadin application with TestBench. Download base project This tutorial uses the flow-helloworld-maven-meecrowave as a base. You can find the latest version of the source code for this tutorial @github ...
Using a WebAssembly Module with Vaadin Flow
Utilizing WebAssembly modules (WASM) increase the performance and efficiency of a web application. With Vaadin Flow, loading a WASM can be as simple as writing the proper fetch statement in one of your Polymer templates. Flow also allows developers to easily control the use of these modules from ...