Skip to content

Console Application

The Console application for Ioto builds Ioto and a Developer Device Manager user interface for local device management.

Overview

The Console application provides for local device management over HTTP using the Ioto embedded web server.

The Console app is a developer console for your devices. However, you can also use this application as a basis for creating your own bespoke local device management application.

The Console application includes core functionality useful for most device management apps by offering:

  • User authentication (login/logout)
  • App navigation and menus
  • Sidebar navigation
  • Display light / dark mode support
  • Dashboards with information widgets (graphs, gauges, tables, numerics)
  • Device data display, management and updating

The console uses the Ioto Device Manager VueJS core to provide this functionality.

Building

To build the Console application select the APP and run make:

1
$ make APP=console clean build

The build will achieve the following goals:

  • Build the Ioto agent with required services for local device-based management.
  • Build the Console application.
  • Copy the required configuration to the ./config directory.
  • Initialize the Ioto local database with login user definitions.

After building, the Ioto agent binary will be located in the build/PROFILE/bin/ioto file. The Manager application will be copied to the ./site directory.

Running

To run Ioto, type:

1
$ make run

Browsing

To view the Console, launch your browser and navigate to the URL:

1
https://localhost:4443

You will probably see a warning about the connection not being secure or "Your connection is not private". This is expected. This is a browser warning that the application is using a test TLS/SSL certificate. You may proceed as instructed and the app home page will be displayed.

You can login with the test user credentials:

Username Password
admin demo

Demo

The Console app includes a simple demonstration that increments a database counter every ten seconds. This demo consists of timed event running inside Ioto that increments a counter and the Console UI dashboard that displays the counter value via graph, gauge, table and numeric widgets.

Console

The source to increment the database counter is in apps/console/src/demo.c.

Device Schema

The Console app defines a Demo table in the database schema via the apps/console/config/schema.json5 that includes the apps/schemas/DemoSchema.json5.

For more information about the device schema, See:

Configuring the Console Display

The Console user interface is defined by the apps/console/config/display.json5 config file that can be modified or extended to suit your specific needs.

The display.json file defines the following items:

  • UI features
  • Displayed Name
  • Display color theme including dark and light modes
  • Logo to display in the navigation bar
  • Menu items and options
  • UI pages and panels
  • UI navigation routes
  • Data tables and fields
  • Device data edit property panels
  • Dashboard data and widgets to display

The initial display.json5 configuration file defines a "developer" skin for the console.

For more information about the display file, read Manager Display.

Learn More?

See Manager Documentation for Device Manager configuration and operation details.