AlethioDemo

This repository has been scaffolded using Nrwl Nx. It is a monorepo that holds the source code of a Web application and its backend application (aka API).

Dependency management

Installing dependencies

The project uses yarn as dependency manager. Once you have installed yarn, you can install the dependencies of this repository by running the following command:

yarn

Bundling dependencies

This repository only contains one single package.json file that lists the dependencies of all its frontend and backend applications. When a frontend application is built, its external dependencies (aka Node modules) are bundled in the resulting artifact. However, it is not the case for a backend application (for various valid reasons). It is well known that installing all the production dependencies would dramatically increase the size of the artifact. Instead, we need to extract the dependencies which are actually used by the backend application. More information about this problem can be found in this GitHub issue. For now, a copy of package json dependencies is kept for deployment. If you install a dependency please update deploy/api/package.json file. Theres a a way to fix this issue but requires time and testing.

High-level architecture

Explained briefly...

Frontend

Tracker app, the frontend application is a SPA built with:

• Typescript
• React
• Redux toolkit and React-redux implementing state slices
• Material-ui for React
• Web3-utils
• Numbro
• Date-fns (not used yet but it is the chosen option for date formatting)
• Lodash

It is deployed to Heroku using https://github.com/heroku/heroku-buildpack-static.git build pack, which is a Nginx.

Backend

The API, the backend application is driven by Nest framework. It includes:

• Typescript
• RxJs
• Swagger-ui

It also uses:

• Lodash
• Firebase admin

It is deployed to Heroku using https://elements.heroku.com/buildpacks/heroku/heroku-buildpack-nodejs build pack.

Deployment

In a nutshell the project is automated to run Continuos Integration and Delivery to Heroku using GitHub actions.

CI/CD

• GitHub Action integrate executes on Pull requests to run Unit tests and test the production build task for the code in the PR branch.
• GitHub Action tracker executes when code is pushed to master branch to deploy the frontend application.
• GitHub Action api executes when code is pushed to master branch to deploy the backend application.

For this to work you will need to configure the following GitHub Secrets in your repository:

• HEROKU_API_TOKEN | https://devcenter.heroku.com/articles/authentication#retrieving-the-api-token
• HEROKU_API_APP_NAME | Your heroku repository name for the API. You can find it in your heroku app (Dyno) > Settings > as part of the property Heroku git URL
• HEROKU_TRACKER_APP_NAME | Your heroku repository name for the frontend application. You can find it in your heroku app (Dyno) > Settings > as part of the property Heroku git URL

Default cloud provider

As mentioned before Heroku is configured as the default cloud provider to host the project in two dynos.

For this to work you will need to configure the following environment variables:

Backend application

• ALETHIO_API_KEY | The API uses Alethio Blockchain API to get data from the Ethereum Network. You will need to register to get one.
• APP_NAME | Simply your App Name for the Heroku backend. You can find it in your heroku app (Dyno) > Settings > property App Name.
• FRONTEND_APP_URL | The frontend application url. i.e. https://your-url.herokuapp.com

As a cache mechanism the API uses Firebase to store Alethio API requests' responses. Therefore, the next three variables are needed to read and write to a Realtime database. You can generate a new private key using your Web Firebase console (it downloads a JSON file), and store the following values:

• client_email as FIREBASE_CLIENT_EMAIL
• private_key as FIREBASE_PRIVATE_KEY
• project_id as FIREBASE_PROJECT_ID

Frontend application

• API_APP_NAME | Simply your App Name for the Heroku backend. You can find it in your heroku app (Dyno) > Settings > property App Name.

Local development

After installing project dependencies you have two options:

1. Run the frontend and backend applications with one single command from a terminal:

yarn nx run tracker:serveWithApi

2. Run the frontend and backend applications on different terminals:

yarn start tracker

yarn start api