/webauth-frontend

Primary LanguageTypeScriptMIT LicenseMIT

Webauth-frontend

This project contains the frontend for webauth project, see more @ https://github.com/1nfiniteloop/webauth. The frontend is based on Angular framework.

webauth-frontend

Design notes

  • The api endpoints is dynamically fetched from the back-end at first launch and stored as a cookie. If endpoints has changed, clear the cookies or visit /api/endpoints to reconfigure.
  • User sessions is recognized from the presence of a cookie, which is set from the backend after a successful login.
  • All use-cases for a regular user is implemented, however the admin api endpoints is currently not implemented.

Development environment

Environment setup

Visual Studio Code is used as development environment, running a dev-container, see more @ https://code.visualstudio.com/docs/remote/containers

Preparation

  • Add a docker network for backend requests with: docker network create webauth.
  • Open VS Code in dev-container.
  • Terminal must be run in interactive mode to expose angular cli-tools: /bin/bash -l.
  • Install dependencies with npm install.

Develop

Run ng serve for a dev server. Navigate to http://localhost:4200/. The app will automatically reload if you change any of the source files. Modify proxy.conf.json accordingly to proxy back-end requests to the webauth server, Read more @ https://angular.io/guide/build#proxying-to-a-backend-server.

Build & deploy

  1. Build the dist-version with ng build --prod --deploy-url /static/. flag --deploy-url decides where the front-end requests the .js and .css-files from.
  2. Fetch the compiled files from dist/webauth-frontend.

Reference