A framework for HTML/CSS/JavaScript frontend development in pure Java.
Java JavaScript
Switch branches/tags
Clone or download

README.md

Knorxx Framework

News

Introduction

The Knorxx Framework allows to write a HTML/CSS/JavaScript frontend in pure Java. The driving force behind creating the Knorxx Framework was the lack of maintainability of HTML/CSS/JavaScript based frontends. The identifiers in all notations and between server and frontend code must be synchronized. This makes changes very hard and it's very difficult to figure out which parts of the application depend on each other. By using a pure Java codebase and constants to tie all parts together maintainability and analyzability are greatly improved.

The framework has the following features:

  • Despite using Java changes are immediately visible after browser reload
  • RPC calls and a message queue style communication is available
  • Almost no changes to the server side classes are necessary
  • Support for Source Maps which map the Java source to the generated JavaScript

The Knorxx framework uses a special ClassLoader to achieve the reloading of the Java classes (currently only tested in Netbeans). The JavaScript code is generated by st-js. Compared with writing plain st-js Java code Knorxx code needs considerably less annotations because the reloading ClassLoader is able to add them automatically. For writing HTML (renderSnake) and CSS (genesis) DSLs are used. The RPC calls are implemented by AJAX calls. Message queue style communication is implemented with the help of the Atmosphere framework.

The Knorxx Framework is server-side framework independent. It integrates via an adapter into server-side frameworks. Currently only the Spring adapter is usable. A Java EE adapter is work in progress.

Licence

The code of the Knorxx Framework is distributed under the MIT licence.

Sample project

As mentioned above the Spring adapter is the most mature adapter till now. Therefore the generator-spring-sample-app is the best way to see a Knorxx application running. Just download the current Knorxx distribution, open the framework project (framework-with-samples) in Netbeans and run the generator-spring-sample-app with Tomcat.

Note: Since st-js 3 Knorxx needs a modified version of st-js. Therfore you have to download and build the 'stjs-3.0.1-knorxx' branch of the 'janScheible/st-js' fork first.

Note: At runtime st-js needs tools.jar of the JDK. The easiest way to make it available is to copy tools.jar from $JDK_HOME/lib/tools.jar to $JDK_HOME/jre/lib/ext.

To see the reload feature in action edit for example SimpleWebPage by adding a call to a newly created helper class. Then go back to your browser and reload the page. You will immediately see the changes. More information about how to write the Java code which can be translated to JavaScript see Writing ST-JS code.

Sample Code

Web Page

Client side code

public class DemoPage extends WebPage {
	public void render() {
		$(window).load((Event evt, Element el) -> {
			alert("This is actually Java... ;-)");
		});
	}
}

CSS Definition

Client side code

public class Appearance extends CssDefinition {
	String HEADING_STYLE = build(Properties.builder()
			.setBackground(converColor(DEFAULT_COLOR))
			.setColor(converColor(Color.WHITE)));
}

RPC Service

Server side code

public class StorageService implements RpcService {
	public TestEntity getById(long id, Callback1<TestEntity> callback, Object scope) {
		return new TestEntity(id);
	}
}

Client side code

storageService.getById(0, (TestEntity testEntity) -> {
	alert(testEntity.getName());
}, this);

Message Queue

Server side code

@ManagedService(path = ATMOSPHERE_URL + "/chat")
public class ChatQueue extends MessageQueue<Data> {
	@Message
	public Data onMessage(Data data) {
		logger.debug(data);
	}
}

Client side code

callbacks = new MessageQueueCallbacks<Data>();
callbacks.onOpen = { ... };
callbacks.onMessage = { ... };
callbacks.onClose = { ... };
connection = chatQueue.subscribe(callbacks);