To run this app locally you need to have Node and NPM installed on your operating system. You will also need PNPM for managing packages.
Download or clone the repository to your local machine, preferably using Git.
-
Inside the project directory, run
pnpm i
to install the project dependencies. -
Optionally create a
.env.development
file to override necessary settings. The content should be the following:# URL of the backend server. Uncomment to override the default value # VITE_API_HOST=http://localhost:3000 # VITE_CLIENT_HOST=http://localhost:3114 # VITE_HOST=http://localhost:3002 # for tests # VITE_PORT=3002 # Uncomment to use Sentry locally (not recommended) # SENTRY_DSN= # SENTRY_ENV=local-dev # These are usually set by the docker build stage, but you can provide them # APP_VERSION=local-dev # BUILD_TIMESTAMP=latest
Inside the project directory, run: pnpm dev
.
The app will be available on http://localhost:3002
. Open this url in your browser. Any changes you make should be automatically rendered in the browser.
If you update env variables you will have to restart the server.
If you wish to run the application on a different port, use the following command (replace <other-port>
with e.g. 3333
for the app to be accessible at http://localhost:3333
):
pnpm vite dev --port <other-port>
Unit tests are performed with vitest
.
Start tests with pnpm vitest
We run integration tests with Playwright.
Create a .env.test
file with the following content:
# URL of the backend server. Uncomment to override the default value
VITE_API_HOST=http://localhost:3000
VITE_CLIENT_HOST=http://localhost:3114
VITE_HOST=http://localhost:3002
# for tests
VITE_PORT=3002
# Uncomment to use Sentry locally (not recommended)
# SENTRY_DSN=
# SENTRY_ENV=local-dev
# These are usually set by the docker build stage, but you can provide them
# APP_VERSION=local-dev
# BUILD_TIMESTAMP=latest
Start tests with pnpm playwright test --ui
to open an interactive interface.
To run the tests in the command line: pnpm playwright test
. To mimic the CI behavior: CI=true pnpm playwright test
(will run the tests with a single worker -> slower).
You can open a trace from the CI locally with playwright using pnpm playwright show-report <path-to-extracted-report-file>
this will allow you to explore the report and view execution as it happened in the CI (very useful).
We use:
- Tanstack Start as the SSR framework
- Tanstack Query for the async state manager (integrates very well with tanstack start)
- Hey Api for request generation from the backend's openAPI spec
- Material UI for the UI components
- Inlang ParaglideJS for translations
- Storybook and Vitest for design library and unit testing
- Playwright for end to end testing