Table of contents

Introduction

Configuring Node.js

2.1.

Proxy Settings for Downloading the Front-End Toolchain

2.2.

Building an Application Using Travis CI

Frequently Asked Questions

3.1.

Define the CRUD component.

3.2.

How does Vaadin facilitate Routing and Navigation?

3.3.

What are the best security practices offered by Vaadin?

3.4.

Why do we use the Custom Field component of Vaadin?

Conclusion

Last Updated: Mar 27, 2024

Medium

Configuring Node.js

Author Rupal Saluja

Do you think IIT Guwahati certified course can help you in your career?

Yes

Introduction

Do you know that Vaadin was previously named IT Mill Toolkit? In May 2009, the name was changed to Vaadin Framework, and from that time onwards, that name never changed, and it is still known as Vaadin. On 2010, a directory was opened in the name of Vaadin, and a channel was added. This channel was added so that the distribution of add-on components to the core Vaadin Framework could be made possible, whether free or at cost.

This platform comes with certain properties, known as Vaadin Configuration Properties, that can be used to change the behavior of Vaadin applications. In this blog, we will see how to configure Node.js to change the behavior of Vaadin applications.

Configuring Node.js

We know that Vaadin facilitates the webpack development in the Java programming language. To run the webpack development server in development mode, Vaadin uses the Node.js runtime. This Node.js runtime also looks after the Node.js package manager (npm) and package runner (npx) that fetches, installs, and runs front-end packages.

There are three different ways to install Node.js in Vaadin and configure it. All of these ways are mentioned below.

💧 Install Node.js directly into the user’s home directory (~/.vaadin/node). This is an automated process.

💧 You can download Node.js using the link below.

https://nodejs.org/en/download/

Global Installation can be done using a downloaded installer or any package manager, such as Homebrew. Installing Node.js directly would also install the command line tools such as npm and npx for the user.

💧 Using the frontend-maven-plugin, you can make the local project installation (project_dir/node).

Note that if the installed Node.js can be found globally, Vaadin validates it and marks it as a supported version. If the installed version is not found globally, that is, if it is too old, Vaadin installs a compatible version into ‘~/.vaadin’ folder automatically. It is always recommended to use the latest version.

In case a compatible version is not installed by Vaadin automatically, you have the option to force Node.js installation to the ‘~/.vaadin’ folder using the require.home.node property. The working of this property is such that it sets the Maven requireHomeNodeExec parameter value. This helps you configure the Maven goal using <requireHomeNodeExec>true</requireHomeNodeExec>.

Proxy Settings for Downloading the Front-End Toolchain

In case a Proxy server is being used, then steps must be taken to configure the proxy settings. This is because these proxy settings will help the Vaadin application download the front-end toolchain.

There are four locations from which the Vaadin application reads these proxy settings. So, you can set the needed proxy data in any of the following options from the list.

🌈 System properties

🌈 {project directory}/.npmrc file

🌈 {user home directory}/.npmrc file

🌈 environment variables

The options mentioned above are in the descending order of their importance, that is, if the proxy data is being added in the System properties, then all other three properties are ignored.

There are some important keys that you should keep in mind while defining your proxy settings. These keys are mentioned in the table below along with their description.

In System Properties and Environment Variables	In .npmrc files	Description
HTTP_PROXY	proxy	This proxy will be used for outgoing HTTP proxy requests.
HTTPS_PROXY	https-proxy	This proxy will be used for outgoing HTTPS proxy requests.
NOPROXY	noproxy	It is a string of domain extensions separated by a comma that should not be used in a proxy.

The .npmrc file structure uses ini extension. Like any other Java properties file, it will include pair of key values that would be separated by ‘=’. An example of the content of one such file with appropriate proxy settings is shown below.

proxy=http://myusername:s3cr3tpassw0rd@proxyserver1:8085"
https-proxy=http://myusername:s3cr3tpassw0rd@proxyserver1:8086"
noproxy=192.168.1.1,vaadin.com,mycompany.com

Building an Application Using Travis CI

Before proceeding with building an application, we will gain a little information about Travis CI first.

In the name Travis CI, CI stands for Continuous Integration. So, basically, Travis CI is a Continuous Integration service, that is prominently used in Github and Bitbucket. It provides free plans for open source projects which help those projects in their building and testing phases.

When using Travis CI as an Integration Server, you will be provided with two different options for the installation of a proper Node.js version. These options are mentioned below.

⛱️ In Travis configuration, .travis.yml, specify the version of Travis you want to install.

⛱️ Through Vaadin, you can install Node.js automatically.

Frequently Asked Questions

Define the CRUD component.

CRUD is a very useful component of the Vaadin application. It is because the CRUD component is used for managing a dataset. When we say manage, it means this component facilitates easy displaying, efficient editing, error-free creating, and smooth deleting of items in any dataset.

How does Vaadin facilitate Routing and Navigation?

Routing in Vaadin basically refers to its ability to map views into specific URLs in order to maintain meaningful deep linking. By deep linking, we mean that users will be able to share direct links to any view and state they want.

Now, when we have a basic understanding of routing, Navigation is the process of moving through those views which are included in routing for any specific purpose.

What are the best security practices offered by Vaadin?

The best security practices offered by Vaadin are mentioned below in the list.

Releasing Security patches
Redressal Mechanism
Internal Security Practices
Third-Party Libraries

Why do we use the Custom Field component of Vaadin?

By the name itself, we can assume that Custom Field is like a field which you can customize. You can wrap multiple components together, in a single field and use it as per your requirements.

Conclusion

In a nutshell, we understood how to secure plain java applications, learned about security realm configuration for plain java applications, access annotations, and saw how to handle user log-ins and log-outs, how to add log-in views, and how to implement log-out button. We also how to add VaadinServiceInitListener and how to enable its loading.

We hope the above discussion helped you understand Securing Plain Java Applications in clearer terms and can be used for future reference whenever needed. If you want to know the 15 best Java Frameworks, you can read our blog on the 15 best Java Frameworks. To learn more about Vaadin and its components, you can refer to blogs on Vaadin-Avatar, Vaadin-Core Elements, Vaadin-Dialog, and Security practices at Vaadin.

Visit our website to read more such blogs. Make sure that you enroll in the courses provided by us, take mock tests and solve problems available and interview puzzles. Also, you can pay attention to interview stuff- interview experiences and an interview bundle for placement preparations. Do upvote our blog to help fellow ninjas grow.

Happy Coding!