OverviewDemos and ResourcesContact
Search…
What is Engine?
Key Concepts
Security
Deployment
System Architecture
Single Sign-On
Integrations
Supported Integrations
Directory Services
IoT
Location Services
Administration
Backoffice
Developer Guide
Development Environment
Building Drivers
User Interfaces
Composer
Virtual Systems
Widgets
Settings.json
API
Authentication
Control
Support
Service Desk
Powered By GitBook
User Interfaces
Building an interface for Engine is the same as building any generic web application. We try to follow industry best practices and leverage the tools used by most developers in the industry.
  • NOTE:: Windows users are recommended to install the Linux subsystem for Windows.
    • Tools such as git and your preferred text editor make sense to run on Win32
    • Whilst both NodeJS and Ruby can run natively on Windows they are much harder to manage and use effectively when compared to their Linux counterparts.

What you will need

Please install the following applications as they are core requirements for interface development
  1. 1.
    ​git - version control
  2. 2.
    A text editor
  3. 3.
    ​NodeJS - development platform
  4. 4.
    ​Ruby​

Install some core tools

The tools and libraries that help with development are available via npm which is the Node Package Manager. We recommend installing the following command line helpers
  • ​Angular CLI npm install -g @angular/cli
  • ​Gulp npm install --global gulp-cli

Running the Demo UI

This is a project that can run against the Engine development environment, for those who want some instant gratification.
  1. 1.
    Create a folder for storing your interface projects
  2. 2.
    Open a command prompt at that location
  3. 3.
    Clone the Composer Starter git clone https://github.com/acaprojects/ngx-composer-starter.git
  4. 4.
    cd ngx-composer-starter to move into the folder
  5. 5.
    npm install to install the project dependencies
  6. 6.
    gulp serve to run the development server
NB: If you are planning to run the user interface project without the Engine Developer environment, in Step 6 above you will need to use gulp serve --mock this will allow the interface to run 'headless' with mock data for development purposes.
NB: While the existing UIs are relatively plug'n'play with a locally spun up Engine environment, a domain must first be set for localhost or your machine's IP address before authentication will be functional. Ensure the domain that's set is the same as what you're accessing the frontend app with and matches the composer config in settings.json. i.e. What's typed into the browser address bar matches the settings.json and the domain configured in Engine.

Angular Resources

Angular is our preferred web application framework. We recommend being familiar with it before continuing.

Updating your environment

This will keep you running on the latest version of the platform as there are periodic updates.
  • Updating NPM: npm install [email protected] -g
  • Updating NodeJS (Windows users should download the latest MSI, unless using the Linux subsystem)
    • sudo npm cache clean -f
    • sudo npm install -g n
    • sudo n stable
Previous
Utilities and Helpers
Next
Composer
Last modified 2yr ago
Copy link
Contents
What you will need
Install some core tools
Running the Demo UI
Angular Resources
Updating your environment