mirror of
https://github.com/andwati/zitadel.git
synced 2026-10-18 05:52:51 +00:00
Wim Van LaerandGitHub
699ed17918
# Which Problems Are Solved naming inconsistencies: Configuration <-> Settings # How the Problems Are Solved # Additional Changes # Additional Context - Closes #11282
94 lines
3.1 KiB
Markdown
94 lines
3.1 KiB
Markdown
# Zitadel Management Console
|
|
|
|
The Management Console is Zitadel's management UI.
|
|
|
|
It is built using [Angular](https://angular.dev/) and part of the Zitadel monorepo.
|
|
|
|
To get started follow the [contributing quick start](../CONTRIBUTING.md#console).
|
|
|
|
### Building
|
|
|
|
To build for production:
|
|
|
|
```bash
|
|
pnpm nx run @zitadel/console:build
|
|
```
|
|
|
|
This will:
|
|
|
|
1. Generate proto files (via `prebuild` script)
|
|
2. Build the Angular app with production optimizations
|
|
|
|
### Linting
|
|
|
|
To run linting and formatting checks:
|
|
|
|
```bash
|
|
pnpm nx @zitadel/console:lint
|
|
```
|
|
|
|
To auto-fix formatting issues:
|
|
|
|
```bash
|
|
pnpm nx @zitadel/console:lint-fix
|
|
```
|
|
|
|
## Project Structure
|
|
|
|
- `src/app/proto/generated/` - Generated proto files (Angular-specific format)
|
|
- `buf.gen.yaml` - Local proto generation configuration
|
|
- `project.json` - Nx orchestration and caching for builds and tests
|
|
- `prebuild.development.js` - Development environment settings script
|
|
|
|
### Dependency Chain
|
|
|
|
The Management Console app has the following build dependencies managed by Nx:
|
|
|
|
1. `@zitadel/proto:generate` - Generates the protobuf stubs
|
|
2. `@zitadel/client:build` - Builds the TypeScript gRPC client library
|
|
3. `@zitadel/console:generate` - Generates Management Console-specific protobuf stubs
|
|
4. `@zitadel/console:build` - Creates a production build from Management Console
|
|
|
|
This ensures that the Management Console always has access to the latest client library and protobuf definitions.
|
|
|
|
|
|
### Proto Generation Details
|
|
|
|
1. **`@zitadel/proto` generation**: Modern ES modules with `@bufbuild/protobuf` for v2 APIs
|
|
2. **Local `buf.gen.yaml` generation**: Traditional protobuf JavaScript classes for v1 APIs
|
|
|
|
The Management Console app calls Zitadel v1 and v2 APIs.
|
|
As long as the Management Console still calls v1 APIs, it needs to import client stubs from separate sources:
|
|
- [Source outputs from direct buf generation for v1 APIs](#v1-stubs)
|
|
- [@zitadel/client for v2 APIs](#v2-stubs)
|
|
|
|
### <a name="v1-stubs"></a>Legacy v1 API (Traditional Protobuf)
|
|
|
|
- Uses local `buf.gen.yaml` configuration
|
|
- Generates traditional Google protobuf JavaScript classes extending `jspb.Message`
|
|
- Uses plugins: `protocolbuffers/js`, `grpc/web`, `grpc-ecosystem/openapiv2`
|
|
- Output: `src/app/proto/generated/`
|
|
- Used for: Most existing Management Console functionality
|
|
|
|
### <a name="v2-stubs"></a>Modern v2 API (ES Modules)
|
|
|
|
- Uses `@zitadel/proto` package generation
|
|
- Generates modern ES modules with `@bufbuild/protobuf`
|
|
- Uses plugin: `@bufbuild/es` with ES modules and JSON types
|
|
- Output: `login/packages/zitadel-proto/`
|
|
- Used for: New user v2 API and services
|
|
|
|
### Dependency Management
|
|
|
|
The Management Console's `project.json` ensures proper execution order:
|
|
|
|
1. `@zitadel/proto:generate` runs first (modern ES modules)
|
|
2. Management Console's local generation runs second (traditional protobuf)
|
|
3. Build/lint/start tasks depend on both generations being complete
|
|
|
|
This approach allows the Management Console app to use both v1 and v2 APIs while maintaining proper build dependencies.
|
|
|
|
## Legacy Information
|
|
|
|
This project was originally generated with Angular CLI version 8.3.20 and has been updated over time.
|