Seeking Advice for Integrating Third-Party Components(Vue/React) in Vaadin Flow Application

I’m currently exploring the possibility of integrating third-party components, such as the Kendo Gantt wrapper component available at, into a Vaadin Flow application using version 23. Since I’d like to avoid using jQuery, I’ve opted to consider using Vue since Kendo provides support for Vue, React, and jQuery.
I would have preferred react but react does not have as good a support for webcomponents

My idea is to expose the Vue components as web components and create a Java API around them. The Vue component would be a leaf node component, meaning that it would not load any Vaadin components. Rest of the application would continue to rely on vaadin components.

Would this be viable viable option? if yes, I’m also interested in identifying any potential pitfalls that may arise from using this approach, as well as any alternative solutions that may be better suited for this task. Any pointers to sample code would be welcome.

If you are building a Java API for some JS component, it don’t have to be Web Component. It just happens to be what Vaadin core components use. For example my TinyMCE integration is not based on any web component. GitHub - parttio/tinymce-for-flow: TinyMCE wrapper for Vaadin 10+

Thank you @quintessential-ibex for sharing the GitHub code. I spent some time reading it, and I found it to be helpful. I will bookmark it for future reference. It’s an interesting approach.

However, the component I intend to integrate only supports jQuery, React, or Vue, and I would prefer to avoid using jQuery if possible.

I have made some progress in integrating a mini Vue app that contains third party components inside Vaadin. it so far works but is still in the early stages though let me see how far it goes before I run into problems.

:+1: Let us know how it goes. I have been thinking about writing some how-to blog posts about add-on development.

@valiant-zorse This will be interesting. I hope it will go well and looking forward seeing how it looks as I also need such integration in my web app.

if I make decent progress, I will share the github link here, but I am primarily a backeend developer hence the reason for picking vaadin, but off late I have been forced to learn JS ecosystem

@valiant-zorse Same here, only pure java, no js!! Not even how you are learning JS. So, If you complete that, it will help the community, including me potentially.