Monorepo for Frontend kode for foreldrepenger.
https://navikt.github.io/fp-frontend
Lag en .yarnrc.yml-fil i hjemmefolderen din: (Bytt ut med ditt genererte token)
npmRegistries:
https://npm.pkg.github.com:
npmAlwaysAuth: true
npmAuthToken: <token>
Kjør så desse kommandoene for å installere og bygge applikasjonen:
yarn install
yarn build
En kan kjøre tester og linting både fra rot og fra de ulike pakkene:
yarn test
yarn tsc
yarn eslint
yarn stylelint
Vi har en utviklingsmetode vi kaller for "Vite mode". Den gjør at du kan bruke server som er deployet (eller i autotest) som utgangspunkt. Fordelen er at du får brukt helt "ekte" dev data, men med frontend servert fra din localhost.
- cd til appen
cd apps/fp-frontend - Kjør
yarn dev. Nå har du lokal vite-server kjørende pålocalhost:9010 - Gå til ingress i dev (https://fpsak.intern.dev.nav.no/) eller autotest (http://localhost:9000/)
- Aktiver Vite-mode:
- Legg til
/vite-oni slutten av URL-en du bruker i nettleseren (fra steg 3) - Dette setter en cookie kalt
use-local-vite-serveri nettleseren din - Cookien instruerer den deployede serveren til å sende deg en spesiell
index.html - Denne HTML-filen laster JavaScript fra din lokale utviklingsserver.
- Du vil nå se endringer du gjør lokalt mens du bruker den deployede backend-en
For å kjøre opp storybook. Gå inn i aktuell pakke og kjør:
yarn storybook
cd fp-frontend
yarn link <sti til folder på disk>
Eksempel: yarn link ../../../ft-frontend-saksbehandling/packages/sak-fagsak-profil/
cd ft-frontend-saksbehandling
Gå til aktuell pakke og kjør yarn dev
yarn link endrer på package.json og lock-filen, så husk å kjør unlink før commit/push
For å gå tilbake til å bruke publisert pakke:
cd fp-frontend
yarn unlink <sti til folder på disk>
Eksempel: yarn unlink ../../../ft-frontend-saksbehandling/packages/sak-fagsak-profil/
For å utvikle lokalt på fpfrontend mot autotest må man kjøre opp autotest (f.eks.
kjøre ./lokal-utvikling/lokal-utvikling-ide.sh
i fp-autotest-repoet). Her er det viktig å understreke at fpfrontend(:9090) også skal spinnes opp i autotest.
Det er fordi man trenger fpfrontend i docker til å få til login. Deretter kan man starte fpfrontend lokalt
på http://localhost:9010 med yarn dev.
Den lokale frontenden kjører på port 9010, for å logge seg inn må man kalle wonderwall på http://localhost:9000/oauth2/login?redirect=http://localhost:9010.
Ved innlogging gå til http://localhost:9000/oauth2/login?redirect=http://localhost:9010 - logg inn der med den brukeren du ønsker å teste med, så fortsett å jobbe videre med den lokale frontenden på http://localhost:9010.
Om man skulle få problemer med at authserver:8085 ikke finnes så må man legge inn authserver i hosts fila på
maskinen:
127.0.0.1 localhost authserver
- Legge inn readme for pakkene!
Alle DTO-er fra upstream-tjenester (f.eks. fpsak) er samlet i én generert fil med TypeScript-typer. Synkroniser jevnlig for å holde typene oppdatert.
- Synkroniser typer i dev:
yarn generate-types- Generer typer for lokale endringer (forutsetter at fpsak kjører på port 8080):
yarn generate-types lokal- Hovedregelen ved bruk av Turborepo er at dependencies skal installeres i pakkene de blir brukt. https://turborepo.com/docs/crafting-your-repository/managing-dependencies
For updated information, always see LICENSE first!
Interne henvendelser kan sendes via Slack i kanalen #fp-frontend.