Hilla: Merging Reactive JavaScript and Spring Java for Full-Stack Development
Hilla represents a compelling integration in the Java ecosystem, blending a Spring-based Java back end with a modern TypeScript front end using Lit, a reactive JavaScript framework. Originating from Vaadin Fusion, Hilla aims to provide a seamless full-stack development experience, akin to the capabilities offered by Next.js for JavaScript, but tailored for Java developers. This article will guide you through the process of getting started with Hilla, from scaffolding a basic web application to building the front end and integrating new components.
Hilla’s Evolution from Vaadin Fusion
In January, Vaadin’s team announced a rebranding of Vaadin Fusion to Hilla. For those already familiar with Fusion, the transition involves merely a change in name, with no significant alteration to the underlying technology. However, new users should be aware that the documentation and examples you encounter might still reference Vaadin Fusion. Future releases will update the package names and components to align with the Hilla branding.
Building with Hilla: A Unified Full-Stack Approach
Hilla’s design merges the best of both worlds: a reactive JavaScript front end coupled with a robust Spring Java back end. This integration allows developers to leverage the strengths of each technology, providing a cohesive development experience. To follow along with the examples in this article, ensure that you have both Node.js (npm) and a recent JDK installed on your system. You can verify this by running node -v
and java -version
in your terminal to check the versions.
Getting Started with Hilla
To begin working with Hilla, you will first need to scaffold a new web application. Hilla’s setup process is designed to be straightforward, guiding you through the creation of a basic project structure that integrates both the front end and back end. This initial setup provides a solid foundation for building more complex applications.
Developing the Front End
Once your project is scaffolded, you can start developing the front end using Lit, which enables a reactive and fast user interface. The examples provided will demonstrate how to set up components and interact with the back end, making it easier to build dynamic and responsive web applications.
Integrating Components and Building Out the Application
As you develop your application, you will find it easy to add new components and features to your Hilla project. The framework’s unified approach simplifies the integration of various elements, allowing you to focus on building functionality rather than managing disparate technologies. The examples and guidelines in this article will help you understand how to effectively utilize Hilla’s features to enhance your application.
In summary, Hilla offers a robust solution for full-stack Java development by combining the power of Spring with a reactive JavaScript front end. By following the steps outlined in this article, you can quickly get started with Hilla and begin building sophisticated web applications that leverage the strengths of both technologies.