This is a project for testing approaches to translating strings in Vaadin Fusion. The approach here uses lit-translate
.
The reasoning behind this choice is that it's easy to customize how the strings are loaded, and it integrates well with Lit.
This project stores translations in a standard resource bundle (src/main/resources/messages_<lang>.properties
). The translations are converted to a JSON object and served to the client
through the TranslationEndpoint
.
On the client, the translate
directive from lit-translate
is used, in order for components to be updated once the language changes.
The language is set in the main-layout.ts
through the app-store.ts
. The choice is currently not persisted across browser reloads.
The project is a standard Maven project. To run it from the command line,
type mvnw
(Windows), or ./mvnw
(Mac & Linux), then open
http://localhost:8080 in your browser.
You can also import the project to your IDE of choice as you would with any Maven project. Read more on how to set up a development environment for Vaadin projects (Windows, Linux, macOS).
Directory | Description |
---|---|
frontend/ | Client-side source directory |
index.html | HTML template |
index.ts | Frontend entrypoint, contains the client-side routing setup using Vaadin Router |
main-layout.ts | Main layout Web Component, contains the navigation menu, uses App Layout |
views/ | UI views Web Components (TypeScript) |
themes/ | Custom CSS styles |
src/main/java/<groupId>/ | Server-side source directory, contains the server-side Java views |
Application.java | Server entry-point |