Source: Nocodefunctions We bring to your attention an article about the experience of developing an independent web application using Java.
Java for the frontend - is it really possible?
Many people believe that using Java for front-end development is simply impossible: after all, Java is designed for back-end. Yes, long ago, Java applets and Java Webstart allowed you to run Java applications from the browser. But this is ancient history, as old as Flash plugins. But even without applets, there is a way to use Java for the front end - these are JSP (Java Server Pages), which many schoolchildren studied in computer science lessons. However, although JSP is still discussed in some Java books, the technology has been deprecated since the 2010s. Is it really another dead end? There are also frameworks that allow Java developers to “transpile” (transform in complex ways) their code into JavaScript using Google Web Toolkit (GWT, it's not super new either ) or via J2Cl (also from Google). It's important to note that GWT and J2Cl are not suitable for beginners, they are more enterprise tools developed by Google for use in large projects.
The unsung hero of Java for the frontend: Jakarta Faces (JSF)
Java Server Faces (JSF), now known as “Jakarta Faces,” has been around since at least the early 2010s. I am always surprised that it is little known and rarely mentioned because this framework makes it easy to develop web applications quickly, securely and reliably. JSF is easy to learn and takes full advantage of the Java ecosystem. Here's how, for example, you create a web page with dynamic content:
Create an html page (with the .xhtml extension).
Change the <head> and <body> html tags to <h:head> and <h:body> tags.
Now, to display dynamic content by calling some property in the backend, simply place this code after the hashtag and between the control bars:
#{backendscript.myText}
Then create a Backendscript.java file in your backend, add a variable called String myText = "hi! welcome to my page!" . It will be displayed on the web page. JSF is really very simple. It is well documented thanks to many questions on Stackoverflow , official documentation , several books ( this link , and I also like David Heffelfinger's books ) and of course Youtube videos .
Is JSF complicated? What are its advantages?
JSF is not complicated at all. Moreover:
It is well integrated with classic Java IDEs (NetBeans, IntelliJ IDEA and Eclipse). Each IDE provides:
Template projects that fill out the template for Maven configuration (which, by the way, is very simple).
Debugging tools (with hot reloading, at least for NetBeans).
Powerful autocompletion, refactoring, navigation, and error highlighting tools for the Java ecosystem. The IDE can provide useful information about any class you mention in the html page (such as the #{backendscript.myText} mentioned above). The HTML pages will actually integrate with the rest of your codebase!
It handles complex code variations on html pages very easily.
Do you need to refresh part of a page with a simple button click? Add an update property to your button, followed by the ID of the component you want to update.
Regarding updating and dynamic content: I really like the simplicity of JSF: the frontend updates the backend, updates itself, or the backend updates the frontend. All these are the basic requirements of a web application and they are present here.
Need to make a website in multiple languages? Add <f:view> tag to your html and get the user's language with just one line in the backend.
You can add and mix HTML tags, JS and CSS scripts, and it's all SEO optimized.
You have full control over the html generated by JSF and you can always add html and js code. This makes it easier to collaborate with designers and front-end developers who don't know or care about JSF. When I was working with CSS, I had the help of a designer who could work with the HTML pages I created using JSF, making the necessary changes without any difficulty. JSF generates HTML code that you can view and read in your browser. This is very helpful for debugging with regular development tools and verifying that your SEO actions are implemented correctly.
Primefaces: Huge list of free JSF components and themes
JSF comes with a long list of ready-to-use components that create the classic parts of an html page, so you don't have to do it yourself. For example, use the <h:dataTable> tag to create a table that displays specific data loaded from your backend—without having to recreate it from scratch. And there's a better option: Prime Tek has developed an open source set of components called Primefaces . They come with additional features and have several advantages. For example, instead of <h:dataTable>, simply use the Primefaces <p:dataTable> tag. This creates a basic data table to which you can easily add column switches , dynamic columns , or edit functions in the table.
But Java is slow and heavy?
1. Is Java slow?
No. The funny thing is that JS frameworks like React, Angular and Vue were created with the promise of being faster and smarter than JSF in Java, because they immediately sent all the application logic to the site visitor's browser. JSF works differently: when a user calls a page (eg https://nocodefunctions.com), the application in the backend generates the html for that page only and sends it back. This is called “server side rendering” (SSR). In practice, single page applications can require a very long time for the user to retrieve and load the javascript files that make up the entire application. This can lead to poor user experience (having to wait for the first page to load) and SEO issues. As a result, Java-style server-side rendering has regained popularity as it is considered to be superior to client-side rendering in terms of speed and performance. New SSR frameworks are emerging that require developers accustomed to client-side rendering to handle and mix these two different logics.
2. Is Java hard?
No. What you need to deploy a JSF application:
The application itself. A simple JSF “hello world” application is probably 10KB or less.
Optional are Primefaces (discussed above) if you need higher quality components. This is an additional 4.5 MB .
Now run it all on the server. To do this you need:
Have a server in the cloud or somewhere else. For the test version of Nocodefunctions (https://test.nocodefunctions.com) I use Hetzner, where I rent a bare metal server with 2 GB RAM for 4.15 euros per month. I could use less RAM, but my application provides some data-intensive services and it needs to fit in memory. The real (non-test) version of nocodefunctions runs on a larger server (also with Hetzner) to support more users' data-intensive tasks in parallel - for less than €50 per month.
You must have Java installed. This is a single file download under 200 MB for Mac, Win or Linux, completely free even for commercial use.
You need to have a Java web server to run it. A lot of them. Personally, I use Payara Micro (Community Edition), which is free and a single 77MB file download.
Launch your application.
Conclusion: Think Java!
I feel like some programmers think that Python, Ruby, PHP, NodeJS + React... are the only choice when starting a small web application. But now I hope they will also consider Java + JSF for their next project.
GO TO FULL VERSION