Zum Hauptinhalt springen

Nützliche Befehle

Die App starten

npx nx start twenty-front

GraphQL-Schema basierend auf API-GraphQL-Schema regenerieren

npx nx run twenty-front:graphql:generate --configuration=metadata
ODER
npx nx run twenty-front:graphql:generate

Lint

npx nx run twenty-front:lint # Füge --fix hinzu, um Lint-Fehler zu beheben

Übersetzungen

npx nx run twenty-front:lingui:extract
npx nx run twenty-front:lingui:compile

Test

npx nx run twenty-front:test # führe JEST-Tests aus
npx nx run twenty-front:storybook:serve:dev # führe Storybook aus
npx nx run twenty-front:storybook:test # führe Tests aus # benötigt yarn storybook:serve:dev als laufenden Prozess
npx nx run twenty-front:storybook:coverage # benötigt yarn storybook:serve:dev als laufenden Prozess

Technologie-Stack

Das Projekt hat einen sauberen und einfachen Stack mit minimalem Boilerplate-Code. App Tests Tools

Architektur

Routing

React Router übernimmt das Routing. To avoid unnecessary re-renders all the routing logic is in a useEffect in PageChangeEffect.

Zustandsverwaltung

Recoil übernimmt die Zustandsverwaltung. Siehe Best Practices für mehr Informationen zur Zustandsverwaltung.

Tests

Jest dient als Werkzeug für Unittests, während Storybook für Komponententests verwendet wird. Jest ist hauptsächlich für das Testen von Dienstprogrammfunktionen und nicht für die Komponenten selbst gedacht. Storybook dient zum Testen des Verhaltens isolierter Komponenten sowie zur Darstellung des Designsystems.