123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419 |
- ---
- title: Integration Experiences
- order: 34
- layout: page
- ---
-
- [[integrating-vaadin-applications-with-other-technologies]]
- = Integrating Vaadin Applications with other technologies
-
- [[preface]]
- Preface
- ~~~~~~~
-
- The intention of this article is not to show how to integrate
- http://vaadin.com/[Vaadin] with some other technology, but to tell
- user-stories from both easy and hard customer cases where Vaadin has
- been combined with something else. It should also give you a pointer to
- what is possible and what is not.
-
- Please see the http://vaadin.com/wiki[wiki] for more extensive technical
- articles on various subjects. If you are interested in learning more
- from our developers, please contact us through
- http://vaadin.com/forum[our forums]. The forum messages are usually
- answered very rapidly (read: within a few hours during business hours).
-
- [[user-stories]]
- User stories
- ~~~~~~~~~~~~
-
- [[cloud-computing-and-vaadin]]
- Cloud computing and Vaadin
- ^^^^^^^^^^^^^^^^^^^^^^^^^^
-
- ===============================
- Amazon's EC2 really takes creating and serving Vaadin applications to
- a new level. You can literally have a new server running with server,
- portal and application in couple of minutes and it all just works. Of
- course this not only applies to Vaadin applications, but together they
- are a perfect fit! -*Joonas Lehtinen*
- ===============================
-
- link:https://aws.amazon.com/ec2/[Amazon EC2]
-
- [[cms-ala-liferay-and-vaadin]]
- CMS (ala Liferay) and Vaadin
- ^^^^^^^^^^^^^^^^^^^^^^^^^^^^
-
- ===============================
- We wanted to be able to show some pop-up application windows that were
- part of our Vaadin application and that the customer themselves could
- write the links in their CMS without hassle. What we did was that we
- created an invisible Vaadin application that listened to the URL and
- whenever it changed due to a click on a link, it launched a new pop-up
- window. The solution was also highly scalable as 30.000+ users are using
- it daily already. -*Johannes Tuikkala*
- ===============================
-
- [[custom-ui-components-to-browser-with-java]]
- Custom UI components to browser with Java
- ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
-
- ===============================
- Creating your own widget for Vaadin is very easy thanks to the new
- eclipse plugin. All you need to do is select "Create new Widget" in
- eclipse and all the server and client side code is automatically
- generated for you. Then you'll just create the widget using Java and
- GWT. Using the eclipse plugin it is also much faster to set up a new
- Vaadin project. -*Matti Tahvonen*
- ===============================
-
- [[drools-and-vaadin]]
- Drools and Vaadin
- ^^^^^^^^^^^^^^^^^
-
- ===============================
- We required a flexible way to validate internal dependencies in highly
- dynamic data structures. We solved our need by integrating the Drools
- rule engine in our application, and with it we got a powerful
- content-triggered autocompletion mechanism as a freebie. We wrapped the
- rule engine behind a general API in a EJB, so the rule mechanism can be
- used by all components of the application architecture. -*Henri
- Muurimaa*
- ===============================
-
- http://jboss.org/drools[Drools]
-
- [[extending-existing-components]]
- Extending existing components
- ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
-
- ===============================
- We had a real business need for few important widgets that just were
- not available in Vaadin. So we extended the current table and came up
- with hierarchical table aka treetable. Another simple but important
- widget was multilingual text field. It acts just like normal textfield
- but when opened, you get the java field opened with multiple locale
- instances, it has nice UI too including user friendly flags. Great for
- handling i18n based data in your UI. We got multiple customer cases that
- enjoy these new widgets. -*Jani Laakso*
- ===============================
-
-
- [[flex-and-vaadin]]
- Flex and Vaadin
- ^^^^^^^^^^^^^^^
-
- ===============================
- Flex is really excellent for animations and flashy things and in this
- way is an ideal candidate for creating something really good looking
- together with Vaadin. I created a proof-of-concept flex-Vaadin
- application that communicates through GWT by wrapping the flex component
- and implementing Vaadin's paintable interface. If you know flex from
- before or have teams that know flex and others that know Java then this
- is an ideal combination. -*Kim Leppänen*
- ===============================
-
- http://demo.vaadin.com/coverflow/[Coverflow example with Flex+Vaadin]
-
- [[google-analytics-integration]]
- Google Analytics Integration
- ^^^^^^^^^^^^^^^^^^^^^^^^^^^^
-
- ===============================
- For the Sampler application, we wanted to be able to see which
- 'samples' are interesting to the users. GWT makes it easy to integrate
- with JavaScript APIs, and thus making a Google Analytics component was a
- breeze, even without using existing GWT/Java efforts. -*Marc Englund*
- ===============================
-
- http://demo.vaadin.com/sampler/[Sampler]
-
- [[graphics-with-jfreechart]]
- Graphics with JFreeChart
- ^^^^^^^^^^^^^^^^^^^^^^^^
-
- ===============================
- It turned out surprisingly easy to add various charts to reports
- generated by a web application. All we needed to do is create the
- JFreeChart chart object and an Vaadin component automatically displays
- it as SVG or PNG graphics depending on the browser used. -*Henri Sara*
- ===============================
-
- http://dev.vaadin.com/browser/incubator/JFreeChartComponent[Vaadin:JFreeChart
- Component] +
- http://www.jfree.org/jfreechart/[JFreeChart]
-
- [[gwt-components-to-vaadin]]
- GWT Components to Vaadin
- ^^^^^^^^^^^^^^^^^^^^^^^^
-
- ===============================
- I wanted to create a Vaadin component out of Google's !GoogleMaps GWT
- Widget. In order to do this you needed to create a widgetset that
- includes the component and implement two methods that are required for
- communication between the client and the server. Quite straight forward.
- See the code in the incubator (link below). -*Henri Muurimaa*
- ===============================
-
- https://vaadin.com/directory/component/googlemaps-add-on[GoogleMaps
- add-on]
-
- [[javascript-libraries-and-vaadin]]
- Javascript libraries and Vaadin
- ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
-
- ===============================
- For the Sampler application, I made a code formatting and colorizing
- component, which makes use of the "google-code-prettify" JavaScript
- library. I've found existing JavaScript libraries are easy to use with
- GWT on the client-side. -*Marc Englund*
- ===============================
-
- http://demo.vaadin.com/sampler/[Sampler] +
- http://code.google.com/p/google-code-prettify/[Prettify]
-
- [[jquery-dojo-and-prototype-with-vaadin]]
- JQuery, Dojo and Prototype with Vaadin
- ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
-
- ===============================
- Combining Vaadin applications and client-side javascript libraries is
- a very interesting use-case and a very easy one to implement as well.
- The easiest way to accomplish this is to use a !CustomLayout with the
- Javascript you want. See a short demo I made below. -*Joonas Lehtinen*
- ===============================
-
- http://vaadin.com/forum/-/message_boards/message/18611[Discussions on
- the forum] +
- http://jole.virtuallypreinstalled.com/JQTest/[Live example of
- JQuery and Vaadin collaboration]
-
- [[latex-and-vaadin]]
- LaTeX and Vaadin
- ^^^^^^^^^^^^^^^^
-
- ===============================
- This was no doubt a very exotic combination. Our customer wanted to be
- able to create books that could be sent to printing based on huge
- amounts of data. We wrote an advanced parser (using DOM and SAX parsers)
- that created a file that LaTeX could interpret. LaTeX then created a PDF
- that was saved in a database and a link showed up in the webshop.
- Whenever you clicked on the link, you got finalized PDF that could be
- sent to printing and as a result you got a full several hundred pages
- long book. -*Jani Laakso*
- ===============================
-
- http://www.latex-project.org/[LaTeX]
-
- [[leveraging-existing-java-libraries-in-the-browser]]
- Leveraging existing Java libraries in the browser
- ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
-
- ===============================
- Recently, while making a gesture recognition component, I was able to
- use the Levensthein Distance algorithm implementation from the Jakarta
- Commons project, without any modification.The use of GWT makes it
- possible to leverage existing Java code on the client side - within own
- projects, or by making use of the vast amount of libraries available for
- Java. -*Marc Englund*
- ===============================
-
- [[moss-and-vaadin-through-iframe]]
- MOSS and Vaadin through IFrame
- ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
-
- ===============================
- The goal was to get a Vaadin application running inside the Microsoft
- Office Sharepoint Server (MOSS) as a portlet. What we did was that we
- wrote our Vaadin application and deployed it on a JBoss portal. We then
- took the application's URL and used MOSS' !PageViewer Webpart to have it
- include the application inside an IFrame. It was actually much easier
- that I thought. -*Johannes Tuikkala*
- ===============================
-
- http://blogs.technet.com/josebda/archive/2007/04/05/integrating-sharepoint-with-other-portals-and-web-applications.aspx[Integrating
- Sharepoint with other portals and web applications]
-
- [[moss-and-vaadin-with-sharepoint-sso]]
- MOSS and Vaadin with Sharepoint SSO
- ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
-
- ===============================
- The goal was to integrate a Vaadin application to MOSS as portal.
- Priority was to use SSO by Sharepoint. This was accomplished doing
- custom integration Webpart with C# that transfered authentication
- information to Vaadin before it was opened with-in IFRAME. -*Mauno
- Haukila*
- ===============================
-
- [[n-tier-jee-architecture-with-vaadin]]
- N-tier JEE architecture with Vaadin
- ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
-
- ===============================
- We have found in several larger customer cases that the best possible
- architecture is to separate the UI-layer from the rest. Never mix your
- business logic inside UI logic, there's no need to. This way the UI can
- be replaced in the future and also when updating old systems to use
- Vaadin (e.g. SWING applications that are written this way) it has been a
- breeze when the only thing that needs to be rewritten is the UI. Another
- very important factor is security, trust your data layer, do not trust
- your clients, using enterprise beans with JNDI helps you. Scalability
- and high-availability are also easier to cope with. Scale up with
- multiple cheap Tomcat machines acting as Vaadin clients, few powerful
- data servers as JBoss cluster and a good SQL server. -*Jani
- Laakso*
- ===============================
-
- image:img/n-tier.png[N-tier]
-
- [[offline-standalone-applications]]
- Offline / standalone applications
- ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
-
- ===============================
- I've made offline / standalone Vaadin applications by integrating an
- embedded servlet container (Jetty and Winstone so far) with Xulrunner.
- This is actually a quite straightforward process, requiring only a few
- lines of code for the basic functionality. It's really the distribution
- (making installers and such), and the actual application that's the hard
- part. -*Marc Englund*
- ===============================
-
- [[opensource-stack-for-customer-projects]]
- Opensource stack for customer projects
- ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
-
- ===============================
- One of our customers asked us to help them with selecting an open
- source stack for their open source product portfolio. What we came up
- with was based on our own experiences and is by no means the only
- possibility. What it shows though, is how Vaadin is only part of the UI
- layer and everything beneath it can be almost anything. -*Ville
- Ingman*
- ===============================
-
- image:img/OSStack.png[OS Stack] +
- link:img/OSStack.pdf[OS Stack PDF]
-
- [[pentaho-bi-suite-and-vaadin]]
- Pentaho BI Suite and Vaadin
- ^^^^^^^^^^^^^^^^^^^^^^^^^^^
-
- ===============================
- Yet another way to create PDF files, but this time really tightly
- integrated with Vaadin. We had some data in a Vaadin table that we
- wanted to print as a PDF file. As each component in Vaadin has a
- container, the most natural way was to take the data from the container,
- send it through a wrapper and give it to Pentaho. Pentaho then created
- the PDF files without any problems. So whenever somebody wanted to print
- the data they were viewing in a scrollable table, they just clicked a
- button and everything was taken care of in the background. -*Jani
- Laakso*
- ===============================
-
- http://www.pentaho.com/[Pentaho BI Suite]
-
- [[portlets-with-vaadin]]
- Portlets with Vaadin
- ^^^^^^^^^^^^^^^^^^^^
-
- ===============================
- The only thing you have to do in practice when you want to write a
- portlet is add the portlet.xml file, where you define Vaadin's
- !ApplicationPortlet as the entry point. After this your application will
- work inside the portal. The only situation where you need to edit the
- Java code as well is when you want to use some portal/portlet specific
- features. This gives you the possibility to first develop a standard
- Vaadin application and then later, by just adding the portlet.xml file
- you have it working inside a portal. -*Jonas Granvik*
- ===============================
-
- http://dev.vaadin.com/wiki/Articles/PortalTools[Portal Tools]
-
- [[pdfs-fopitext-and-vaadin]]
- PDFs (FOP+iText) and Vaadin
- ^^^^^^^^^^^^^^^^^^^^^^^^^^^
-
- ===============================
- When creating my printing service I used Apache FOP and iText to
- create PDF files from multiple XML/XSLT/PDF files just as you would
- normally in any Java application. The thing I found the most powerful
- however was the combination with these two products together with
- Vaadin's Embedded component. I just created the object, setSource() to
- my byte array and the PDF showed up in my browser together with all the
- buttons and widgets I also wanted on the screen. The user experience was
- significantly enhanced compared to having to download the PDF and click
- on some button in an external window. -*Fredrik Rönnlund*
- ===============================
-
- http://vaadin.com/book/-/page/components.embedded.html[Vaadin:Embedded] +
- http://xmlgraphics.apache.org/fop/[Apache FOP] +
- http://www.lowagie.com/iText/[iText]
-
- [[saas-with-vaadin]]
- SAAS with Vaadin
- ^^^^^^^^^^^^^^^^
-
- ===============================
- When writing our application as a service we had to do some serious
- planning beforehand as the application was going to be used by so many
- people. What we did was that we had one database for all users and then
- inserted the instance ID in all HQL/SQL clauses to be sure we were
- always accessing the correct instance. The instance was select at login.
- This didn't require any specific things from the UI part, which was
- created using Vaadin. -*Jani Laakso*
- ===============================
-
- [[single-sign-on-sso-to-liferay]]
- Single Sign On (SSO) to Liferay
- ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
-
- ===============================
- Writing a Single Sign On portlet was really easy. A Vaadin application
- by default only requires to be packaged as a portlet in order to work
- inside a portal and then by using the provided API to the portal you can
- easily retrieve all login information. This way the user doesn't need to
- login several times and context handling is also done easily. -*Jani
- Laakso*
- ===============================
-
- [[unit-testing-vaadin-applications]]
- Unit testing Vaadin applications
- ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
-
- ===============================
- Unit testing Vaadin applications is no different from unit testing any
- java application. What we have done however is separate the GUI from the
- !BusinessLogic (even so far that they are running on physically
- different servers). This way our most extensive testing is done on the
- business logic, but also on our Controller in the GUI. Having Unit tests
- in general has helped us build more solid applications, on all
- layers. -*Kim Leppänen*
- ===============================
-
- [[web-2.0-apis-and-vaadin]]
- Web 2.0 APIs and Vaadin
- ^^^^^^^^^^^^^^^^^^^^^^^
-
- ===============================
- Many "Web 2.0" APIs already have GWT bindings, making it trivial to
- use these. Even without existing bindings, it's easy to use JavaScript
- APIs from GWT, or REST/JSON/XML/etc APIs from the server-side.Google
- Maps, Google Analytics, Flickr, Youtube - these are some "Web 2.0" APIs
- that have been used. -*Marc Englund*
- ===============================
-
- [[webservices-and-vaadin]]
- Webservices and Vaadin
- ^^^^^^^^^^^^^^^^^^^^^^
-
- ===============================
- Integrating a webservice with Vaadin was really a no brainer. What we
- had was a UI that had to check something through a service-provider's
- Webservice. So when ever the UI launched the check, we called the
- webservice (with Pojos created by the WSDL file that we got from the
- service provider) and got some other Pojos as a reply. The reply then
- dictated what the UI would look like. -*Johannes Tuikkala*
- ===============================
|