SeTo — Secure Toolkit for Angular

SeTo is a collection of Angular schematics that sets up, in a single command, everything an Angular project needs to be secure and properly tooled from day one: internationalization, end-to-end encryption, Content Security Policy, production bundle obfuscation, strict linting, and automated commit checks.

Instead of copy-pasting the same configuration by hand on every new project, ng add asks a few questions and generates a standardized setup, ready for demanding environments (healthcare, finance, critical infrastructure...).

Table of contents

• Installation
• Quick start
• Available schematics
• How it fits together
• Prerequisites
• Non-interactive / CI usage
• Development
• License

Installation

In an existing Angular project (standalone, generated with ng new):

ng add @martiald/seto

This installs the package and immediately runs the ng-add schematic, which lists the available configurations.

Quick start

ng add @martiald/seto shows a multi-select menu:

Which configurations would you like to add to your project?
 ◯ Translation / i18n (Transloco + @martiald/translator)
 ◯ End-to-end encryption of HTTP exchanges (@martiald/e2e-encryption) — ⚠️ requires a compatible backend
 ◯ CSP + security headers (nginx, Dockerfile, dev/prod index.html)
 ◯ Production bundle obfuscation (javascript-obfuscator)
 ◯ Lint, formatting & code quality rules (ESLint, Prettier, lint-staged)
 ◯ Secret detection on pre-commit (Husky + gitleaks)
 ◯ Dependency audit on pre-commit (npm audit)

Check what you need. Each selected schematic then runs and asks its own questions (languages, allowed domains, handshake URL...) — see the details for each below.

You can also run a single schematic directly, without going through the menu:

ng generate @martiald/seto:<name>

Available schematics

| Schematic | Role | |---|---| | translation | i18n with Transloco and @martiald/translator | | e2e-encryption | End-to-end encryption of HTTP requests with @martiald/e2e-encryption (requires a compatible backend) | | csp | Strict CSP, nginx security headers, Dockerfile, dev/prod index.html | | obfuscator | Production bundle obfuscation | | lint-rules | Strict ESLint, Prettier, lint-staged on commit | | secret-scan | Secret detection on commit with gitleaks (installs Husky) | | dependency-scan | Production dependency audit on commit |

Each link above leads to the full documentation for that schematic: options, generated files, behavior, troubleshooting.

How it fits together

The schematics are independent, but a few coupling points are worth knowing before you pick your options:

• Husky is only installed by secret-scan. If you pick lint-rules and/or dependency-scan without secret-scan, their hooks are written to .husky/pre-commit but won't run until Husky is installed.
• Fixed execution order, regardless of selection order in the menu: translation → e2e-encryption → csp → obfuscator → lint-rules → secret-scan → dependency-scan. This is also the order of the commit-time checks (lint → secrets → dependencies).
• e2e-encryption + csp: if the handshake endpoint is on a different domain than the app, add that domain to csp's allowedOrigins, otherwise the browser will block the key negotiation.
• obfuscator + csp: the Dockerfile generated by csp runs npm run build. If you also use obfuscator, replace that command with npm run build:prod so the image contains the obfuscated bundle.
• e2e-encryption requires a compatible backend. This schematic only configures the frontend: without a backend implementing the same handshake protocol, the app shows a blank screen on startup (this is intentional — see the details).

Prerequisites

• A standalone Angular project (with src/app/app.config.ts), which is the default since Angular 17.
• A Git repository, for the commit hooks (lint-rules, secret-scan, dependency-scan).
• gitleaks installed on every developer machine, if you use secret-scan.
• A backend implementing the @martiald/e2e-encryption protocol, if you use e2e-encryption.

Non-interactive / CI usage

Every option can be passed on the command line to skip interactive prompts (scripts, CI pipelines, bulk project generation):

ng add @martiald/seto \
  --features=csp,lint-rules,secret-scan,dependency-scan \
  --allowed-origins="https://api.example.com" \
  --hardware-features=camera

Options a given schematic doesn't recognize are simply ignored; options it needs but that are missing are still prompted for interactively, unless you use the Angular CLI's --defaults / --skip-confirmation mode.

Development

Clone the repo, then install dependencies:

npm install

Build the schematics (TypeScript → JavaScript, required before running tests or publishing):

npm run build

Run the unit tests (Jasmine):

npm test

Test against a real Angular project: build, link the package locally, then from the target project:

npm link <path-to>/seto
ng generate @martiald/seto:ng-add

Publishing a new version

npm run build
npm publish

License

MIT — see LICENSE.

Built by Martial · Issues · Source code