Jøkul

Jøkul er et designsystem utviklet av Fremtind.

Jøkul gir deg ferdige React-komponenter samt CSS- og SCSS-stilark for de grunnleggende komponentene og designmønstrene til Fremtind. De følger Fremtinds designprinsipper.

React-komponentene våre er den raskeste og enkleste måten å ta i bruk Jøkul. Alle komponenter og stilark leveres nå som én konsolidert pakke: @fremtind/jokul. CSSen er tilgjengelig som separate stilark, så om du ikke bruker React kan du fremdeles bruke Jøkul.

Kom i gang

For å starte utviklingsserveren for Jøkul lokalt må du først ha installert:

• Node-versjonen definert i .nvmrc, gjerne via Node Version Manager (NVM).
• pnpm, gjerne via corepack eller npm.
  • På de nye Fremtind-Macene kan det hende at du må installere corepack via Homebrew for at det skal fungere ordentlig: Installer med brew install corepack, og gjør klar med corepack install inne i Jøkul-mappa.

Oppstart og utvikling

For å komme i gang med Jøkul-prosjektet, klon repoet og installer avhengighetene:

• Kjør pnpm i på rot i repoet for å installere avhengighetene.
• Kjør pnpm dev for å starte portal + Storybook.
• Kjør pnpm dev:portal for kun portalen.
• Kjør pnpm dev:storybook for kun Storybook.

Oppsett av linting og formatering

Vi bruker verktøyet Biome for både formatering og linting av koden i prosjektet. Linting og formatering skjer automatisk ved commit, men vi anbefaler også at du setter opp IDEen din til å bruke Biome så den ikke krangler med våre innstillinger.

Det finnes plugins for både VSCode og IntelliJ, som må installeres for å få funksjonaliteten i editoren. Etter å ha installert plugin-en må du fortelle editoren at den skal bruke Biome for formatering og linting.

Oppsett av Biome i VSCode

Etter å ha installert plugin-en, åpne innstillingene og søk på format. Velg Biome under valget "Editor: Default Formatter". NB! vi anbefaler at du gjør dette under "Workspace", siden de fleste andre prosjekter bruker Prettier for formatering.

Deretter kan du søke etter eslint og fjerne avkrysningen ved "Eslint: Enable", for å unngå at Eslint krangler med Biome. Sørg også for at "Eslint > Format: Enable" er skrudd av. Disse endringene bør også gjøres under "Workspace".

Tips under utvikling

• Kjør pnpm reboot om du kommer tilbake til Jøkul-prosjektet etter en stund, eller noe ikke fungerer som du forventer.
• Om du opplever feil fra nx, prøv pnpm dlx nx reset og kjør kommandoen på nytt.

Releases

Repoet bruker Changesets på standard måte med .changeset/config.json, changeset-filer i .changeset/ og changesets/action i GitHub Actions.

Vi bruker to tydelige release-brancher:

• main publiserer stabile versjoner.
• release/next publiserer prereleases med npm-taggen next.

Dette er splittet i to egne GitHub Actions-workflows: én for stabile releases og én for prereleases.

Relevante scripts

• pnpm changeset oppretter en changeset.
• pnpm release:version kjører changeset version.
• pnpm release:pre:enter kjører changeset pre enter next.
• pnpm release:pre:exit kjører changeset pre exit.
• pnpm release:publish bygger og publiserer.

Anbefalt prerelease-flyt

release/next er den faste branchen for prereleases.

1. Gå til release/next.
2. Hvis vi starter en ny prerelease-runde og .changeset/pre.json ikke finnes, kjør pnpm release:pre:enter.
3. Hvis .changeset/pre.json ble opprettet eller endret, commit filen til release/next.
4. Lag en branch fra release/next.
5. Gjør endringene dine på branchen.
6. Hvis endringen skal publiseres, kjør pnpm changeset.
7. Lag en PR inn mot release/next.
8. Når PR-en merges til release/next, håndterer CI prerelease-versjonering og publisering med next.
9. Når innholdet i release/next er ferdig testet og klart for stabil release, kjør pnpm release:pre:exit, deretter pnpm release:version, og commit resultatet på release/next.
10. Merge release/next tilbake til main. Neste publisering fra main går da ut som en vanlig stabil versjon.

Steg 2 og 3 er bare nødvendig når vi starter en ny prerelease-runde. Filen .changeset/pre.json forteller Changesets og CI at release/next er i prerelease-modus med taggen next.

Kort sagt: main er for stabile releases, og release/next er for testing og publisering av prereleases.

Bruk av pakkene

Vi har en egen guide som hjelper deg med å komme i gang som ny bruker av Jøkul.

Dokumentasjon

I dokumentasjonen finner du:

• Informasjon om hvordan du bruker Jøkul.
• Designprinsippene til Fremtind.
• Detaljert dokumentasjon for hver komponent, inkludert eksempler.
• Guider for ulike ting, blant annet hvordan gjøre endringer i Jøkul.
• Bloggen vår, med jevnlige oppsummeringer av hva som er nytt i Jøkul.

Code of Conduct

Jøkul er et åpent og positivt felleskap der alle skal føle seg velkommen. Gjør deg kjent med våre etiske regler for bidragsytere før du deltar med bidrag.

Lisens

Jøkul er distribuert under MIT-lisensen for åpen kildekode.

Bidragsytere

Takk for bidrag fra disse flotte menneskene (emoji-oversikt):

Pio Rasch-Halvorsen 💻 👀 📖 🐛	Glenn A. Brownlee 📆 📋 🐛	Leiv Fredrik Berge 💻 📖 🚇 👀	Simen Sægrov 💻 👀 🐛	Steinop 🎨	ambientconflict 💻	Nicolai Hagen 💻
Stian Liknes 💻	hhannestad 🎨	idalower 📖	Gorild 📖 👀	Mikkel Blytt 🎨 📖	Martinvks 💻	Kristoffer Nordström 💻
Frida Thorkildsen Solhaug 💻 👀	Vegard Sørlie 💻 🐛	Bjørn Ole Bakke 💻	almli 💻	Thomas Rognes 💻	Sigve Hagesæter 🐛	EspenSmith 🤔
Murstam 🎨	fremtind-bot 📖	Jo Emil Holen 💻 📖 🐛 📝 👀	eduardodir 💻	Sercan Leylek 💻 📝 🐛	CamillaDahlstroem 🎨	Mikail Arslan 💻 🚇
Fridaks 💻	Lars-Are Gudmundsen 💻	Audun Berdal 💻 📖	fremtind-tony 📖	Jarle Berentzen 💻	stormoen 🎨	Kenneth Apeland 💻 📝 🐛 👀
Henrik Hermansen 💻	Bjørne Oma 💻 🐛 👀	William Killerud 📖 🚇 💻 🐛 📝	Espen Kvalvik 💻 🐛	Adrian Andersen 🚇	Kathrine 🎨	Tom 💻 🐛
Knut Eirik Leira Hjelle 🐛 💻	karimarkhus 🐛 🎨	Håvard Pedersen 🐛 💻 👀	Øyvind Nordbø 🎨	David Aasterud 🐛 💻	Mats Sommervold 📖	Christopher T. Hennum 🐛 💻
Marius Ingjer 🐛	Francis Paulin 💻	hegebjo 💻	Mathias Rundgreen 🐛	Elise Brenna 💻	maciejost 💻	sigrande 🐛 💻
markusleitvoll 🐛	Glenn Arnold Barosen 🤔 👀	Kristian Ulvund 📖 💻

Dette prosjektet følger retningslinjene i spesifikasjonen all-contributors. Vi setter pris på alle bidrag!