Udemy – Building a Rich Internet Application with Vaadin

Vaadin is a Java framework designed to build modern web applications that look great, perform well, and make you and your users happy. The programming model in Vaadin is similar to those you might have worked with before, with a focus on your productivity. Thanks to Vaadin, the process of creating a fully-featured application from scratch is simple.

his tutorial develops a powerful application from scratch by adding features in small increments, with a rapid feedback cycle, until a complete piece of working software is written. You will get started with a simple “hello world” application generated by a Vaadin plugin to Eclipse. When you know your requirements, you will go on to organise the contents of your software with views and connect navigation to them. The next step is connecting data from a SQL database, followed by improving the look-and-feel of the application. You then learn how to store user information in session data and improve responsiveness by using background threads. Lastly, you will take a look at extending the framework with your own components and add-ons from the commercial Vaadin offering.

All in all, the journey from "hello world" to working software should give you a glimpse of how easy it is to develop an outstanding web application with Vaadin.

What are the requirements?

• The video follows the process of developing an application by explaining what needs to be done and why, and doing it to see the results.

What am I going to get from this course?

• Over 38 lectures and 2.5 hours of content!
• Get to grips with using navigation to organize an application into manageable units: views
• Understand how to decouple UI from the business logic of an application using services
• Study the extension of existing Vaadin components and how to write new ones
• Grasp how to connect a SQL database to a Vaadin application
• Discover how to validate user input with Validators
• Determine how to store session data between browser requests
• Build responsive web applications using background threads

What is the target audience?

• This course is aimed at Java developers who wish to start developing web applications with Vaadin, even if they have no previous knowledge of the Vaadin framework.

Curriculum
Section 1: Getting Started
Lecture 1 The Eclipse Setup 04:12
To start developing any application with Vaadin, an Integrated Development Environment must be ready. We will install and configure Eclipse to work with Vaadin and then will refer to some sources where one can seek help.

Lecture 2 Running and Debugging 04:09
Once the environment is ready, let's take a look at how to run it and trace its execution in Eclipse.

Lecture 3 Overview of Components 02:54
Before you can make any development made with any framework, it is useful to find out about the elements the framework has to offer. This video presents some of the most commonly used components and shows a Sampler (an online demo) that can be used to try out components in practice, without writing a single line of code.

Lecture 4 Events and Listeners 04:26
Writing an application with Vaadin is typically reduced to handling events and programming the component interaction in response to these events. Here we investigate how to find out what events are available, how to listen to them, and what can be done as a response.

Lecture 5 Application Requirements 02:02
Before we develop an application, we should have the requirements written. Here we present the basic requirements for our application.

Section 2: Layouts, Views, and Navigation
Lecture 6 Views Preview 04:57
Any application should allow its users to perform certain operations intuitively. For this reason, Vaadin supports the concept of Views—structures that group certain components on a single screen. Here we learn how to organise and implement views.

Lecture 7 Navigator 03:56
Views by themselves do nothing, and the application needs to somehow be aware of their existence. Navigator is an entity that manages the views and displays them according to certain configuration parameters.

Lecture 8 Layouts 02:39
There are many layouts in Vaadin. Each of them arranges components differently and is suitable for a particular use case. It is important to know advantages and disadvantages of each layout and how to arrange components with them.

Lecture 9 Notifications and Windows 03:56
Layouts and views are clearly not sufficient to cover all possible use cases. Two other ways are also provided: notifications and windows. We will go through the process of how and when to use them.

Lecture 10 Style Names of Components 02:55
Not all layouts can be used and the changes should be done in the application. The best practice is to use as fewer layouts in the application as possible and execute the rest in CSS. The problem lies in referring to a component from a CSS file.

Section 3: The Vaadin Data Model
Lecture 11 The Vaadin Data Model Preview 02:54
Before we enable our application to save and read data from the database, we first need to model it. In order to do this, we need some understanding of how Vaadin understands the data models.

Lecture 12 Setting Up a Database 02:38
Setting up a backend database is essential for every web application. This video will focus on how to do this.

Lecture 13 SQLContainer 04:31
Since we know the details of the Vaadin Data Model and the fact that we are using relational databases. how do we connect one with another? We will learn this here, and we will also talk about limitations of SQLContainer and about hiding the Vaadin data model behind a service interface.

Lecture 14 Validating and Buffering Fields 03:14
The problem of data correctness is crucial to any application. Vaadin supports this through a concept of Validators. We will learn how to create custom validators and add them to UI components. We will also discuss data buffering.

Lecture 15 Binding Fields with Data 03:33
Writing data to the database should be done without any excess code—the framework needs to take care of that. Vaadin offers FieldGroup, a neat way of binding UI components with the corresponding properties of items in the containers.

Section 4: Styles, Themes, and Notifications
Lecture 16 Creating Custom Themes Preview 02:59
An application can rarely have a default look-and-feel framework. More often than not, there is a need to customize each application with a unique appearance and styling the HTML elements. Vaadin supports themes—SCSS files that can instruct the browser on how to render certain components. This video instructs you on how to create a custom theme using the Eclipse plugin.

Lecture 17 CSS Basics and Built-in Styles 03:47
Developing a custom theme from scratch is definitely possible, but it would be tedious. Vaadin comes with two built-in styles that can be used as a basis for personalized themes. We will learn how to use these styles and how to instruct the framework to render components so that the proper style is applied.

Lecture 18 Width, Height, and Layouts 05:08
While everything should be, by principle, styled using CSS files, there are situations when this is not desirable. One of the reasons is that any style information placed directly in the code cannot be overridden by any CSS style. One of the most important styling information we can override is the component's size. We will take a look at how to size components and align them using layouts.

Lecture 19 Performance Issues 03:47
Performance is an important aspect of writing web applications, as web pages are expected to load rather fast. The Vaadin framework comes with a helpful debug window, which allows us to measure the page loading time, among other things. This video takes a deeper look into this handy utility.

Section 5: Logging In, Sessions, e-mails, and Notifications
Lecture 20 Logging In – Querying Containers Preview 05:09
Often, an application does not have to operate on all available data; more likely than not, we are interested in showing or accessing only a limited subset of information. The Vaadin Data Model supports container filters—a straightforward way to filter the available data. We will implement it for logging in—using the container filter, we will check whether the login credentials are correct or not.

Lecture 21 Storing Session Data 03:29
HTTP is a stateless protocol, which means that the data entered by the user is lost between consecutive page reloads. The Vaadin framework, as every other web framework, offers a straightforward and simple way to store session information. We will learn how to use it to preserve the information about the user who is currently logged in.

Lecture 22 Preventing Views from Being Displayed 03:35
More often than not, some views of an application are restricted to a certain group of users, usually those who are logged in with enough privileges. A view-based approach implemented in Vaadin provides ViewChangeEvents and a navigator that can be used to redirect users from one view to another.

Lecture 23 Passing Parameters to Navigator (Part 1) 05:20
A web application should not only allow switching through different views, but it should also allow passing parameters between them; for example, to customize how a view is shown or how it behaves. In our case, we will make searching available and configurable through the URL. We will learn how to parse navigation parameters and construct container filters based on those.

Lecture 24 Passing Parameters to Navigator (Part 2) 04:16
Previously, we learned how to read parameters. Now it is time to do the opposite, that is, call a view with a set of parameters. We will finish our search view by adding components and using their value to construct parameters needed to perform a search.

Section 6: Server-side Operations
Lecture 25 Adding Files to Our Application Preview 07:45
User-entered data is usually something more than text, numbers, and other simple values. More often than not, especially in web application, we need to operate on files. This video will focus on supporting file uploads from the browser to the application.

Lecture 26 Embedding External Content 02:38
Once the file is physically available to our application, we need a way to display it to the user. We will look at how to reference an image uploaded by the user.

Lecture 27 Server-side Data Processing – Running Threads 03:17
Certain operations in an application can take significant time. It would be unwise to freeze our application while this happens. Instead, we are interested in maintaining a responsive UI of our software so that the user can safely use our application while the data is being processed. This video looks at how to run image processing in a background thread.

Lecture 28 Displaying the Progress of an Operation 03:43
When an operation takes time to perform, it is essential to indicate the user that something is happening. This is typically done by showing various indicators and progress bars. In this video, we will look at both techniques and ensure regular communication between the browser and the server to keep them up to date.

Lecture 29 Server Push – Server-initiated Communication 02:01
Regular polling of the server is a resource consuming operation. We ask the server even when there is nothing to update in the browser. Vaadin supports push—a technique in which the server informs the browser whenever the UI needs to be changed. This video looks at how to convert polling into server push.

Section 7: Extending Components
Lecture 30 Extending Components Preview 02:39
More often than not, a need arises to modify or extend a component in the Vaadin framework. Fortunately, extending a component is as simple as extending a class, and Vaadin provides a number of helper classes to ease the development and reduce the redundant code to minimum.

Lecture 31 Custom Widgets – Server-side (Part 1) 05:15
When pure server-side extensions to the code already present in the framework are not enough, Vaadin offers us a possibility of creating custom widgets. A widget is a server-side component and its client-side representation, together with established means of communication. With the help of a Vaadin plugin to Eclipse we will go through the process of creating a custom widget.

Lecture 32 Custom Widgets – Client-side and Server-side Events (Part 2) 04:07
It is important that the widget we create is interactive, which means that it allows the application to respond to the user's actions. We need to capture these actions in the browser and notify the server about them so that they can be broadcasted to the rest of the application.

Lecture 33 The Vaadin Directory 04:19
The Vaadin directory contains more than 400 add-ons and extensions to the Vaadin framework. This video shows how to find, install, and integrate an add-on to our application.

Section 8: Summary and Other Topics
Lecture 34 The Project Summary Preview 04:19
This video lists the features developed during the course as well as points to some existing bugs and areas to improve. In other words, what we have done so far and where can we go from there.

Lecture 35 Sending e-mails 02:03
Our application lacks support for sending e-mails. This functionality is not provided by Vaadin. We will take a look at how to integrate Commons e-mail into our software.

Lecture 36 Vaadin and JPA – JPAContainer 01:57
Enterprise-level applications rarely use SQL or JDBC directly; a preferable option is to use JPA, the Java Persistence API. Vaadin has an add-on, JPAContainer, which links both worlds: the objects of JPA with items and the containers of the Vaadin Data Model. This video briefly introduces the add-on.

Lecture 37 Testing GUI – TestBench 02:29
Testing software is a necessity, no doubt about that. While business logic can be safely tested with unit tests, how do we make sure that the look of our application is preserved in different browsers? The answer to this question is simple—using TestBench, a testing framework for Vaadin.

Lecture 38 Vaadin Goes Mobile – TouchKit 01:59
Vast majority of internet users access the web with a mobile device. Our application is not suitable to be displayed on a small screen or to be operated with fingers. Vaadin TouchKit, fortunately, comes with a number of components optimized for mobile devices.







For More Rare Movies Check out my blog!

No Mirrors Please