Vaadin Flow with Admin LTE

Hi, I’m trying to build web application with Vaadin Flow and combine it with UI Template Admin LTE
(https://adminlte.io/themes/AdminLTE/index2.html)
Is it possible to integrate Vaadin Flow with Admin LTE ?
Any tutorials or example to implement this ?

Hi Reja. There are no 1-1 examples about this, but I think you should just use the element API ([docs]
(https://vaadin.com/docs/v14/flow/creating-components/creating-components-overview.html)) to create the components using elements and set the class names. There exists quite an old prototype for Bootstrap, which you can find from here https://github.com/vaadin/flow-demo/tree/proto/demo-bootstrap/src/main/java/com/vaadin/hummingbird/bootstrap/components but it showcases the concept at least.

Or, to easily build similar kind of UI behavior, I think you could just use the existing components AppLayout, Board and Charts.

Hi Pekka,
Thank you for your explanation about the implementation.
But I think to fast started build project with Vaadin Flow, how about free or premium template provides by Vaadin ?

I’m sorry before without comparing to other framework, I think It’s good if Vaadin have template like
https://www.primefaces.org/themes/
so developer of Vaadin framework can growing more fast when build application :slight_smile:

For getting started fast with ready code, you can either use:
https://start.vaadin.com/ - there are not that many view templates yet but it is a start. It is responsive out-of-the-box and you can tweak the css variables there to customize the theme to your liking.

For free & commercial templates, you can use the starters in the Download App Examples section in https://vaadin.com/start/latest.

In case you want to tweak and tune the look and feel of the components, you can try the Theme editor https://demo.vaadin.com/lumo-editor/ and download & import the styles to any project to get them applied.

I’m not sure what parts of the Primefaces templates you see us lacking, can you please elaborate? Is it the layouts or something else ?