Hilla – A new Frontend Framework for SpringBoot

Hilla is a new framework for creating responsive web applications with a backend in Java. It seamlessly integrates a responsive Lit TypeScript frontend with a Spring Boot backend. Hilla is built and supported by Vaadin.

Hilla is designed to be simple enough for small utilities, but robust enough to build complex enterprise-grade applications.

Automatic generation of Java code to TypeScript

Automatic TypeScript code generation helps ensure that the frontend always stays in sync with the backend, so you can build apps faster and with more confidence, even as your team grows. You can explore server end point methods and their input and return types directly from your IDE as you type.

Endpoint server:

@Endpoint
@AnonymousAllowed
public class PersonEndpoint {
    private PersonRepository repository;
 
    public PersonEndpoint(PersonRepository repository) {
        this.repository = repository;
    }
 
    public @Nonnull List<@Nonnull Person> findAll() {
        return repository.findAll();
    }
}

TypeScript View:

import { PersonEndpoint } from 'Frontend/generated/endpoints';
import Person from 'Frontend/generated/com/example/application/Person';
 
export class PersonView extends View {
  @state() people: Person[] = [];
 
  async firstUpdated() {
    this.people = await PersonEndpoint.findAll();
  }
 
  render() {
    return html`
      <vaadin-grid .items=${this.people}>
        <vaadin-grid-column path="firstName"></vaadin-grid-column>
        <vaadin-grid-column path="lastName"></vaadin-grid-column>
      </vaadin-grid>`;
  }
}

You can learn more about https://hilla.dev/

I hope this article was useful to you. Thanks for reading it.

Find our #autourducode videos on our YouTube channel: https://bit.ly/3IwIK04