Embedding Vaadin Components in Angular

embedding Vaadin components in Angular

We recently made a study for new people experiencing using Vaadin for the first time. When finding people who are doing Java web development, many are currently working on Angular applications. The study was very successful and many liked the “Vaadin way”, but we were left with an open question about how to use Vaadin if you are already using Angular?

Angular + Spring Boot projects seem to use a similar team split: backend exposes REST, frontend renders everything. However, many times the UI logic leaks to the backend and suddenly the backend team owns complex grid logic. Every sort order, filter combination, and lazy-loading variant becomes a REST contract negotiation. The frontend team re-implements pagination in TypeScript, or the backend team ships an API designed around the table widget.

Subscribe to our newsletter

Be the first to learn about new Vaadin resources and tips

Top 25 Vaadin add-ons of 2020

The Vaadin Directory serves as a marketplace for add-ons and web components for your Vaadin applications. It’s a community-driven effort that includes integrations of other components, modifications to existing Vaadin components, or creations of additional features from scratch that are maintained ...
designer-flex-editor

Layout views with flexbox in Vaadin Designer

Vaadin Designer 4.3.8 makes laying out your Vaadin views a whole lot more visual. Previously, you had to know and enter the CSS for your views. Now, you can edit your flexbox layouts using simple controls in the properties panel. You will also learn flexbox in the process! The main building blocks ...

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 ...

A powerful web component that lets you edit JSON in browser

Web Components Wednesday (WCW) blog series is created for two purposes: introducing easy-to-use components and educating people on the concept of Web Components. All the WCW blogs can be found here. Let’s praise it once more, JSON is the best invention as a replacement for XML. The format is ...

Introducing geo-location, a web component which lets you easily locate, track or reverse geocode your current location

Web Components Wednesday (WCW) blog series is created for two purposes: introducing easy-to-use components and educating people on the concept of Web Components. All the WCW blogs can be found here. Nowadays, many companies make use of location tracking to create different apps, and such purposes ...

This web component, gif-player, lets you control the playback of your gif

Web Components Wednesday (WCW) blog series is created for two purposes: introducing easy-to-use components and educating people on the concept of Web Components. All the WCW blogs can be found here. Is it pronounced “gif” or “jif”? We do not really know. However, we do know one super awesome gif ...

Top 5 web components for password input

Web Components Wednesday (WCW) blog series is created for two purposes: introducing easy-to-use components and educating people on the concept of Web Components. All the WCW blogs can be found here. Do you know that the first Thursday of May of each year is the World Password Day? The original idea ...

5 spinner web components for your site

Web Components Wednesday (WCW) blog series is created for two purposes: introducing easy-to-use components and educating people on the concept of Web Components. All the WCW blogs can be found here. When it comes to loading or downloading, the longer you see a spinner, the more pain you will ...

5 datepicker web components for your site

Web Components Wednesday (WCW) blog series is created for two purposes: introducing easy-to-use components and educating people on the concept of Web Components. All the WCW blogs can be found here. Choosing a date is a very common task in any UI. Making that intuitive and easy for users can be ...