Frontend Tooling

All of our frontend code is built with yarn. A hermetic version of yarn is provided in our repository – you just need to source the env.sh file.

In addition to yarn, we will automatically download and use a hermetic version of node.js as well.

For example, here is how you build and test the catalog frontend:

. env.sh
cd ark/catalog/frontend
yarn build
yarn test

The following yarn commands are typically available:

  • start - Refreshes packages, then serves data
  • serve - Just serves, doesn’t refresh packages
  • build - Refreshes packages and builds, but doesn’t serve
  • proxy - Similar to serve, but runs an additional proxy server
  • lint - Runs the linting tools (prettier)
  • test - Runs jest

The catalog frontend makes use of Parcel for packaging – it will build the site into the dist folder.

The frontend is built entirely with Vue – there is no server-side rendering done, all rendering is done on the client side. In the catalog’s case, it talks to a C++-based api_gateway, which provides REST-access to various databases and storage layers on behalf of the client.

In order to test the api_gateway, you need to run the web server in a proxy-mode. This allows normal HTTP requests to serve up the frontend, and requests for the APIs specifically to go to the API gateway:

yarn proxy

You’ll need to start the API gateway in another terminal:

./make.sh api_gateway
./build/api_gateway