TypeScript + Vite Application Template

Bootstrap a TypeScript application with Vite dev server and Continuous Delivery

Prerequisites

Node.js

We aim to use the current active LTS version of nodejs, which is v20 at the time of writing. There is a .node-version file to simplify setup using nodenv.

Testing

For E2E and a11y testing with Playwright you will need to install the supported browsers:

npx playwright install
npx playwright install msedge

Git Hooks

For the provided Git hooks you will need to install lefthook (git hook manager) and talisman (secrets scanner):

brew install lefthook talisman
./run.sh init

The following hooks are specified in the lefthook.yml:

• commitlint - write conventional commit messages
• lint - avoid commiting code violating linting rules
• format - avoid commiting wrongly formatted code

Before pushing, the following checks are additionally ran:

• licenses-audit - uses license-checker to verify depency licenses
• secrets-audit - avoid accidental pushes of secrets and sensitive information

security.txt

This template contains a security.txt, where you probably want to update the expiration date. The following entries may also be added:

Policy: https://raw.githubusercontent.com/digitalservicebund/<<REPO_NAME>>/main/SECURITY.md
Canonical: https://<<PROJECT_URL>>/.well-known/security.txt

Development

Dev server

The project uses Vite to provide a bundler-less dev server, available via npm run dev.

Testing

The application has

• unit tests (using Jest)
• end-to-end tests (using Playwright)
• accessibility tests (using Axe and Playwright)

Test commands

• Run unit tests: npm test
• Run unit tests with watcher: npm test -- --watch
• Gather coverage: npm run coverage
• Run E2E tests: npm run test:e2e
• Run a11y tests: npm run test:a11y

Code quality checks (linting & formatting)

The project uses ESLint for linting and Prettier. for formatting.

Commands

• Check style: npm run style:check
• Autofix style issues: npm run style:fix
• Check lint: npm run lint:check
• Autofix lint issues: npm run lint:fix

Architecture Decision Records

The docs/adr directory contains architecture decisions. For adding new records the adr-tools command-line tool is useful but not strictly necessary:

brew install adr-tools