Design First. Then Code.

Create applications driven by your design



Design your application

Design is the base of every application. System Designer will help you to create JavaScript applications driven by your design.

System Designer uses UML, a standard, to define your model. So you probably already know how to create a model in System Designer even if you have never run it.


Create components graphically

There is no need to code to instantiate a component. Create a component in System Designer is like creating a document in a NoSQL Database.

In fact, System Designer acts as an ODM (Object-Document Mapper) to manage your components as NoSQL Documents.


Code the behavior of your model

Once you have created your model, System Designer generates the skeletons of all your methods. You only have to add your code to implement them.

System Designer provides you helpers to manage your components. You can easily navigate threw components to create your application.

function fullName() {
  let result = '';
	
  // for each property a method
  // is created to set / get its value
  result = this.firstName() + ' ' + 
           this.lastName();
           
  // a dynamic type check is done 
  // to validate that inputs and ouput
  // are compliant with the model  
  return result;
}

Bundle your application

System Designer will bundle the model, components and methods of your application into a JSON object. This JSON can be then installed and started in a client or server application with System Runtime.

In fact, System Runtime can create, install and start bundles like in OSGi.

{
  "_id": "154cd18d0210516",
  "name": "app",
  "description": "",
  "version": "0.0.1",
  "schemas": {},
  "models": {},
  "types": {},
  "behaviors": {
    "1ea9c1d5f811ae1": {
      "_id": "1ea9c1d5f811ae1",
      "component": "154cd18d0210516",
      "state": "start",
      "action": "function start() {\n    console.log('Hello world !');\n}",
      "useCoreAPI": false,
      "core": false
    }
  },
  "components": {}
}

Run your application

Just add a link tag in your HTML to install your bundle into your client-side application. You can also install your bundle on Node.js easily.

You can also install many bundles, in that case all the bundles will be composed.

<!-- on HTML -->
<link rel="system" href="app.json">
// on Node.js
let runtime = require('system-runtime');

// install and start your bundle
runtime.install('app.json');