Introduction

webforJ in six screens. The whole framework, start to finish.

webforJ is the full-stack Java framework for business web apps: you build the whole app, screens included, in Java. This tour walks through it in six short screens, from your first Java class to the AI tooling. It takes about five minutes.

01Was ist webforJ?
02Komponenten und Theming
03craftforJ
04Daten, Formulare und Sicherheit
05Ihr vorhandener Code
06KI-Tools und nächste Schritte

01Was webforJ ist

Ein Bildschirm ist eine Java-Klasse.

webforJ ist das Full-Stack-Java-Framework für geschäftliche Webanwendungen: Sie entwickeln die gesamte Anwendung einschließlich der Benutzeroberflächen in Java.

Eine Route macht daraus eine Seite. Fügen Sie @Route zu einer Klasse hinzu, damit sie unter dieser Adresse im Browser erreichbar ist.
Komponenten sind Felder. Erstellen Sie sie mit new und reagieren Sie mit einem Lambda auf Klicks.
Java oder Kotlin. Die Kotlin-DSL erstellt denselben Bildschirm mit denselben Komponenten.

Mehr lesen: Kotlin-DSL

HelloView.java

@Route("/hello")
public class HelloView extends Composite<FlexLayout> {
  private final FlexLayout self = getBoundComponent();
  private TextField name = new TextField("What is your name?");
  private Button greet = new Button("Say hello");

  public HelloView() {
    greet.setTheme(ButtonTheme.PRIMARY)
        .addClickListener(e ->
            Toast.show("Welcome, " + name.getValue() + "!",
                Theme.SUCCESS));
    self.add(name, greet);
  }
}

@Route("hello")
class HelloView : Composite<FlexLayout>() {
  private val self = boundComponent

  init {
    self.apply {
      val name = textField("What is your name?")
      button("Say hello") {
        theme = ButtonTheme.PRIMARY
        onClick {
          Toast.show("Welcome, ${name.text}!", Theme.SUCCESS)
        }
      }
    }
  }
}

localhost:8080/helloNach einem Klick

Die laufende Ansicht zeigt ein Textfeld mit der Beschriftung „Wie heißt du?“, eine Schaltfläche „Hallo sagen“ und nach einem Klick eine Erfolgsmeldung mit dem Text „Willkommen, Lauren!“.

02Komponenten und Theming

Komponenten erstellt für Business-Apps.

Felder, Listen, Dialoge, Uploads, Diagramme, Bäume und Layouts sind in webforJ enthalten. Jedes davon ist eine Java-Klasse, die Sie in Ihrer Ansicht erstellen.

Das Theming beginnt mit einem Seed. Legen Sie den primären Seed fest, und alle 19 Farbabstufungen der Palette werden in jeder Komponente übernommen.

app.css

:root {
  --dwc-color-primary-seed: #6366f1;
}

Mehr lesen: Komponenten

Die webforJ-Komponente ComboBox — ComboBox

Die webforJ-Komponente GoogleCharts — GoogleCharts

Die webforJ-Komponente Terminal — Terminal

03craftforJ

Sieh dir die App an, die dein Java erstellt hat. Im laufenden Betrieb ändern.

craftforJ ist der visuelle Editor, der im Entwicklungsmodus in Ihrer App ausgeführt wird. Er zeigt den von Ihrem Java-Code erstellten Komponentenbaum, ermöglicht das Ändern von Eigenschaften in Echtzeit und schreibt übernommene Änderungen zurück in Ihren Java-Quellcode.

Komponenten untersuchen. Durchsuchen Sie den Komponentenbaum, wählen Sie eine Komponente durch Anklicken auf der Seite aus und ändern Sie ihre Eigenschaften, während die App läuft.
Änderungen in den Quellcode schreiben. Sieh dir deine Live-Änderungen als Diff an und übernimm sie in der ursprünglichen Java-Datei.
Der KI-Assistent. Ein Coding-Agent in der laufenden App schreibt Java-Code, kompiliert ihn und wendet ihn nach deiner Zustimmung an.

Mehr lesen: craftforJ

craftforJ

04Daten, Formulare und Sicherheit

Formulare, Regeln und Zugriff, neben deinem Backend.

Bindung BindingContext verknüpft die Formularfelder mit einer Bean und prüft beim Zurückschreiben des Formulars die Jakarta-Validierungsregeln.
Spring Boot. Views erhalten Services, Repositories und andere Spring-Beans per Konstruktorinjektion.
Sicherheit. Annotationen wie @RolesAllowed schützen eine Route, und die Regeln werden angewendet, bevor eine Komponente gerendert wird.

Mehr lesen: Präsentation

CustomerFormView.java

public class CustomerFormView extends Composite<FlexLayout> {
  private TextField name = new TextField("Name");
  private TextField email = new TextField("Email");
  private Customer customer = new Customer();

  private BindingContext<Customer> context =
      BindingContext.of(this, Customer.class, true);

  public CustomerFormView() {
    Button save = new Button("Save", ButtonTheme.PRIMARY, e -> {
      ValidationResult result = context.write(customer);
      if (result.isValid()) {
        Toast.show("Saved " + customer.getEmail(), Theme.SUCCESS);
      }
    });

    getBoundComponent().add(name, email, save);
  }
}

public class Customer {

  @NotEmpty(message = "Name cannot be empty")
  private String name;

  @NotEmpty(message = "Email is required")
  @Email(message = "Not a valid email address")
  private String email;

  // getters and setters
}

@Route("/dashboard")
public class DashboardView extends Composite<FlexLayout> {

  public DashboardView(RandomNumberService service) {
    Button roll = new Button("Generate random number");
    roll.setTheme(ButtonTheme.PRIMARY)
        .addClickListener(e ->
            Toast.show("The new random number is "
                + service.nextNumber(), Theme.SUCCESS));

    getBoundComponent().add(roll);
  }
}

05Ihr bestehender Code wird übernommen.

Bring den Code Das hast du bereits.

WebswingConnector bettet eine laufende Swing-, JavaFX- oder SWT-App in eine webforJ-Ansicht ein, sodass die Neuentwicklung nicht auf einen Schlag erfolgen muss.

ElementComposite kapselt ein benutzerdefiniertes HTML-Element oder eine Webkomponente in einer Java-Klasse und stellt dessen Eigenschaften, Attribute und Ereignisse in Java bereit.

Mehr lesen: Webswing

1HeuteSwing auf dem DesktopJahrelange Geschäftslogik – jeden Tag im Einsatz.
2Schritt 1Dieselbe App im Browser Webswing streamt es an den Browser, ohne die Quelle zu verändern.
3Von dortwebforJ, Bildschirm für BildschirmErsetzen Sie Swing-Ansichten einzeln durch webforJ.

SwingAppView.java

@Route
public class SwingAppView extends Composite<Div> {
  private final Div self = getBoundComponent();
  private WebswingConnector connector;

  public SwingAppView() {
    // Initialize the connector with your Webswing application URL
    connector = new WebswingConnector("http://localhost:8080/myapp/");

    // Set the display dimensions
    connector.setSize("100%", "600px");

    // Add to the view container
    self.add(connector);
  }
}

06KI-Tools und wie es weitergeht

Ihr KI-Assistent folgt webforJ-Konventionen.

Eine Installation des webforJ-AI-Plugins stattet deinen Coding-Assistenten mit dem webforJ-MCP-Server und Agent Skills aus.

Der Server stellt ihm Live-Tools bereit. Die Skills legen fest, wann und in welcher Reihenfolge sie verwendet werden und wie das Ergebnis überprüft wird.

Mehr lesen: KI-Tools

Terminal

claude plugin marketplace add webforj/webforj-ai
claude plugin install webforj@webforj-ai

MCP server

Die richtige webforJ-Version auswählen
In der Wissensdatenbank nachschlagen
Neues webforJ-Projekt erstellen
DWC-Theme generieren
DWC-Komponenten korrekt gestalten
Mit DWC-Design-Tokens arbeiten

Agentenfähigkeiten

webforj-adding-servlets
webforj-building-forms
webforj-creating-components
webforj-handling-timers-and-async
webforj-localizing-apps
webforj-securing-apps
webforj-styling-apps
webforj-upgrading-versions

Tour abgeschlossen

Das war der ganze Stack. Sie sind bereit zum Erstellen.

Betrachte dich als inoffiziell zertifiziert: Du hast gesehen, wie eine webforJ-App aufgebaut ist – vom ersten Bildschirm bis zu den KI-Tools, die dir beim Erstellen des nächsten helfen.

Was ist webforJ?
Komponenten und Theming
craftforJ
Daten, Formulare und Sicherheit
Ihr vorhandener Code
KI-Tools und nächste Schritte