Skip to main content

Getting Started

How to use

The HydroRTC library is deployed both on the client and server side. Thus, it needs a server running Node.js to be able to run. The code is composed of two files:

hydrortclient.js //in charge of the client-side interactions and connection to the server
hydrortcserver.js //in charge of the server-side rendering and conenction with database

On the server-side, the server is deployed utilizing npm and Node.js to install the dependencies and required files. On the client-side, we have used a bundler to carry all necessary packages and dependencies into a single file that can be imported into a web page. The file package.json contains all the relevant dependencies for the server-side application.

node install
Tip

The use of bundlers for local development is not necessary, and the direct code can be accessed as is from the github repo.

After installation of all the necessary dependencies, the application containing the HTML is served utilizing node, while the client code is loaded in the application itself through either a CDN install or a direct import following:

<script src="path/to/hydrortcclient.js"></script>

or

npm install hydrortc

Once the library is loaded, you can create a new instance of the library and start using its modules and functions. Since it is deployed using a node environment, loading the library instance for the client and the server is different. To use the code, you can use the following commands

//On the server:
const HydroRTCServer = require('path/to/hydrortcserver.js');
const hydroserver = new HydroRTCServer('my-server');

//On the client app:
const HydroRTCCLient = require('path/to/hydrortcclient.js');
const clientName = new HydroRTCCLient('user-name')

The client-side application connects with the server through node and enables the two-way communication between each other. The data used for the examples found in this tutorial are directly accessed through the node application, however, other implementations can and will be implemented in the future.

Requirements

This tutorial will show how to create a Node.js application utilizing server and clientside technologies. For this, you'll be using a sandbox environment that can be tailored based on your needs.

Tip

Throughout the development of the tutorial, you will have to boot a new server utilizing the sandbox environment, and you can do it utilizing the following code:

node .
Note

The sandbox allows you to download your work on your local environment, as well as rendering and showing changes on the fly. Make sure to save what you need!

Note

We are using ES6 JavaScript and SharedArrayBuffer functionality for the development and module imports are not fully supported in Firefox. For the tutorial, we will be using the latest version of Google Chrome.