Javascript Code Generator

Javascript Code Generator

You can downlaod Visual Studio Zontroy Extension to generate code in Javascript or you can go on with Zontroy IDE.

Generate Javascript Code in Minutes

A Javascript Code Generator is a tool that makes coding process faster. Zontroy provides such a generator. It produces code in a manner that it is like written by a developer. A javascript developer can generate tons of code using Zontroy Code Generator. Let’s start!

Create a Project

Create a Zontroy project to begin generating code. Go File -> New Project menu.

On New Project window, select Empty Zontroy Project and click Create button.

Select Data Source based on your data source such as PostgreSQL, MSSQL, MySQL, Oracle or Entity Classes.

After this selection, enter Database credentials, and choose the programming Language as Javascript. Specify a project name, and select the location of the Zontroy project that will be created on your computer.

Create a Template File and Implement It

Add a template file by right clicking on the main folder and click Add File.
In the New File window select Zontroy Repeating File (.zref).
For this sample work, we create a Zontroy Repeating File as our template file, and inside this file, we are going to write the generation code. This code is going to be used to generate the actual code we want.

Give your zref file a name like the one shown above. You can write code in file name areas with Zontroy. The file name in this instance means that a file will be created for each entity in the data source and it will have the same name as the entity name.
After entering the name, Click Add File button.

function readFormData() {
    var formData = {};
    zg-for(((zg-item:::[[[zg-entity...zg-fields]]]))){{{
    formData["[[[zg-item...zg-name]]]"] = document.getElementById("[[[zg-item...zg-name]]]").value;}}}
    return formData;
}

In this Zontroy code file, we are implementing readFormDate function. For each form data item, we are iterating fields in our entity and name it as zg-item.

[[[zg-entity…zg-fields]]] is a predefined collection of fields of an entity.

In for loop, right now we can access to field property zg-name by writing [[[zg-item…zg-name]]].

In the background, Zontroy is getting the name of each field and writing it to each entity code file. Like this, we can also access other properties of a field such as data type, target type (the type in js), label etc.

Generate Your Code

Right click on the template file and click Generate This File(s).

You will see the generated files.

Open the files by double clicking and see the generated files and code lines.

actor.js

function readFormData() {
    var formData = {};
    
    formData["actor_id"] = document.getElementById("actor_id").value;
    formData["first_name"] = document.getElementById("first_name").value;
    formData["last_name"] = document.getElementById("last_name").value;
    formData["last_update"] = document.getElementById("last_update").value;
    return formData;
}

address.js

function readFormData() {
    var formData = {};
    
    formData["address_id"] = document.getElementById("address_id").value;
    formData["address"] = document.getElementById("address").value;
    formData["address2"] = document.getElementById("address2").value;
    formData["district"] = document.getElementById("district").value;
    formData["city_id"] = document.getElementById("city_id").value;
    formData["postal_code"] = document.getElementById("postal_code").value;
    formData["phone"] = document.getElementById("phone").value;
    formData["last_update"] = document.getElementById("last_update").value;
    return formData;
}

We have completed our code generation. Just in a few minutes, we’ve created 15 files and implemented them. This is just a simple example. In a similar way, you can create javascript files fully.

You can find detailed information about javascript on the official website of JavaScript and you can find more about Zontroy on our Docs page.

1 Comment