Monorepo med nextjs-frontend og sanity-cms for infosider rettet mot arbeidsledige og permitterte på www.nav.no/arbeid/. Inhhold kan redigeres på www.nav.no/arbeid/cms.
npm i
npm run dev
Det funker ca sånn her:
- Start Sanity Studio opp lokalt
- Når du har startet opp Sanity Studio og åpnet det på localhost blir du bedt om å logge inn i Sanity. Når du har logget inn blir det satt en autentiseringscookie på localhost-domenet i nettleseren din.
- Nå skal liveoppdateringer funke i nextjs-frontenden på localhost (dette sørger
usePreviewSubscriptionfor, den gjør autentiserte kall fra klienten mot Sanity vha cookien du satt i forrige steg).
Opprett filen .env.development i root-folderet med innholdet:
# SECRET - DO NOT COMMIT TO GIT
SANITY_READ_TOKEN="ditt hemmelige token her"
NEXT_PUBLIC_SANITY_DATASET="development"
Trengs hvis du vil besøke sidene under /historikk som må gjøre autentiserte kall mot Sanity eller jobbe mot et development-datasett.
Sanity-token kan du lage her. Du trenger bare et token med Viewer-rettighet.
npm run dockerbygger appen i en dockercontainer på samme måte som i pipeline, hoster appen på localhost:3000/arbeid.
Det meste av innholdet som kommer fra sanity vil ha språkversjoner. Da starter typen til sanity-elementet med 'locale'. Feks:
const content = {
mySting: {
_type: "localeString",
en: "English",
no: "Norwegian",
},
};Det finnes en utilityfunksjon hentet fra Sanity-docs som leter gjennom et javascriptobjekt etter properties som starter med 'locale' for så å velge rikitg språk. Alt innhold fra sanity kjøres gjennom denne for å lette håndtering av språk.
console.log(content.myString); // "{_type: 'localeString', en: 'English', no: 'Norwegian'}"
const lang = "no";
const localizedContent = localizeSanityContent(content, lang);
console.log(localizedContent.myString); // "Norwegian"Det finnes også innhold som ikke ligger i sanity, f.eks custom lagde react-komponenter, og 404-siden. I disse komponentene ligger tekst og oversettelser i koden ved hjelp av i18next-biblioteket.
Sanity oversettelser og i18next oversettelser er i utgangpunktet ikke knyttet sammen på noe vis og fungerer uavhengig hver for seg.
Mange av de automatiske testene har testdata du man kan få visualisert dersom du går til localhost:3000/arbeid/testdata.
Nextjs sjekker med jevne mellomrom for nytt innhold fra sanity som automatisk vil gå ut i prod. Se revalidate i getStaticProps-metodene for hvor hyppig intervallet er (2 minutter i dag).
Spørsmål tilknyttet koden kan rettes mot:
- Knut Magne Riise, [email protected]
- Mikail Arslan, [email protected]
Slack: #po-arbeid-innhold, #po-arbeid, #team-dagpenger, #team-dagpenger-dev
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent