Development Environment

This guide ties together the Compose backend in authlance/deployment and the Loop Scaffold in authlance/loop-scaffold. You will boot the core services, render the dashboard config from the same .env, and run the scaffolded dashboard so nginx can proxy it through / and /authlance/loop.

1. Start the Compose Backend

Clone authlance/deployment.

Create your .env and license file:

cp .env.template .env
cp path/to/authlance.lic licenses/authlance.lic

Launch the stack and wait for the health checks printed by start.sh:
```
./start.sh
```
Keep the host dashboard in sync with the same database and NATS credentials. The README provides a sample snippet you can copy into .env.local for the scaffold:
```
DATABASE_URL=mysql://duna:secret1234@127.0.0.1:3307/duna-loop
NATS_URL=nats://localhost:4222
```

Kratos, Hydra, MySQL, the Auth Container, the License Operator, NATS, and nginx are now available for the dashboard to consume.

2. Render `app-config.json`

Compose renders the Auth and License configs automatically, but the dashboard config is intentionally left manual so you can copy it into any workspace. Use the same envsubst workflow as the ory-templates helper to create loop-scaffold/app-config.json:

cd deployment/docker-compose
set -a && source .env && set +a
envsubst < templates/app/loop-scaffold/config.json.template > ../../loop-scaffold/app-config.json

Check the resulting file into .gitignore inside your fork or refresh it whenever you tweak .env. The Helm charts mount this file verbatim at /app/app-config.json, so keeping it in sync ensures local development matches production.

3. Run the Loop Scaffold

From the loop-scaffold root:

yarn install
yarn
yarn start:dev

yarn start:dev (defined in package.json) runs yarn run watch, yarn --cwd examples/browser start:browser and node examples/browser/src-gen/backend/main.js --config=app-config.json concurrently.
The backend script reads app-config.json, so make sure the file exists before starting the command.
examples/browser/start:browser launches the webpack dev server for the React dashboard. nginx inside Compose already proxies / and /authlance/loop to host.docker.internal:3000, so the browser hits the same TLS endpoints as production.

If you only need the backend API for debugging, use yarn start:backend. To rebuild packages as you edit packages/*, run yarn watch in another terminal; it triggers rebuild.js whenever a TypeScript source file changes.

4. Iterate and Test

Add or adjust dependencies inside examples/browser/package.json and rerun yarn install when required. Scripts such as watch, build, and build:prod are all declared there.
Use the loop/app-config.json or generated loop-scaffold/app-config.json as templates when onboarding additional developers; everything resolves back to the Compose .env.

5. Build and Deploy a Custom Dashboard

Once you are ready to ship your own dashboard:

Build the production bundle:
```
yarn --cwd examples/browser build:prod
```
Use loop-scaffold/Dockerfile (or Dockerfile.dev) to bake the bundle into an image. The container ultimately runs /app/start-loop.sh, which:
- Starts nginx in the foreground.
- Calls yarn run start:backend (an alias for node ./examples/browser/src-gen/backend/main.js) so route handlers stay available.
Push the image to your registry and point either loop/deployment/helm or loop-scaffold/deployment/helm to that repository/tag by updating values.yaml.
Mount the same app-config.json via a Kubernetes secret referenced through duna.configSecret.