Overslaan naar hoofdinhoud

De visuele editor voor webforJ

Bekijk de app die je met Java hebt gebouwd. Pas het aan terwijl het actief is.

craftforJ draait in ontwikkelmodus binnen je app. Het toont de componentenstructuur die je code heeft gemaakt, laat je eigenschappen live aanpassen en schrijft de wijzigingen die je behoudt terug naar het Java-bestand waarin ze zijn gemaakt.

Vier sneltoetsen dekken de lus

  • Openen of sluitenAltShiftD
  • Kies een componentAltShiftC
  • Wijzigingen bekijkenCmd/CtrlS
  • Wijziging ongedaan makenCmd/CtrlZ
craftforJ geopend boven een actieve app, met AppNav geselecteerd in de componentenboom en de eigenschappen ervan in de zijbalk

Hoe het werkt

Het leest je app. via webforJ zelf

Daarom beschrijft het de app in de termen waarin je die hebt geschreven. De boomstructuur toont je componenten, de eigenschappen zijn de eigenschappen die je componenten declareren en de routes zijn de routes die je router heeft geregistreerd, met de toegangsregels waarmee je ze hebt geannoteerd.

  1. 01

    Openen

    Klik op de triggerknop boven je app of druk ergens in de app op Alt+Shift+D.

  2. 02

    Kiezen

    Druk op Alt+Shift+C, beweeg de muisaanwijzer over een component en klik erop. De boomstructuur selecteert het en de zijbalk toont de eigenschappen ervan.

  3. 03

    Wijzigen

    Bewerk een eigenschap. De actieve app wordt direct bijgewerkt, terwijl je bestanden ongewijzigd blijven.

  4. 04

    Behouden

    Bekijk de wijziging als diff en pas deze toe op het oorspronkelijke Java-bestand.

Rondleiding door de panelen

De panelen, over een echte app

Video
1 van 2

De componentenboom die je Java heeft opgebouwd

De Inspector toont je componenten, niet de markup die de browser heeft gerenderd. Een Composite wordt weergegeven als de klasse die je hebt geschreven, met de onderliggende componenten in de volgorde waarin webforJ ze bevat.

  • Druk op Alt+Shift+C en klik ergens op de pagina om het in de boomstructuur te selecteren.
  • Wijzig een eigenschap in de zijbalk en de draaiende app wordt direct bijgewerkt.
  • Traceer een component naar de Java-regel die deze heeft aangemaakt.

Terug naar de bron

Het bewerkt Java, geen kopie ervan

Neem een formulier met de knoppen Opslaan en Annuleren. Selecteer Opslaan, klik er met de rechtermuisknop op in de boomstructuur en kies Verwijderen uit bron. De declaratie, het thema, de listener, de plek ervan in de add()-aanroep en de ButtonTheme-import die nergens anders wordt gebruikt, verdwijnen. Annuleren blijft staan.

Voor

ContactFormView.java
import com.webforj.component.button.Button;
import com.webforj.component.button.ButtonTheme;
import com.webforj.component.layout.flexlayout.FlexLayout;

public class ContactFormView {
public ContactFormView(FlexLayout layout) {
layout.setSpacing("1em");
Button save = new Button("Save");
save.setTheme(ButtonTheme.PRIMARY);
save.onClick(event -> {
save.setEnabled(false);
});
Button cancel = new Button("Cancel");
layout.add(save, cancel);
}
}

Na verwijdering uit de bron

ContactFormView.java
import com.webforj.component.button.Button;
import com.webforj.component.layout.flexlayout.FlexLayout;

public class ContactFormView {
public ContactFormView(FlexLayout layout) {
layout.setSpacing("1em");
Button cancel = new Button("Cancel");
layout.add(cancel);
}
}
  • Twee instellingen, beide verplicht

    craftforJ vereist webforj.debug en webforj.devtools.craftforj.enabled. Geen van beide doet op zichzelf iets.

  • Standaard lokale toegang

    Alleen een browser op de machine waarop de app draait, kan deze bereiken totdat je een andere machine opgeeft in hosts-allowed.

  • Geen extra HTTP-oppervlak

    Het voegt geen endpoint, servlet of filter toe. Het werkt via de verbinding die je app al heeft.

  • Schrijft alleen code die compileert

    Een verwijdering uit de broncode wordt alleen opgeslagen als het resultaat nog compileert; bestanden worden nooit verwijderd.

Aan de slag

Schakel in in drie stappen

craftforJ wordt meegeleverd met webforJ, dus je hoeft niets apart te downloaden. Projecten die zijn gemaakt met startforJ of op basis van een webforJ-archetype hebben het al ingeschakeld. Start de app en ga direct naar stap drie.

  1. 1

    Voeg de afhankelijkheid toe

    Voeg webforj-devtools toe aan je project als het er nog niet in staat.

    pom.xml
    <dependency>
    <groupId>com.webforj</groupId>
    <artifactId>webforj-devtools</artifactId>
    <version>${webforj.version}</version>
    </dependency>
  2. 2

    Debugmodus inschakelen en craftforJ

    Stel beide eigenschappen in webforj.conf in, of in application.properties voor een Spring-project. craftforJ werkt alleen als beide zijn ingeschakeld.

    webforj.debug = true
    webforj.devtools.craftforj.enabled = true
  3. 3

    Herstarten, opnieuw laden en openen

    Open de app op de machine waarop deze draait. Er verschijnt een triggerknop boven je app. Klik erop of druk op AltShiftD, waar je ook bent in de app. Met dezelfde sneltoets sluit je craftforJ weer.

    craftforJ vastgezet aan de rechterrand van een app-pagina
    craftforJ zweeft standaard boven je app. Sleep het naar een rand om het daar vast te zetten, of verplaats het naar een eigen browservenster of -tabblad voor een tweede monitor.