Category: Tutorials
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 ...
CSS Encapsulation with Shadow DOM
The Global Problem The global scope of CSS can be problematic for many reasons. Every CSS rule we define has the potential to have wide-ranging and often unintended side effects. In other cases, a rule may have no effect due to conflicts with global styles. As applications increase in scale and ...
