hanko/frontend/examples

Hanko Examples

This directory contains examples that show

• integration of web component(s) provided through the@teamhanko/hanko-elements package (see elements).
• how to validate JSON Web Tokens (JWT) issued by the Hanko API in a custom backend

It contains:

• an example express backend - this is a simple version of the well-known todo app
• example frontend applications using the following frameworks:
  • Angular
  • Next.js
  • React
  • Vue
  • Svelte

How to run

Manual

1. Start the Hanko API (see the instructions on how to run the API in Docker or from Source)
2. Start the express backend (see the README for the express backend)
3. Start one of the frontend applications (see the README for the app of your choice)

Docker Compose

React

docker compose -f deploy/docker-compose/base.yaml -f deploy/docker-compose/todo-react.yaml -p "hanko-todo-react" up --build

Angular

docker compose -f deploy/docker-compose/base.yaml -f deploy/docker-compose/todo-angular.yaml -p "hanko-todo-angular" up --build

Next.js

docker compose -f deploy/docker-compose/base.yaml -f deploy/docker-compose/todo-nextjs.yaml -p "hanko-todo-nextjs" up --build

Vue

docker compose -f deploy/docker-compose/base.yaml -f deploy/docker-compose/todo-vue.yaml -p "hanko-todo-vue" up --build

Svelte

docker compose -f deploy/docker-compose/base.yaml -f deploy/docker-compose/todo-svelte.yaml -p "hanko-todo-svelte" up --build