Tutorial 9. Modules

Programs and modules

There are two types of modules in Drakon.Tech, actually modules and programs. Programs are active pieces of software that run in the browser or Node.js. Modules are libraries. The purpose of modules is code reuse. Programs use modules. To change a module's type, right-click on the module in the tree view and choose the module format.

Both programs and modules can depend on other modules. The Dependencies section stores the list of modules that the current module depends on.

How to add a module dependency

To add a dependency on a module:

1. Go to the module properties.
2. Add a line like this one to the Dependencies section.

dependencyName projectName/moduleName

We start with creating a program. Let' add a dependency.

Right-click on the program module, choose Properties, then click Dependencies.

First, we type the name of the dependency. Drakon.Tech will create an object that will be available in the code by this name. In our example, it is module1. Then, after whitespace, we put the module name. In our example, it is also module1. If a module resides in a different project, we must specify the project name before the module name, separated by a slash. In our case, module1 will be in the same project as the program. So we can define the dependency without the project name.

In our case, both the depedency and the module names are module1. The dependency name and module name do not need to be always the same.

For modules (but not for programs), it is possible to skip the module name in a dependency specification. Skipping the module name means "I depend on dependency module1, I don't care where this comes from, let the program take care of it."

module1

Now, let's create that module1 module. We right-click on the project and select "Create module." We choose "Module" as the module format.

module1 will export a function. It will be a function that implements multiplication. The multiply function takes two arguments, left and right. To export the multiply function, check the "Export" checkbox in the function's properties.

If we were to reference module1 from another module, the dependency specification would look like this.

module1 drakon.tech.tutorials/module1

Of course, you need to have access to the target project to reference modules inside that project.

How to use a dependency

Let's use the multiply function in the program.

We type the dependency name, then a dot, then the name of the exported function.

Let's build and run the program. Now we have proof that the code from module1 works.

6

Let's look at the code. As we can see, the source code of module1 is entirely included in the program. This JavaScript file is self-sufficient. We can deploy this file alone without worrying about the modules.

// Generated with Drakon.Tech https://drakon.tech/

(function() {

function module1_module() {
var unit = {};

function multiply(left, right) {
    return left * right
}


unit.multiply = multiply;
return unit;
}

function main() {
    var value;
    value = module1.multiply(2, 3)
    console.log(value)
}

var module1 = module1_module();
main();

})();

How to add an npm package

To add a dependency on an npm package:

1. Go to the module properties.
2. Add a line like this one to the Dependencies section.

dependencyName npm/packageName

The format of an npm dependency specification is the same as with a module dependency. The only difference is that the project name is "npm."

Let's create a Node.js program and add a dependency on the express npm package.

We go to the Dependencies section in the module properties and add this line.

Now, we can use the express package in the code that will run in Node.js.

How to run Node.js programs

1. Make sure the module format is program. The format is set in the module properties.
2. Build the project.
3. Right-click on the program module and choose "Get URL." You will get two URLs: one for the index.js file runnable by Node.js and another for the packages.json file. These URLs will not change in the future unless you change the module format.
4. Download both files and put them in a separate folder.
5. Run "npm i" in that folder.
6. Run the Node.js application as usual.

How to debug programs with npm dependencies in the browser

Go to the module properties, then click Dependencies.

Add the npm dependency to the program module as described above. The npm package must be browser-compatible. We cannot debug programs with pure Node packages in the browser.

_    npm/lodash

Go to the module properties, then click Edit HTML.

Add a script tag that includes the browser version of the package to the HTML file.

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.19/lodash.min.js"></script>

Build the program.

Click on Run in the browser.

How to build browser programs with npm dependencies for production

1. Add the npm dependency to the program module as described above.
2. Right-click on the program module and choose "Get URL."
3. Download both index.js and package.json and put them in a separate folder.
4. Run a tool that would convert the CommonJS format into JavaScript runnable by the browser, for example Browserify.
5. Include the result JavaScript file in your front-end project.

Some npm packages are supposed to be used differently in the browser than in Node.js, for example random-js.

In the browser, we use random-js like this.

number = new Random().integer(100, 200)

In Node.js, we have to add one more step to the path.

number = new Random.Random().integer(100, 200)

To account for this extra step in CommonJS code, we add that step to the dependency specification in the Dependencies section.

Random    npm/random-js/Random

The generated code in index.js will look like this.

const Random = require("random-js").Random;

How to add a Node-native "require" statement that does not need an npm package

1. Right-click on the module, then choose Properties.
2. Click the Startup button.
3. Write a require statement directly in the Startup section.

http = require("http")

The http global variable will be availabe in the code just like other globals. Do not use var, let, and const keywords because Drakon.Tech declares variables automatically.