Community Spotlight - June 2015

It is time to wrap up some latest community activities.

Yet another alternative JVM language supported

Kotlin is a programming language developed by JetBrains (the company behind IntelliJ IDEA, TeamCity and lots of other development tools). It is typically compiled to Java bytecode and executed in the JVM, but can also be compiled to JavaScript or for execution in Android. Sergei Egorov created an integration project called Vaadlin to provide a nice Vaadin API for Kotlin users. Check that out, if you are interested in Kotlin or alternative JVM languages in general. There is also a nice example project based on Spring Boot.

OSGi and Vaadin ClassResources

I recently got a question about OSGi and using Vaadin ClassResources from bundles. The gotcha is that the resource files have to be in "exported" packages or the class special loader cannot find the resources. I consulted the OSGi guru Florian Pirchner who got inspired to write instructions and a helper library for the subject.

Vaadin and JSF shield you from low level web technologies

Ed Burns (Oracle, JSF spec lead) is known to like Vaadin as well. That is no surprise as Vaadin and JSF share the same core idea of abstracting away the low level complexities of web development. He discusses this in his notes he wrote about his Geekout trip. Like Ed, I see that the upcoming WebComponent standard will not make tools like JSF and Vaadin by any means irrelevant, but just make using and extending them easier. Something I'd like to note to Ed is that the server side Vaadin, that is used by most users, is actually totally decoupled from GWT. We could switch (back) to a version with a "browser thin client" implemented without GWT, and most users would need to do nothing, except upgrade their version number. The whole GWT distribution is included in Vaadin libraries just to make it more convenient to create and consume client side extensions or to mix the best technologies for each use case.

Data Binding with Vaadin

Krishna Phani Kumar has continued his tutorial-like articles about Vaadin usage. This time he is discussing the basics of data binding and forms with Vaadin's BeanFieldGroup. Good stuff to cover the basics, although I personally always emphasize using the “non-buffered” mode (with detached entities) and using "eager validation" in forms to make the code simpler and the UX better for the end users.

The lesser complexity achieved by using non-buffered input fields allowed me to tackle the second most voted feature for core Vaadin, support for cross field validation. I built the solution as a prototype into the Viritin add-on, but I'm confident that the solution is ready for real use. You can either use programmatic validators or add standard JSR 303 annotations to your entity classes. In case you try it out and find some issues in it, let me know about them via the github project.

WebComponents

Did you know you can nowadays use Vaadin’s Grid with PHP as well? May sound like a bizarre idea for existing Vaadin users, but with our recently launched Components project (see Google IO Polymer talk where Vaadin Components were featured), you can now use Grid in pretty much any kind of web project. Artur Signell set up an example that populates a Grid from a MySQL table using a PHP script.

 

Vaadin Font Icons

 

If you love font icons then I have good news for you. I have been working hard to finish our own Vaadin Font Icon collection. Vaadin Font Icons are completely free and the collection includes 530 unique icons. Check out for more information on the Icons from Vaadin Font Icons site.

Fonts icons are awesome!

Icons in a font format are a practical way to store the icons in your computer without having separate image files in messy folders. You can easily access the font icons through design applications. Fonts are vector graphics so you have maximum scalability to any size and color. The icon font format goes well with front-end development. You can easily change the icon’s size, colour, transform them, and even animate the icons with CSS.

Today the most famous font icon is Font Awesome. Font Awesome has outstanding design quality and it has a large collection of icons. You can see Font Awesome used everywhere in web design but popularity makes it a bit too common and even boring. Vaadin Font Icons aren't intended to compete with Font Awesome but instead give more options for designers and web developers.

Why Vaadin Font Icons?!

There aren’t so many complete, high quality and free icon collections available at the moment. Often in my design work, I end up drawing the icons myself because there aren’t just the right icons available. The same way I got the idea to create our own Vaadin icon collection.

Vaadin Font Icons are designed for web applications and they have a clear, simple, sharp look and feel. Vaadin Font Icons avoid rounded corners and the sharp cornered icons go well with the modern flat design.

Vaadin Font Icons use a 16 x 16 pixel grid as a design base and the crisp render results are acquired by setting your font-size to 16, 32 (= 2 * 16), 48 (= 3 * 16) or bigger.

What next?!

In the future, I’m going to continue designing new icons and squash any possible bugs. I hope that you will find Vaadin Font Icons as a useful addition to your work. I’ll be happy to get some feedback about the icons, for instance in the comments below.

Get Vaadin Font Icons

Vaadin 7.5 released

Hello everyone! We’re happy to announce that we got a new release out. This one is called Vaadin 7.5. This is a good moment to have a look at what was just released.

Declarative support for Vaadin Designer

First of all, have you met Vaadin Designer? It is one of the most exciting tools we have released in a long time and It is already out there for you. Indeed, the most important enhancements in the framework are to enable both declarative and visual editing of Vaadin UIs. You can even mix the two approaches.

Some new features were added to the framework's components along with support for the Designer. They are also available even if you are not using the Designer, but simply want to write your UIs in declarative markup by hand. 


To help you get started and generate a Vaadin Designer compatible HTML from your existing application, you should take a look at it in debug mode (using the ?debug parameter in the URL). Check the new tab in the dialog to generate a declarative design by simply clicking a component in the view with your mouse. It’s easy to copy and paste markup from the server log to your IDE.

Grid enhancements

The new Grid component is quickly becoming the favorite component for Vaadin users, and that means a long list of wishes that we need to handle. While there are things that we will add in the future, Vaadin 7.5 already adds a couple of the most important ones.

Column drag and drop reordering - One of the most asked for features has been letting the users rearrange columns in a different order than they were originally presented. This is now possible in the latest version of the Grid component.

 



Show and hide columns - You can let users show and hide columns from the top-right corner. From this menu, your end-users can choose the columns they want to have displayed. You can also extend the menu to add custom actions to it, if you need to.

 

 





Add details for every grid row - For each grid row, you can add a “details section” that users can open. This is the perfect way to show some more data about a row without adding too many columns into your grid. This could be something like person details, expanded row editor, or like in the demo application, Git commit details.

 

Other handy enhancements

Not just a “one-more-thing”, but there are many other enhancements and fixes that you might be interested in. You’ll find the full list of over 130 fixes and enhancements in the release notes, but I wanted to mention a couple of them here: 

  • GZip encoding for static JavaScript is now enabled by default. This makes Vaadin apps load much faster especially on slow networks and basic hosting setups.

  • Compatibility with JSR 356 for many application servers, including Jetty 9.2, WebLogic 12.1, Glassfish 4, Wildfly, and so on.

Get Vaadin 7.5