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.

01Wat is webforJ?
02Componenten en thema's
03craftforJ
04Data, formulieren en beveiliging
05Je bestaande code
06AI-tools en volgende stops

01Wat is webforJ?

Een scherm is een Java-klasse

webforJ is het full-stack Java-framework voor zakelijke webapps: je bouwt de hele app, inclusief schermen, in Java.

Een route maakt er een pagina van. Voeg @Route toe aan een klasse en deze reageert in de browser op dat adres.
Componenten zijn velden. Maak ze aan met new en reageer op klikken met een lambda.
Java of Kotlin. De Kotlin DSL bouwt hetzelfde scherm met dezelfde componenten.

Lees meer: 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/helloNa een klik

De actieve weergave toont een tekstveld met het label Hoe heet je?, een knop Zeg hallo en na een klik een succesmelding met Welkom, Lauren!

02Componenten en thema's

Componenten gebouwd voor zakelijke apps.

Velden, lijsten, dialogen, uploads, grafieken, bomen en layouts zijn inbegrepen bij webforJ. Elk is een Java-klasse die je op je scherm aanmaakt.

Theming begint met een basiskleur. Stel de primaire basiskleur in en alle 19 tinten van het palet volgen, in elk component.

app.css

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

Lees meer: Componenten

De webforJ-component ComboBox — ComboBox

De webforJ-component GoogleCharts — GoogleCharts

De webforJ-component Terminal — Terminal

03craftforJ

Bekijk de app die je met Java hebt gebouwd. Wijzig het terwijl het draait.

craftforJ is de visuele editor die in de ontwikkelmodus in je app draait. Je ziet de componentenboom die je Java-code heeft gemaakt, kunt eigenschappen live aanpassen en de wijzigingen die je behoudt terugschrijven naar je Java-broncode.

Componenten inspecteren. Blader door de componentenboom, selecteer een component door erop te klikken en wijzig de eigenschappen terwijl de app actief is.
Schrijf wijzigingen naar de bron. Controleer je live bewerkingen als diff en pas ze toe op het oorspronkelijke Java-bestand.
De AI-assistent. Een codeeragent in de actieve app schrijft Java-code, compileert die en past deze toe na jouw goedkeuring.

Lees meer: craftforJ

craftforJ

04Data, formulieren en beveiliging

Formulieren, regels en toegang, naast je backend.

Koppeling BindingContext koppelt de formuliervelden aan een bean en controleert de Jakarta-validatieregels wanneer je het formulier terugschrijft.
Spring Boot. Views ontvangen je services, repositories en andere Spring-beans via constructorinjectie.
Beveiliging. Annotaties zoals @RolesAllowed beveiligen een route en de regels worden gehandhaafd voordat er een component wordt gerenderd.

Lees meer: Presentatie

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);
  }
}

05Je bestaande code gaat mee.

Neem de code mee Je hebt het al.

Met WebswingConnector plaats je een actieve Swing-, JavaFX- of SWT-app in een webforJ-weergave, zodat je die nooit in één keer hoeft te herschrijven.

ElementComposite verpakt een aangepast HTML-element of webcomponent in een Java-klasse, met de eigenschappen, attributen en gebeurtenissen ervan in Java.

Lees meer: Webswing

1VandaagSwing op het bureaubladJaren aan bedrijfslogica, elke dag in bedrijf.
2Stap éénDezelfde app, in de browser Webswing streamt het naar de browser zonder de bron te wijzigen.
3Vanaf daarwebforJ, scherm voor schermVervang Swing-schermen één voor één door 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);
  }
}

06AI-tools en wat nu?

Je AI-assistent volgt webforJ-conventies.

Met één installatie van de webforJ AI-plugin krijgt je codeerassistent de webforJ MCP-server en Agent Skills.

De server biedt live tools. De vaardigheden geven aan wanneer je ze moet gebruiken, in welke volgorde en hoe je het resultaat controleert.

Lees meer: AI-tools

Terminal

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

MCP server

Kies de juiste webforJ-versie
Zoek dingen op in de kennisbank
Nieuw webforJ-project aanmaken
Genereer een DWC-thema
Geef DWC-componenten de juiste opmaak.
Werk met DWC-design tokens

Agentvaardigheden

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

Rondleiding voltooid

Dat was de hele stack. Je bent klaar om te bouwen.

Je mag jezelf onofficieel gecertificeerd noemen: je hebt gezien hoe een webforJ-app wordt opgebouwd, van het eerste scherm tot de AI-tools die je helpen het volgende scherm te maken.

Wat is webforJ?
Componenten en thema's
craftforJ
Data, formulieren en beveiliging
Je bestaande code
AI-tools en volgende stops