Helium Frontend Project

Prerequisites

Node 14
NPM (>= 6)

Getting Started

Note that this project is largely a placeholder. It has been used to split out frontend code from the backend, and it loosely maintained while the React rewrite of this project is completed. However, in the meantime, please be aware that Webpack is being used in a very hacky way (for instance, the generated bundle is useless and should be ignored), Nunjucks, is being used to process HTML templates, and ultimately, this is legacy code that is being completely overhauled.

Project Setup

To setup the Frontend build environment, execute:

make install

Before commits are made, be sure to run tests and check the generated coverage report

make test

Development

Vagrant Development

To emulate a prod-like environment, use the Vagrant box. It's setup is described more thoroughly in the deploy project. This is the recommended way to develop and test for production as this environment is provisioned in the same way other prod-like environments are deployed and interacts with related projects as necessary.

As the Vagrant environment does take a bit more time to setup (even though the setup is largely automated) and can consume more developer and system resources, the local development environment described below is the quickest and easiest way to get up and running.

Note that Vagrant relies on a built version of the frontend code to best simulate a prod-like environment. Thus, each time code changes are made, make build will need to be run for them to take effect.

Local Development

This is the simplest way to get started with minimal effort. Before starting the frontend development server, ensure the platform server is running at http://localhost:8000. Then, to get going (assuming you have followed the "Getting Started" directions above), then simply start the frontend server with:

bin/runserver

A development server will be started at http://localhost:3000. Note however that, since part of the way this build was hacked together circumvents many of Webpack's most useful features, live changes will not be detected at this time and would require a restart of this server.