Lerna does no longer build browser-app module!?

Within my Node.js / yarn project I run into a strange problem. Suddenly my lerna build tool did no longer build my app module.

I am using a monorepo with module/directory structure like this

├── .gitignore
├── lerna.json
├── open-bpmn-app
├── open-bpmn-glsp
├── open-bpmn-theia
├── package.json
└── yarn.lock

The module ‘open-bpmn-app’ was ignored. As it turns out newer nx versions of lerna parse the .gitignore file in the root folder. You have to make sure that the root folder of your workspace packages is not excluded via .gitignore. In my case I had the following instructions included:


By removing these two lines the problem was solved!

See also here and here.

JsonFroms – Custom Component for SelectItems

JsonForms is a powerful and very flexible framework to build complex forms just from a JSON Schemata. A form can contain various different controls and controls can be separated into categories and layout sections. This makes JsonForrms a first-hand framework if you have to deal with dynamic forms in a JavaScript application.

JsonForms already provides different so called Renderer Sets to handle complex input widgets. But further more you can also create easily you own widget if you have special needs not supported by JsonForms out of the box.

Continue reading “JsonFroms – Custom Component for SelectItems”

Eclipse GLSP – Nodes and Moveable Labels

In my last tutorial I gave a short introduction into Eclipse GLSP and how you can get started with your own Domain specific source model. Eclipse GLSP provides a powerful and rich feature set to solve different kind of problems in the modelling area. Today I would like to show a solution to a not so rare problem in graphical modelling.

In BPMN 2.0 and other modelling languages, elements often have labels outside of the element – e.g a label below an symbol. In BPMN labels are also moveable and can be placed at any position in a diagram even if the label is associated with the symbol:

How can this be realised with GLSP? It took me a long time, but the solution is quite simple. Let’s assume you have followed my first tutorial creating your GNode Elements out from your source model. In that case you have a GModelFactory creating the GNode elements.

Continue reading “Eclipse GLSP – Nodes and Moveable Labels”

Build Your Own Modelling Tool with Eclipse GLSP

Eclipse GLSP is a new graphical language server platform allowing you to build powerful and highly adoptable modelling tools. Like many modern modelling frameworks it is based on Node.js and runs in a web browser. But unlike many other modelling tools, Eclipse GLSP takes a much broader approach. It forces the strict separation between the graphic modelling and the underlying model logic. With this concept Eclipse GLSP can not only be integrated in different tooling platforms like Eclipse Theia, Microsoft VS Code or the Eclipse desktop IDE, it also allows any kind of extension and integration within such platforms. On the project homepage you can find a lot of examples and videos demonstrating the rich possibilities.

Continue reading “Build Your Own Modelling Tool with Eclipse GLSP”

MVC 1.0 – Binding Input Values

MVC 1.0 is the new action based web framework for Jakarta EE. One advantage of the new technology is that you can work with plain html. With the expression language (EL) provided by JSP and Facelets you can easily bind values form a CDI controler to an input field:

    <input type="text" value="#{dataController.name}" name="name" />

This works also for Textareas:

    <textarea name="descripton">#{dataController.description}</textarea>

A little bit more tricky in this szeanrio is the handling of select options (Combobox). As the selected Item is defined by an attribute within the option tag a combination with EL is clumsy. But with the help of jQuery this can also be archived easily. See my following example:

  <dt>Sort Order:</dt>
      <select name="sortOrder" id="sortOrder">
        <option value="DESC">Descanding</option>
        <option value="ASC">Ascanding</option>

<script type="text/javascript">
$(document).ready(function() {
  // update the select option....

See also the tutorial “MVC 1.0 in Java EE 8 – Handling Form Submits” to learn how you can submit you form inputs with MVC 1.0.

Ben.JS becomes more secure

Today I worked on the new release 0.3.0 of Ben.JS. This new release now contains no longer eval() calls. This makes the framework more secure. The old calls were replaced by direct method calls. You can test the new release by downloading the latest version from the Download site.

Another improvement is the possibility to provide a application specific release version to Ben.JS. A release version makes sure, that URIs used  in internal load() events will be extend by the release version as a custom parameter. This avoids the annoying browser caching of html templates when you upgrade your application. You simply can start Ben.JS in your application with a custom version number like this:

var myTemplate = benJS.createTemplate({
    id : "my-template",
    url : "view.html"
var benJS = BENJS.org.benjs.core;
        appVersion : "1.0.0"

A template URI like “view.html” will be extended with the version number to “view.html?appVersion=1.0.0”


An Alternative to AngularJS and Ember…?

JavaScript FrameWork BenJS  – Version 0.2.0 released!

Today I released the latest version 0.2.0 of the JavaScript FrameWork Ben.JS. You can take a look at the idea and concept of Ben.JS on the project homepage.

My main goal for this project is to provide a tiny small and simple alternative for the big players in the area of Singe-Page-Application Frameworks (SPA Frameworks) –   especially Angular and Ember.

Today JavaScript is not only a widespread programming language, but also a platform to develop clean and stable web applications. But first of all, this is not the merit of frameworks, but of the language itself. A good way to learn using JavaScript in the right manner is the Book ‘JavaScript Patterns’ from Stoyan Stefanov.

I am convinced that for a good JavaScript application it’s enough to know the most important patterns and to understand the right usage of jQuery. And here is the most important reason for BenJS:  The core function of this framework is to transport data models into a Web page and to manage user inputs according to the data model. But in my eyes it is also important to understand, that the business logic should be encapsulated into a Web- or MicroService. For my understanding it is not the task of JavaScript to implement business logic! If you follow this principle and hide your business logic into a WebService, BenJS will be the right alternative to bring your business data into your Web application.

If you have any ideas, questions and feedback join the project on GitHub!


JavaScript Framework Ben.JS version 0.1.0 released

Today I started the release 0.1.0 of the JavaScript Framework Ben.JS. The new release includes improvements of handling view templates and for-each blocks. We tested the framework within the latest version of the Imixs-Workflow AdminClient which is now based on Ben.JS and the Imixs Rest API.

Ben.JS is a plain small and easy-to-learn JavaScript framework for single-page-applications (SPA). The framework simplifies the way to create powerful JavaScript Web Applications with a lightweight MVC framework. Read more about Ben.JS here.


Singe-Page-Application = Don’t think about the business logic!

Today, I discussed with some capable developers the pros and cons of SPA frameworks. This discussion resulted in a debate about the business logic in SPAs, which brought me to the following thoughts about a SPA architecture. In one sentence: Don’t think about the business logic!

Why? Take a moment and remember about the basic idea of a Singe Page Application, what is the general concept behind all that? Basically it is the fact that we can represent any kind of information in modern web browsers. Using HTML5, CSS3 and JavaScript enables us to deal with information in a very easy way. Browsers were build to present information – noting else!. JavaScript on the other hand is just a way to deal with some behaviour how to represent information to the user. For example: fade in some very important message, or show a bubble information text when the user moves the mouse over a picture.

On the other hand we today know very well the concept of REST Services. This is one of the major enablers of Singe-Page-Applications. All frameworks, like Backbone, React, AngularJS, Emer.JS or Ben.JS deal with REST Services and help us to handle the information which we want to show to the user. But if you think about that – these frameworks were build on the following problem: how to present data in a Web Browser using JavaScript?

Today the most SPA frameworks also deal with a heavy load of functionality which makes it hard to understand most of these frameworks. This is because people began to think about another problem: How can we process information? But this the domain of business logic. In the past this business logic was placed in server side frameworks like JEE or Spring. I think this is the right place for this kind of logic. A server should think about how data should be stored in a database, validate data, transform data or update data depending on various business rules. But the time when the Single-Page-Frameworks become more and more common in modern development, many people begun to believe that JavaScript is now the place for business logic. And so we began to use REST Services just to store and fetch data entities. But this is absolutely wrong! Business Logic means to deal with business data in a way  going conform with the business process. So business logic is something which is related to the data and not to the representation of data!

So at the end this means that you should put all your business logic into your REST Service API which is the interface between your Browser front-end and your database back-end. And now you will see what Singe-Page-Applications are really good for: they just represent the data provided by your REST Services. No business logic here! Just show the user the data provided by the back-end. This means: if there is data – show it to the user – if there was something going wrong with the data – show the error message to the user. A Singe-Page-Application can be as dumb as a Terminal application in the 1980s. Put your business logic into the back-end, and use SPA to represented your data. The result will be a  be scale-able, flexible and modern Web Application. And the best: You don’t need to worry about which framework you choose on the front-end. No matter if Angular 2.0 brings up a new concept. The goal of your Web Application is just to represent information – nothing else!

Take a look at the open source project Ben.JS which solves the problem of representing data in a web browser….

Why I started another Singe-Page-Application Framework

Today I decided to start a new open source project providing a singe-page-application (SPA) framework. This sounds crazy, because we live in a time in which so many different spa frameworks are developed.

The reason why I am interested in singe-page-application frameworks is that I have an existing complex JEE Application build on JSF 2.0 and I am looking for a way to reduce the evolved complexity of my web front-end. I don’t think that JSF can compete with SPA in modern web applications. On the other hand I already have an existing Rest Service API in my application. So this is the reason why I stared to look around for a SPA framework that fits my needs.

Continue reading “Why I started another Singe-Page-Application Framework”