Overview

Overview Diagram

Simplified diagram of components and their relation.

Source-code

All of the source is written in ES6+.

Client-side scripts are transpiled with Babel and bundled with Webpack.

If you're not familiar with ES6 modules, you should read about the import and export statements.

The server-side scripts runs on node v8.x+, but uses require instead of import/export.

Client

The client runs in any modern browser. The bundles are compiled down to ES5 whenever possible.

Most of the features in the client are provided by service providers.

See the official resources for modules.

You can read more about the standard provided services in the Core Tutorial;

Server

The server runs on Node.js (v8.x or later) on Express.

Most of the features in the client are provided by service providers.

See the official resources for modules.

Packages

Packages are divided into several types: application, theme and icons. All of these types are set-up and built in the same way, so to keep this article brief it will focus on applications.

By default a server.js script is provided (customizable) so that you can use to establish communication between the server and your client via HTTP or WebSockets.

The index.js and index.scss are the entry points for the bundling process and metadata.json.

See development for more information about development processes.

Package Diagram

Webpack

Webpack configuration is defined in webpack.config.js, which is used when compiling the application.

By default the index.js and index.scss files are set up as entry-points in this configuration, which will create bundled output in the dist/ folder. The output is usually named main.js and main.css (and any resources imported {dir/}{hash}.{extension}), the former of which are defined in the metadata.json file.

Metadata

The metadata.json file describes your application.

Using the files array in this file you can add what resources to load when OS.js launched the application. This usually consists of the main.js and main.css files produced by Webpack.

Modules

Modules come in several forms: service provider, cli task, authentication adapter, settings adapter, filesystem adapter.

Client modules are bundles with Webpack, just like the packages.

See the official resources for modules.

See development for more information about development processes.

results matching ""

    No results matching ""