frontend

User Management Front-end

Setup

Install dependencies

yarn install

Development

Run development server

yarn dev

Run tests

yarn test

Run ESlint

yarn lint

Updating dependencies

A light update within semver range (low risk to break)

yarn upgrade

to manage which version and changes to adopt

yarn upgrade-interactive

Webpack Bundle Analyzer

Run in development

yarn dev:bundleanalyzer

Run on the production optimized build

yarn build:bundleanalyzer

Usage

Package Front-end

Create a dist directory containing the static files of the user interface.

yarn build

Optionally, when deploying on the cloud you may specify the URL of the back-end

yarn build --env API_URL=https://ec2-18-222-250-141.us-east-2.compute.amazonaws.com

Depending on your needs, you might want to do more optimization to the production build.

NPM distribution package (unsupported)

Can be simply created via

yarn pack

Build Docker Image

docker build . -f Dockerfile -t user-management-frontend:1.0.0-dev.1 # Docker does not support SemVer build information

As an alternative, the previous two steps (package and build image), can be executed with the multistage builder

docker build . -f Dockerfile.multistage \
--build-arg api_url=https://ec2-18-222-250-141.us-east-2.compute.amazonaws.com \
-t user-management-frontend:1.0.0-dev.1 

Run Containers

docker run --rm -d -p 80:80 user-management-frontend:1.0.0-dev.1